TypeScript

一、什么是TypeScript

        TypeScript是JavaScript类型的超集，它可以编译成纯JavaScript。

        TypeScript可以在任何浏览器、任何计算机和任何操作系统上运行，并且是开源的。

TypeScript的特点：

        1、所有js代码、对象和库都可以应用于ts。

        2、ts提供了强大的类型系统，静态类型的检查能力

        3、丰富了class的扩展功能（接口、抽象类）

        4、添加了系统级设计能力

TypeScript与JavaScript的区别：

JavaScript	TypeScript
运行时类型	静态类型
程序运行时类型检查	编译期类型检查
开发环境无法提供帮助	开发环境提供丰富的信息
需要大量测试，保证覆盖率	大部分由语言自身检查
最基本的class支持	完整的class支持
无系统级设计能力	完备的系统级设计能力
文档、注释	interface接口规范
人力控制	abstrace抽象类

二、TypeScript的使用

1、TypeScript的使用

        1)、下载：

npm i -g typescript

        2)、编译：

tsc ts 文件名

        3)、执行命令后会生成对应的一个js文件

2、typescript语法

1)、数据类型

        String类型

let name:string = "guoxinan"

        Boolean类型

let isLogin:boolean = true

        Number类型

let num:number = 10

        Array类型

let arr:Array<number> = [1,2,3]
let arr:number[] = [1,2,3]

let arr:Array<string> = ["你好","15"]
let arr:string[] = ["dig","你好","15"]

        Enums（枚举）类型

enum Sex { male, female}
let zhangsanSex:Sex = Sex.female;

console.log(zhangsanSex);

        Any类型

                允许任何类型的变量

        void类型（无类型）

function hello():void
    {
        console.log("hello world");
        //  return 666;
    }

三、函数

1、函数定义

function add(x:number, y:number):number {
    return x+y;
}

let add2:(x:number,y:number)=>number =function (x,y) {
   return x+y;
}

可选参数和默认参数：

        参数后?表示：这个参数是可选的

        参数后=表示：它的默认值

        传undefined，相当于使用默认值

function buildName(firstName="doubleyong", lastName?:string) :void{
    console.log(lastName ? firstName+lastName : firstName );
}

let res = buildName(undefined,"哈哈");

四、类

1、es5、es6类

function student(name,age){
    this.name = name;
    this.age = age;
    this.homework = funciton(){
        console.log("do...")
	 }
}

var zsan = new student('张三', 18)

class student{
    constrctor(name,age){
        this.name = name;
        this.age = age;
     }	
     homework(){

     }
}

class student{
// 修饰符 public , private , static ,protected 
    name:string; //这个是对this.name进行类型定义
    age:number; //this.age的类型定义
    sex:string;
    constructor(name:string,age:number) {
        this.name = name;
        this.age = age;
    }
    homework():void{
        console.log("do homework...")
    }
}

        static静态的属性和方法，不是实例对象去访问的，而是直接通过类名去调用。

2、类的继承（extends）

        示例：

class Person{
    name:string;
    age:number;
    constructor(name:string,age:number) {
        this.name = name;
        this.age = age;
    }
    eat(){
        console.log("吃饭");
    }
}

class Student extends Person{
    stuNo: string;
    constructor(name:string,age:number,stuNo:string) {
        super(name,age);
        this.stuNo = stuNo;
    }
    // eat(){
    //     console.log("吃食堂");
    // }
}

let zhangsan = new Student("zhangsan",19,"007");
console.log(zhangsan);

五、存取器（getters / setters）

        版本问题，建议先使用前执行命令：tsc greeter.ts -t es5

a=?
if(a===1 && a===2 && a===3) 结果为true

return {
	xxx:function
	xxx: 4
	xxx: "xxx"
}

return {}

六、接口

        接口的定义就只是定义不实现

interface 接口名称{
    属性:类型
}

        接口可以作为参数：

interface LabelValue{
	label: string,
	age:number,
	add: (x:number,y:number)=>number
}

function print(labelObj : LabelValue)  {
	
}