web期末作业-ts总结

TS基础总结

TS是js的超集，它可以通过在严格的语法规定下进行编程开发，并将ts文件编译为js代码。原生js解释器在很多情况下对错误的语法，错误的使用不报错，使用ts可以解决这个问题，以便更好地进行前端开发。

安装

• 安装node.js
• 管理员运行终端，输入指令npm -g install ts-node typescript

语法

定义变量

ts中在定义变量的时候，需要指明其变量类型，此外不能使用var进行声明，只能使用let或者const，这样变量只在对应的代码块运行。

let a :number = 1;
const pi :number = 3.14;

定义函数

ts中，我们可以使用完整的函数定义格式。

function 函数名 (参数列表) : 返回值类型{

}

function func1 (x1 :number,x2 :number) : number{
    return x1 + x2;
}

与js不同，ts中如果我们定义了参数名，那么我们在调用该函数的时候就必须为其赋值。

ts也允许拥有可选参数，即可以对该函数传值，也可以不传。对于可选参数，在声明时在其变量名后加上问号。

function func1 (x1 :number,x2? :number) : number{
    if (x2)
        return x1 + x2;
    return x1;
}

可选参数必须跟在必需参数后面。

我们还可以通过一种名为箭头函数的形式，进行简化定义函数。

//将箭头后面的数据作为返回值
let a: string = () => '123456' 
let a: string = (str:string) => '123456${str}' 

//函数体代码多于一行的时候，用{}对其进行包裹，使用return返回数据
let a : number = (num:number) => {
    number = number + 10;
    return number;
}

定义类

在这里，类的概念与众多高级语言的类以及极为相似。类相当于一种自定义的引用型数据类型，用于定义对象。

以下是一个类定义:

class Info{
    private name : string;
    private age : number;
    constructor(name : string,age : number){
        this.name = name;
        this.age = age;
    }
    getName() : string{
        return this.name;
    }
    getAge() : string{
        return this.age;
    }
    setAge(age : number){
        this.age = age;
    }
    setName(name : string){
        this.name = name;
    }
    func1(){
        alert (this.string +","+ this.age)
    }
}

从上面的代码可以看出，在ts中，类也存在属性，构造器，方法，setter/getter，访问权限，与其他高级程序语言中的类几乎相同。

除此之外，ts中的类同样支持静态变量与函数，以及继承。