TypeScript 笔记

说明

• 以JS为基础构建的语言
• 一个JS的超集
• TS扩展了JS，并添加了类型
• 可以在任何支持JS的平台中执行
• TS不能被JS解析器直接执行，需要编译成JS再执行

开发环境搭建

• 全局安装：npm i typescript -g
• 创建ts文件，进入目录后使用tsc demo.ts进行编译

类型声明

// 指定a的类型为boolean
let a: boolean;
a = true;
// a = "dudu"; // 会报错 不能将类型“string”分配给类型“boolean”

// 声明完变量直接赋值
let b: string = "dudu";

// 如果变量的声明和赋值写在一起，ts会自动对变量进行类型检测，第一次赋的值就会决定它的类型
let c = true;
c = false;
// c = 123; // 会报错 不能将类型“number”分配给类型“boolean”

// 用于限制函数参数的类型和返回值的类型
function sum(x: number, y: number): number {
   
  return x + y;
}
console.log(sum(123, 456));
// sum(123, "456"); // 类型“string”的参数不能赋给类型“number”的参数
// sum(123, 456, 789); // 应有 0-2 个参数，但获得 3 个

字面量

// 同时确定类型和值，以后不能再修改
let a: "dudu";
// 联合类型
let a1: "man" | "woman";
a1 = "man";
a1 = "woman";
// a1 = "dudu"; // 不能将类型“"dudu"”分配给类型“"man" | "woman"”
let a2: boolean | number;
a2 = 123;
a2 = false;
// a2 = "dudu"; // 不能将类型“"dudu"”分配给类型“number | boolean”

任意类型 any

let a: any; // 或 let a;
a = 10;
a = "dudu";
a = true;
// any可以赋值给任意类型的变量，可能有些隐藏问题，不建议使用
let a1: string = "dudu";
console.log(a1); // dudu
a1 = a;
console.log(a1); // true

未知类型 unknown

let a: unknown;
a = 10;
a = true;
a = "dudu";
// unknown不允许赋值给其他变量
let a1: string = "dudu";
// a1 = a; // 报错，不能将类型“unknown”分配给类型“string”
// 可以判断完类型后再进行赋值
if (typeof a === "string") {
   
  a1 = a;
}
console.log(a1);
// 也可以使用类型断言：通知编译器变量的实际类型
a1 = a as string; // 或 a1 = <string>a;
console.log(a1);

空 void

// 空表示没有值或者undefined
// 用来表示空，没有返回值
function fn(): void {
   
  console.log("dudu");
  // 可以 return; 可以 return null; 可以 return undefined;
}

没有值 never

// 表示永远不会返回结果
function fn(): never {
   
  throw new Error("报错了！");
}

object

// 指定对象中只能包含哪些属性
// ?表示该属性可选
// [propName: string]: any 加上以后可以添加任意属性
let a: {
    name: string; age?: number; [propName: string]: any };
a = {
    name: "dudu", age: 123, gender: "man" };

// 设置函数结构的类型声明：指定参数个数和类型，返回值的类型
let fn: (a: number, b: number) => number;
fn = function (n1, n2) {
   
  return n1 + n2;
};

array

// 声明个字符串数组
let a: string[]; // 或 let a: Array<string>;
a = ["a", "b", "c"];

tuple

// 元组：固定长度的数组
let a: [string, number];
a = ["s", 123];

enum

// 枚举，也可以直接声明变量，会自动进行赋值，从0开始
enum Gender {
   
  man = 1,
  woman = 0,
}
let person: {
    name: string; gender: Gender };
person =