[JavaScript知识库]TypeScript

TypeScript

1. const & let

let lang: string = 'TypeScript';//如果省略类型说明，TS也会进行自动推断
// lang = 1010;//error!如果需要使用联合类型：let lang: number | string = 'TS';
let age: number = 89;
let age_2 =64;
const pi :number = 3.1415926;//pi的值不能被改变，类似常量
// pi = 3.14;//error

2. 解构

//解构数组
let input = [89,64,65,2018,10];
let [first,second] = input;//注意使用[]
console.log(first);
console.log(second);
let [one,...other] = input;//剩余变量
console.log(...other);
//展开
let newArray = [89,...other,18];
console.log(newArray);
//解构对象
let o = {
    a: "foo",
    b: 12,
    c: "bar"
};
let {a,b} = o;
console.log(a,b);

3. 函数

/**
 * 1.使用完整类型定义
 * 2.可选参数
 */
//使用完整函数类型定义
function add(x: number,y: number):number{
    return x+y;
}
//匿名函数
let myAdd = function(x: number, y: number): number{return x+y;};
console.log(myAdd(1,2));
//可选参数
function greeting(firstName: string, lastName?: string){
    if(lastName)
        return `Hello ${firstName} ${lastName}`;
    return `Hello ${firstName}`;
}
console.log(greeting("Zhou"));
console.log(greeting("Zhou","Wang"));
//默认参数
function greeting_2(firstName: string, lastName = 'Wang'){
    return `Hello ${firstName} ${lastName}`;
}
console.log(greeting_2("Zhou"));
console.log(greeting_2("Zhou","Zeng"));
//剩余参数
function greeting_3(firstName: string, ...restName: string[])
{
    return `Hello ${firstName} ${restName.join(' ')}`;
}
//箭头函数
//无参数：函数体只有一行代码，则改行结果为返回值
let greeting1 = () => `Hello TS!`;
console.log(greeting1());
//一个参数，函数体只有一行代码，则执行结果为返回值
let greeting2 = (name: string) => `Hello ${name}`;
console.log(greeting2("Zhou"));
//有两个及以上参数，函数体代码只有一行，则该行结果为函数返回值
let add2 = (a: number, b: number) => a+b;
//两个及以上参数，函数体有多行代码，必须用{}包裹，并且显示给出返回
let add3 = (a: number, b : number) =>{
    let s=a+b;
    return s;
}
console.log(add3(1,2));

4. 类

//类的定义和使用
class MyInfo { //class是关键字，类名默认全部大写首字母
    name: string; //属性
    weather: string; //属性
    
    constructor(name: string, weather: string){ //构造函数，一般用于初始化。如果没有，TS会自动生成一个，以备用new创建类实例时调用。
      this.name = name;
      this.weather = weather;
    }
    printInfo(): void { //其它函数，无返回值
      console.log(`Hello, ${this.name}.`);
      console.log(`Today is ${this.weather}.`);
    }
  }
  
  let myData = new MyInfo('QiGe', 'raining'); //使用new关键字生成对象，即该类的实例
  myData.printInfo();

5. 类的属性和函数的访问权限

//访问权限
class MyInfo2 { //class是关键字，类名默认全部大写首字母
    public name: string; //public属性，可省略
    private _weather: string; //私有属性，习惯以_开头进行命名
    
    constructor(name: string, weather: string){ //构造函数，一般用于初始化
      this.name = name;
      this._weather = weather;
    }
    printInfo(): void { //其它函数
      this._test();
      console.log(`Hello, ${this.name}.`);
      console.log(`Today is ${this._weather}.`);
    }
    private _test(): void {
      console.log('You can not call me outside!');
    }
  }
 let myData2 = new MyInfo2('QiGe', 'raining'); //使用new关键字生成对象
//   console.log(myData._weather); //error!
//   myData2._test(); //error
  myData2.printInfo();
            

6. 静态属性

//静态属性，内建或自定义，无需new即可使用
console.log(Math.round(89.64)); //90
console.log(Math.pow(2, 8)); //256
class MyStaticClass {
  static place = 'Earth';
  static printInfo() {
    console.log('We have only one Earth!');
  }
}
console.log(MyStaticClass.place);
MyStaticClass.printInfo();
          

7. 继承

class Animal {
    // 当构造函数传入的参数加上了“访问权限控制符”，则同时会声明同名类属性，并赋值
    constructor(public name: string) { }
    protected log(message: string) {
      console.log(message);
    }
    move(distanceInMeters: number = 0) {        
      this.log(`${this.name} moved ${distanceInMeters}m.`);//请注意name来自何处
      this.log('==============');
    }
  }
  
  class Horse extends Animal {
    constructor(name: string) { 
      super(name); // 通过super调用父类构造器
    }
    run(distanceInMeters = 50) { //自己独有的函数
      this.log("Clop, clop..."); 
      super.move(distanceInMeters); // 通过super调用父类方法
    }
  }
  
  class Eagle extends Animal {
    constructor(name: string) { super(name); }
    reborn() { //自己独有的函数
      console.log('Reborn？ It is a joke, hahaha!');
    }
  
  }
  
  let tom: Horse = new Horse("Tommy the Palomino");
  tom.run(8964);
  let sam: Eagle = new Eagle("Sammy the Hawk");
  sam.move(1024);//sam的move函数来自何处？
  sam.reborn();