typescript 学习

typeScript 对比 javaScript 的话,typeScript 的能够在编写的过程中就发现问题,typeScript是一门强语言类型的语言,能够在编写的时候,就发现错误,而 javaScript 是一门弱语言类型的编程语言 ,只有在编译的时候才能发现错误.因此,typescrip开发大型项目就会比较好用.且更加的牢靠,且typeScript是一门基于javascript编程之上的语言,它是javaScript 的超集

那么像在日常的开发中,小项目的话,一般是建议直接使用javaScript本身,然后在大型的项目中,一般是使用typeScript来进行开发的.

(小编感受哈! 我们一般学的时候,是先学 js 的,然后才会慢慢接触其他的东西,ts 呀,其他阿巴阿巴阿巴 之类的,学了 js 之后,学起 ts 也比较轻松,就是记住了它的编程规则,一次不行就多写几次,就像敲键盘一样哈,敲多了,就盲敲了.个人觉得,ts 的话,开发大型的项目的话,确实是比较规范的,能解决不少的问题,很明显的感受吧,就是,编写 ts 代码的时候,就已经发现错误的代码了,那就不需要打开 控制台查看了,然后使用 ts 编写的项目后期的话维护起来也更加的方便.)

数据类型

1. 布尔类型（boolean）
2. 数字类型（number）
3. 字符串类型（string）
4. 数组类型（array）
5. 元组类型（tuple）
6. 枚举类型（enum）
7. 任意类型（any）
8. null 和 undefined
9. void 类型
10. never 类型

11. 
    // 一共有十种类型
    
    // 1、布尔类型的
    let bool:Boolean = false
    console.log(bool); // false
    
    // 2. 数值类型
    let num:Number = 123
    console.log(num);
    
    // 3. 数组类型(有 三 种类型)
        // 1. 第一种
    let arr:Number[] = [1, 2, 3]
    
        // 2. 第二种  类型为 元组
    let arr2:Array<number> = [1, 2, 3, 4, 5] 
    
        // 3. 第三种方式 类型为 any
    let arr3:any[] = [1, 2, 3, true, "123"]
    
    // 4. 枚举类型 
      /* 
        enum 枚举名{
          标识符[=整形常数],
          标识符[=整形常数],
          ...
          标识符[=整形常数],
        }
      */
          // 枚举类型有赋值的情况
          enum Flag {
            success = 1,
            error = 0
          }
          let s: Flag = Flag.success
          let e: Flag = Flag.error
          console.log(s); // 1
          console.log(e); // 0
    
          // 枚举类型没有 赋值 的情况
          enum Color {
            blue,
            red,
            orange
          }
    
          let c: Color = Color.red
          console.log(c); // 没有值的时候,是将 下标 进行 输出 // 1
    
          // 枚举类型 的标识符有的赋值了,有的没有赋值
          enum Car {
            bwm,
            honda,
            jeep = 3,
            toyota
          }
          let t: Car = Car.toyota
          console.log(t); // 4 这里的前面的jeep 已经赋值 3 了,与Toyota的下标冲突了,所以这里的值,为 4
    
    // 5. 任意类型
    let an: any = '123'
    an = true
    console.log(an); // true
    
    // 6. undefined 数据类型
      let number: undefined
      console.log(number); // undefined
    
      let number1: Number | undefined
      number1 = 123         // 有值的时候为 123,没有值的时候为 undefined 
      console.log(number1); // 123
      
    // 7. null 数据类型
      let uNull: null | undefined | Number
      uNull = 123
      uNull = null
      console.log(uNull); // null
    
    // 8. void 用于函数没有返回值
      function get(): void {
        console.log('get')
      }
      get() // get
    
    // 9. never 从来都不会出现的值'
      var a: never
      a = (() => {
        throw new Error("错位"); // 抛出异常之后,代码就不会向下执行了
      })() // a 为一个立即执行函数 

1. ts的函数

// ts 函数
  // 1. 函数的表达式
  var fun = function (): string {
    return '这是一个函数表达式'
  }
  fun()

  // 2. 函数声明
  function func(): string {
    return '这是一个函数声明'
  }
  console.log(func()); // 这是一个函数声明
  
  // 函数的传参
  function getInfo(name: string, age: Number): void {
    console.log(`姓名是${name}今年是${age}岁`);
  }
  getInfo('清云', 20) // 姓名是清云今年是20岁
    
  // 可选传参
    function tranInfo(name: string, age?: Number): string { // 加 ? 表示可传可不传
      if(age){
        return `${name}---年龄${age}` 
      }else {
        return `${name}---年龄保密`
      }
    }
    console.log(tranInfo('清云', 20)); // 清云---年龄20
    console.log(tranInfo('夏阳')); // 夏阳---年龄保密
    

2. ts 的类
 

// ts 的类,定义 class 类
class Person {
  name: string
  constructor(name: string) {
    this.name = name
  }

  getName(): string{
    return this.name
  }

  setName(): void{
    this.name
  }
}
let person = new Person('清云')
console.log(person.getName()); // 清云
console.log(person.setName()); // undefined

// class 的继承

// ts 的类,定义 class 类
class Person1 {
  name: string
  constructor(name: string) {
    this.name = name
  }

  run(): string{
    return `${this.name}在跑步`
  }
}
// Man 继承父类
class Man extends Person1 {
  constructor(name: string) {
    super(name) // 初始化父类的构造函数
  }
}
  let z = new Man('刘翔')
  console.log(z.run()); // 刘翔在跑步

// 当字类与父类的方法有冲突的时候,优先使用字类的方法
class Man1 extends Person1 {
  constructor(name: string) {
    super(name) // 初始化父类的构造函数
  }
  run(): string{
    return `字类--------${this.name}在跑步`
  }
}
  let q = new Man1('刘翔')
  console.log(q.run()); // 字类--------刘翔在跑步

3.ts 的三种修饰符 （public 、 protected 、 private）

  // public protected private 三种修饰符
  //  1. public 公共 在公共的类里面,子类 类的外面, 都可以访问
      class Person2 {
        public name: string // public 表示这个属性是共有的,字类的话,可以访问,也就是继承
        constructor(name: string) {
          this.name = name
        }
        work(): string {
        return `${this.name}在努力的赚钱`
        }
      }

      let p = new Person2('清云')
      console.log(p.work()); // 清云在努力的赚钱
      console.log(p.name); // 清云
      

    //  定义一个一个字类继承父类
    class Man2 extends Person2 {
      constructor(name:string) {
        super(name)
      }

      run(): string {
        return `${this.name}在努力的赚钱`  
      }
    }
    let p1 = new Man2('清云2')
    console.log(p1.run()); // 在 Man2 中并没有name 这个属性,Man2 是通过 public 这个可以访问到父类的 name 属性,实现继承
 

 
    // protected 修饰符
    class Person3 {
      protected name: string // protected 表示这个属性是是受到保护的,字类的话,可以访问,但是在外部无法访问,也就是 console.log(p2.name); 
      constructor(name: string) {
        this.name = name
      }
      work(): string {
      return `${this.name}在努力的赚钱`
      }
    }

    let p2 = new Person3('清云')
    console.log(p2.work()); // 清云在努力的赚钱
    console.log(p2.name); // 这个会报错的,因为在外部无法访问 


    //  定义一个一个字类继承父类
    class Man3 extends Person3 {
    constructor(name:string) {
      super(name)
    }

    run(): string {
      return `${this.name}在努力的赚钱`  
    }
    }
    let p3 = new Man3('清云2')
    console.log(p3.run()); // 在 Man2 中并没有name 这个属性,Man2 是通过 protected 这个可以访问到父类的 name 属性,实现继承



    
    // private 修饰符
    class Person4 {
      private name: string // private 表示这个属性是是私有的,字类的话,不可以访问,外部也无法访问 
      constructor(name: string) {
        this.name = name
      }
      work(): string {
      return `${this.name}在努力的赚钱`
      }
    }

    let p4 = new Person4('清云')
    console.log(p4.work()); // 清云在努力的赚钱
    console.log(p4.name); // 这个会报错的,因为在外部无法访问 


    //  定义一个一个字类继承父类
    class Man4 extends Person4 {
    constructor(name:string) {
      super(name)
    }

    run(): string {
      return `${this.name}在努力的赚钱`   // 无法访问父类的 this.name 属性,因为这个属性是 私有的,无法访问到
    }
    }
    let p5 = new Man4('清云2')
    console.log(p5.run()); // 在 Man2 中并没有name 这个属性,Man2 是通过 protected 这个可以访问到父类的 name 属性,实现继承