TypeScript学习笔记

TypeScript学习笔记

1. 安装TS

1. 全局安装

npm install typescript@latest -g

2. 在根目录下生成 tsconfig.json 文件

tsc  --init

以上这一步一定是要运行的，否则 vscode 会出现变量错误

3. 启动

tsc -w 文件名

2. TS的类型声明

1. 可以把类型用在 变量当中

//变量的使用
let num: number = 123;
console.log(123);
let str: string = '123';
console.log(str);

2. 可以把类型用在 函数中，如函数的参数、返回值

//函数的使用
function sum(a: number, b: number): number {
   
  return a + b;
}
let result = sum(123, 456);
console.log(result);

3. TS可以用的其他类型

4. 可以使用 | 来连接多个类型 (联合类型)

let b: "male" | "female";
b = "male";
b = "female";
b = "123" //这是不行的

//boolean | string

let c: boolean | string;
c = true;
c = 'hello';

5. any表示默认关闭TS

//any 表示的是任意类型, 一个变量设置类型为 any 后相当于对该变量关闭TS的类型检测, 使用TS时, 不建议使用 any 类型。

let d: any;
d = 10;
d = "hello";
d = true;

//如果变量后面不加 any, 会自动加上。
let f;
f = 10;
f = "hello";
f = true;

6. unknown表示未知类型的值

//unknown 表示未知类型的值
let e: unknown;
e=10;
e="hello";
e=true;

//unknown 不能把定义好的类型赋值给 unknown 的变量
let s:string = '123';
s=e; //报错

// unknown 实际上就是一个类型安全的any
// unknown 类型的变量，不能直接赋值给其他变量
//解决报错 s = e 的办法, 赋值前进行类型检测, 这样就不会报错了
if (typeof e === "string") {
   
  s = e;
}

//类型断言, 可以用来告诉解析器变量的实际类型, 也可以解决 s = e 报错
s = e as string;
s = <string>e;

7. void用来表示空

// void 用来表示空, 一函数为例, 就表示没有返回值的函数, 但可以返回 undefined
function fn(): void {
   
    return undefined;
}

8. never 表示永远不会返回结果

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

9. object 表示一个 js 对象

let a: object;
a = {};
a = function () {
   

}

// {} 用来指定对象中可以包含哪些属性
// 语法：{属性名:属性值, 属性名:属性值}
// 在属性名后边加上?, 表示属性是可选的

let g: { name: string, age?: number };
g = { name: '孙悟空', age: 18 };

// [propName: string]: any
let h: { name: string