typescript

一.定义

1.type类型+ES6

2.javascript的超级

3.包含ES6

4.静态类型语言

5.类型检查,接口,oop非常完善

6.可以编译成javascript在浏览器运行

二.tsc greeter.ts

• 安装
  npm i typescript -g

• tsc常用命令
  1.tsc --init 初始化项目

2.tsc ./src/xxx.ts 编译某个文件

3.tsc -w 检测变化并编译

tsconfig.json
{"compilerOptions": {
"outDir": "./dist", //输出文件夹
"rootDir": "./src", //源文件夹
}}

三.ts常见类型

• boolean 布尔

  let b:boolean = true;
  

• number 数字

  let num:number = 18;
  

• string 字符串

  let str:string = "i love China"
  

• 数组

  let arr1:number[] = [1,3,5]
  let arr2:Array=["i","love"];
  let arr3:any = [1,2,3,"abc"];
  

• 对象 Object

  let obj:Object = {name:"abc",age:18}
  

• 任意 any

  let notSure:any = "i am abc";
  

• 没有返回 void

  function fun():void{}
  

• null类型只能是null

  let n:null = null;
  

• undefined 没有定义

  let u:undefined = undefined;
  

四.接口

1.定义

 interface Person {
  name：string，
  age：number
}

2.实现接口

  let user:Person = {
  name:"abc",
  age:18
}

3.使用

function func(p:Person){
      console.log(p);
    }
  func(user);

4.可选接口

interface Person{
name?:string,
age?:number
  }

5.只读接口

interface Ponit{
readonly x:number,
readonly y:number

}

.五函数

• 函数返回值

  function fun():void{}
  // 无返回值
  function fun():string{}
  

  // 返回字符串类型
  一旦定义了返回类型,在函数内部必须也要返回该类型

六.参数

• 参数指定类型

  function add(a:number,b:number):number{...}
  

• 参数可选

  function add(a:number,b?:number):number{...}
  

• 参数默认值

  function add(a:number,b:number=15):number{...}
  

• 箭头函数

  let add = (a:number,b:number):number=>a+b;
  

• 类(和ES6一致)
  访问修饰关键词
  修饰词既可以修饰属性,也可以修饰方法

class Animal{
  public name:string;
  constructor(name:string){this.name = name;}
}

• 简写

class Animal{
 constructor(publicname:string){this.name = name;}
  private sayHi(){}
  }

• public:默认修饰符,代表公开的

class内部可以访问
子类也可以访问
实例也可以访问

• private:私有的

class内部可以访问
子类不会继承,不能访问
实例不能访问

• protected:保护的

class内部可以访问
子类会继承,也可以访问
实例不能访问

存储器

在设置或者访问对象某个属性时,可以做一些额外的操作
实现的封装,私有变量的隐藏

步骤
01.定义私有变量
private_age:number;
02.设置set
set age(val:number){
this._age = val;
// 可以写其他逻辑
}
当实例 .age = xxx 时候会被调用这个方法

03.设置get
get age():number{
return this._age;
}
当执行实例 .age 时候被调用

04.实例化访问设置属性

let c = new Cat("abc",18);
c.age; // get age方法被调用
c.age = 19; //set 方法被调用