这是我参与「第五届青训营」伴学笔记创作活动的第 4 天

一、TypesSript是什么？

js是动态类型，在执行时编译；是弱类型语言，数据类型可以转换

ts是静态类型，在执行前编译（和c++、java相似）；是强类型语言，数据类型要明确

静态类型：

可读性强，基于语法解析TSDoc，ide增强；
可维护性增强，编译时就会暴露错误->在多人合作的大型项目中，更稳定，开发效率更高

是JS的超集：

包含兼容所有JS特性，支持共存；
支持渐进式引入与升级

二、TypesSript的基本语法有？

1、基础数据类型

在变量后面需要指定变量的类型，比如：

string类型：const a: string = 'auroras'
number类型：const b: number = 666 （包括 NAN Infinity）
boolean类型：const c: boolean = true
还有 undefined、null、object、bigint、symbol类型也是一样进行声明

2、对象类型

object类型不单单可以指定对象，还可以指定数组或函数：
const foo1: object = {};
const foo2: object = [];
const foo3: object = function(){};

如果只想指定为对象，对象属性都要提前声明类型：

  const obj: {name: string,age: number} = {  
    name: '北极光',  
    age:18  
    }

其中，给Object类型的变量赋值数字、字符串、布尔类型的值不会报错，因为它们会进行自动装箱

3、函数类型

在typescript中，函数可以声明**必选参数 **

function getInfo(name: string, age: number): string {
    return `${name} --- ${age}`;
}

console.log(getInfo("阿渣", 18)); // 正确
console.log(getInfo("阿渣")); // 错误
console.log(getInfo(18)); // 错误

同样的，也可以声明可选参数，只需要在后面加上问号即可：

function getInfo(name: string, age?: number): string {
    return `${name} --- ${age}`;
}

console.log(getInfo("阿渣", 18)); // 正确
console.log(getInfo("阿渣")); // 正确
console.log(getInfo(18)); // 错误

也可以传递默认参数，也叫初始化值：

function getInfo(name: string, age: number = 18): string {
    return `${name} --- ${age}`;
}

剩余参数是在参数类型确定但是个数不确定时使用，用...来将接收到的参数传到一个指定类型的数组中：

function sum(...answer: number[]): number {
    函数体
}

4、函数重载

重载指的是两个或者两个以上同名函数，但是如果参数不一样时会出现函数重载的情况。
在TypeScript中我们一般会去编写两个或者以上的重载函数，然后再去编写一个通用的函数。

//第一步：创建多个重载函数
function add(num1: number, num2: number): number; 
function add(num1: string, num2: string): string;

//第二步：编写通用函数以及实现
function add(num1: any, num2: any): any {
  //在这里可以进行进一步的判断
  if (typeof num1 === 'string' && typeof num2 === 'string') {
    return num1.length + num2.length
  }
  return num1 + num2
}

const result = add(20, 30)
const result2 = add("abc", "cba")
console.log(result) //50
console.log(result2) //6

5、数组类型

简单表示法： 使用类型和方括号来表示
const arr:number[]

泛型表示法： 在这里可以声明里面的元素类型
const data:Array<string | number> = [1,2,4,'54','65'];

元组表示法： 在数组里面声明每一个的数据类型
const data = [number, number, string, string]

接口表示法： interface arr{ [key:number] : any }

认识TypeScript|青训营笔记