乐趣区

关于javascript:TS里interface和type

TS 里 interface 和 type 怎么用的,区别是什么?

一.interface 最常见的是:对象类型接口;

1. 对象类型接口用于定义对象的类型:

interface IPerson{

name:string;

age:number;

}

let tom:IPerson={

name:’Tom’;

age:25;

}

  1. 接口中未定义的属性不能在对象中应用,会报错;
  2. 对象的属性个数必须和接口的属性个数完全一致,除非应用了‘?’的可选属性;
  3. 对象接口的几个属性:

interface IPerson{

name:string;——> 确定属性

age?:number;——> 可选属性

readonly id:number;——> 只读属性

}

  1. 留神:一旦应用了任意属性,那么,确定属性和可选属性的属性值类型必须是任意属性值类型的子集(统一或者是子集);

如:如果 [propName:string]:string,那么 age?:number 就会报错

5. 只读属性只能在定义接口类型的时候赋值,如在接口中,但不能在其余中央从新赋值(因为它是只读的属性,不能从新赋值);

interface FullName {

     firstName:string;

     secondName:string;

}

function printName(name:FullName){

     console.log(name.firstName);

}

let obj={// 传入的参数必须蕴含 firstName 和 secondName, 但能够有其余参数;

// 如果间接传入,就会报错,间接传入只能是 firstName 和 secondName,不能蕴含 其余的;

     age:20,

     firstName:’ 张 ’,

     secondName:’ 三 ’

};

printName(obj);

//2. 函数类型接口:

interface encrypt{

(key:string,value:string):string;

}

let md5:encrypt=(key:string,value:string):string=>{

return key+value;

};

console.log(md5(‘name’, ‘zhangsan’));

二.type 是类型别名, 就是给类型起一个新名字,必须应用 type 对新名字进行定义;

如:type Name=string;

如:type a=string | number;

如:type NameResolver=()=>string; 这里的‘=>’不示意箭头函数,箭头右边示意形参,左边示意返回值;

  1. 类型别名,罕用于联结类型,如:type a=string | number;
  2. 应用’typeof 变量’,拿到变量的类型;
  3. 类型别名和字符串字面量类型都必须应用 type 进行定义;
退出移动版