TypeScript - 技术栈

TS基础语法

1.声明

语法：

let:类型 = 值（也可不赋初值）

1.1.变量声明

以关键字let开头的声明引入变量，该变量在程序执行期间可以具有不同的值

复制代码

let hi:string = 'hello'
hi = 'hello,you'

语法：

let 变量名：数据类型 = 初始值

let 变量名:数据类型

1.2.常量声明

以关键字const开头的声明引入只读常量，该常量只能被赋值一次。

复制代码

const hello:string = 'hello'

语法：

const 变量名：数据类型 = 值

若是对常量重新赋值会造成编译时错误

1.3.自动类型推断

如果一个变量声明时并未指定他的类型，但是给定了初始值，则TS就会根据给定的值进行自动类型推断

复制代码

let hi = 'hello' // Ts会自动类型推断为String类型，若赋值其它类型的值会编译错误

2.类型

2.1.Number类型

TS提供number和Number类型，任何整数和浮点数都可以被赋给此类型的变量。

复制代码

let num:number = 3.14

2.2.Boolean类型

boolean类型由true和false两个逻辑值组成。

通常在条件语句中使用boolean类型的变量

复制代码

let isDone:boolean = false;
if(idDone){
console.log('Done!')
}

2.3.String类型

复制代码

let s1:string = 'hello'

2.4.Array类型

array,即数组，是由可赋值给数组声明中指定的元素类型的数据组成的对象

复制代码

let arr:number[] = [1，2，3，4]

语法：

let 变量名:数据类型[] = 值

2.5.Enum类型

enum类型，又称为枚举类型，是预先定义的一组命名值的值类型，其中命名值又被称为枚举常量

使用枚举常量时必须以枚举类型名称为前缀

复制代码

enum colorSet = {Red,Green,Blue} //也可以赋值
let c:colorSet = colorSet.Red

2.6. undefined类型

表示变量未被声明就被使用

2.7.nulll

表示变量被声明了但并未赋初值

3.语句

3.1 If语句

3.2.Switch语句

3.3.For语句

for in ：

可以遍历数组，得到索引值

也可遍历对象，得到键名

for of:

用于遍历数组，得到值

4.函数

4.1.函数声明

语法：

function 函数名(参数：类型，参数：类型)：返回类型{

函数体

}

4.2.可选参数

可选参数就是在参数变量后加一个？表示这个参数传不传都可

语法：

function 函数名(参数？：类型，参数：类型)：返回类型{

函数体

}

4.3. 返回类型

函数的返回类型可以是上述所列类型中的一种，若是函数没有返回值，则可以设置为viod(表示没有返回值)

4.4.箭头函数

语法：

let 变量名 = (参数：类型，参数：类型)=>返回类型

5.类

在TS种，有两种创建对象的方式：

1.直接进行字面量方式进行创建

复制代码

 let 变量名 = {键名：值}

2.使用类的方式+new对象的方式（可以大规模的创建很多对象，可以被作为一个模板，集中产出对象）

复制代码

 class 类名{
 属性：值
 constructor(参数：类型){
 函数体
 }
 方法名(){}
}
创建对象：
let 变量:类名 = new 类名()

5.1静态属性

静态属性（方法），也称为类属性。

使用静态属性无需创建实例，通过类即可直接使用

静态属性（方法）使用static开头

如果类中的方法以static开头的话，就是静态方法也就是类方法，只能被类调用，实例不能调用

readonly 表示只读属性，无法修改

public默认公共的私有属性private,外部要想访问，则要使用get，set方法

复制代码

     //set用于修改private的属性
        setAge(value:number):number
        {
          if(value>1){
            return this.age = value;
         }
      }
    //get方法，用来得到private属性
      getAge():number{
         return this.age
           或者 this.age = 1
      }

5.2类的继承（extends）

一个类可以对另一个进行继承，被称为子类和父类,继承后子类将拥有父类种写的所有东西

复制代码

  class Animal{
       name:string;
       age:number;
       constructor(name:string, age:number){
           this.name=name;
           this.age=age;
       }
       sayHello(){
           console.log('动物在叫~')
       }
   }

子类继承父类

如果在子类中添加了和父类相同的方法，则子类会覆盖父类的方法

子类覆盖父类方法的形式，称为方法重写

复制代码

class Dog1 extends Animal {
    run(){
        console.log(`${this.name}在跑`);
    }
    sayHello(){
        console.log('汪汪汪~')
    }
}
class Cat extends Animal {
    sayHello(){
        console.log('喵喵喵~')
    }
}

注意：

当子类中有constructor方法时，会覆盖父类的constructor方法，必须在子类中对父类中的构造器进行显式调用

复制代码

constructor(参数:类型){
super(父类的参数)
子类函数体
 }

类的继承最重要的是实现多态关系

let b:父类型 = new 子类型()

5.3抽象类

当一个类前有abstract关键字时，代表当前类是抽象类，抽象类是专门用来被其他类所继承的类，它只能被其他类所继承不能用来创建实例

5.4抽象方法

使用abstract开头的方法叫做抽象方法，抽象方法没有方法体只能定义在抽象类中，继承抽象类时抽象方法必须要实现（子类必须对抽象方法进行改写）

6. 类型声明(Type)

描述一个对象的类型，不可以重复声明

复制代码

type  myType ={
    name:string,
    age:number
};
let obj:myType = {值}

7.接口（interface）

接口的作用类似于抽象类，不同点在于：接口中的所有方法和属性都是没有实值的，换句话说接口中的所有方法都是抽象方法；
接口主要负责定义一个类的结构

接口可以去限制一个对象的接口：对象只有包含接口中定义的所有属性和方法时才能匹配接口；
同时接口也可以当作类型声明用，接口可以重复声明

复制代码

interface myInterface{
    name:string,
    age:number
}
interface myInterface{
    gender:string
}

const obj:myInterface ={
    name:'1',
    age:20,
    gender:'male',
}

同时，可以让一个类去实现(implements)接口，实现接口时类中要保护接口中的所有属性；

复制代码

class MyClass implements myInter{
    name:string;
    constructor(name:string){
        this.name = name
    }
    sayHello() {
        console.log('1111')
    }
}

8.泛型

定义一个函数或类时，有些情况下无法确定其中要使用的具体类型（返回值、参数、属性的类型不能确定）；

此时泛型便能够发挥作用；

复制代码

//T可以传任意类型，加大了代码可复用性
   function test<T>(arg: T): T{
       return arg;
   }

9.this关键字

关键字this只能在类的实例方法中使用。

示例

复制代码

class A {
  count: string = 'a'
  m(i: string): void {
    this.count = i;
  }
}

关键字this的指向:

●调用实例方法的对象

●正在构造的对象