TS基础

基本数据类型

布尔，数字，字符串，数组，元组，枚举，null，void，undefined，never，any，object

类型说明

语法：变量：类型

let num: number;//声明一个数字类型的变量num
let num2: number | string = "s";//联合类型，表示声明一个数字或者字符串类型的变量

类型断言

语法：尖括号语法和as语法

let someValue = "this is a string";
// let someLength: number = (<string>someValue).length;//number也可以省略（类型推断）
let someLength = (someValue as string).length;//与上方等价，但在ts中使用jsx时，只能使用as语法

接口

interface labelType {
  //声明接口类型，属性如下
  readonly id: number; // readonly只读属性不允许改变
  age?: number; // 加上问号 表示是可选属性
  label: string; //声明一种类型对象，属性label的类型是string
}
function printLabel(labelledObj: labelType) {
  console.log(labelledObj.label);
}
printLabel({ id: 1, label: "Size 10 Object" });

接口的继承

interface interface1 {
  s1: string;
}
interface interface2 {
  s2: number;
}
interface interface3 extends interface1, interface2 {
//此时interface3已经包含 s1:string, s2: number
  s4: string;
}
let num3: interface3 = {
  s1: "a",
  s2: 2,
  s4: "c",
};

交叉类型

//  interface Person { name: string }
// interface People { sex: string }
// type PersonMan = Person & People  
type PersonMan = { name: string; sex: string };//与上方三行等价

交叉类型和接口继承之间的区别

相同点： 都可以实现对象，函数类型的继承 不同点：

1、写法不同：type使用等于号，interface没有等于号，继承type使用&，interface使用extends
type PersonMan = Person & People  //type不可以拓展
interface PersonMan extends Person , People {} //interface可以拓展
2、相同名称，type会报错，而interface会合并
3、type可以创建联合类型，而interface不可以（type可以定义基本类型的别名，如 type myString = string，而interface不支持）

函数类型

interface SearchFunc {
  (s1: string, s2: string): string;
}
//用接口定义函数
let mySearch: SearchFunc = function (src, sub) {
  let result = src + sub;
  return result;
};
//普通函数类型
function mySearch2(x: string = "x is string", y?: string): string {
  // 参数默认值，此时x的默认值就是'x is string'
  //y此时属于可选参数，注意可选参数必须在必需参数后面，即，可选参数后面不允许在出现必须参数了。
  return y ? x + y : x;
}
//函数表达式
let mySearch3: (x: number, y: number) => number = function (x = 3, y): number {
  // 参数默认值，此时x的默认值就是3
  return x + y;
};

泛型

不必传入具体类型，而是使用形参T代替，会自动追踪类型。泛型解决类，方法，接口等的复用

//泛型函数
function identity<T>(arg: T): T {
  return arg;
}
identity("123");
identity(123);
//泛型接口
// 写法一
interface Config {
  <T>(val: T): T;
}
var getData: Config = function <T>(val: T): T {
  console.log(val);
  return val;
};
getData("200");
// 写法二
interface Config2<T> {
  (val: T): T;
}
var getData2: Config2<string> = function (val = "1") {
  return val;
};