TypeScript笔记

ts和js的区别

ts是微软开发的；动态类型语言；ts编辑成为js，ts解析器是nodejs写的；

js不利于维护

类型说明

1. number

十进制、十六进制、二进制、八进制

let decLiteral: number = 6;

2. string

使用双引号（ "）或单引号（'）表示字符串

let name: string = "bob";

还可以使用模版字符串，它可以定义多行文本和内嵌表达式。 这种字符串是被反引号包围（ `），并且以${ expr }这种形式嵌入表达式

let sentence: string = `Hello, my name is ${ name }.

I'll be ${ age + 1 } years old next month.`;

3. boolean

字面量类型声明 true/false值

let isDone: boolean = false;

4. any

任意类型，可以任意赋值，设置之后，相当于对该变量关闭了类型检测

let notSure: any = 4;

5. unknown

表示未知类型的值

6. 数组

第一种，可以在元素类型后面接上 []

let list: number[] = [1, 2, 3];

第二种方式是使用数组泛型，Array<元素类型>：

let list: Array<number> = [1, 2, 3];

7. 元祖typle

元组类型允许表示一个已知元素数量和类型的数组，各元素的类型不必相同。 比如，你可以定义一对值分别为 string和number类型的元组。

let x: [string, number];

x = ['hello', 10];

8. 枚举enum

enum类型是对JavaScript标准数据类型的一个补充。 像C#等其它语言一样，使用枚举类型可以为一组数值赋予友好的名字。

enum Color {Red, Green, Blue}

let c: Color = Color.Green;

9. void

表示没有任何类型，函数中表示没有返回值

function warnUser(): void {

console.log("This is my warning message");

}

注意：声明一个void类型的变量，只能为它赋予undefined和null

10. null

表示对象缺失

11. undefined

用于初始化变量为一个未定义的值

undefined和null两者各自有自己的类型分别叫做undefined和null

12. never

其他类型，表示不会出现的值

例如， never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型； 变量也可能是 never类型，当它们被永不为真的类型保护所约束时。

13. Object

表示非原始类型，也就是除number，string，boolean，symbol，null或undefined之外的类

declare function create(o: object | null): void;

14. 类型断言

语法1：尖括号

let someValue: any = "this is a string";

let strLength: number = (<string>someValue).length;

语法2：as

let someValue: any = "this is a string";

let strLength: number = (someValue as string).length;

注意：两种形式是等价的。如果在TypeScript里使用JSX时，只有 as语法断言是被允许的。

变量声明

1. 解构赋值

- 数组

let input = [1, 2];

let [first, second] = input;

你可以在数组里使用...语法创建剩余变量：

let [first, ...rest] = [1, 2, 3, 4];

- 对象

({ a, b } = { a: "baz", b: 101 });

注意，我们需要用括号将它括起来，因为Javascript通常会将以 { 起始的语句解析为一个块。

2. 默认值

let { a, b = 1001 } = wholeObject;

3. 特殊字符

b?: number

属性或参数中使用 ?: ---是指可选参数 ，可以理解为参数自动加上undefined

属性或参数中使用 !. ---表示强制解析（断言），告诉ts你这个对象里一定有某个值

变量后使用 !: ---表示类型推断排除null、undefined

y = null! //通过编译

?? 和 || 的意思有点相似，但是又有点区别,??相较||比较严谨, 当值等于0的时候||就把他给排除了，但是?? 不会.

注意：?用法只能读操作而不能写操作，对一个可能为空的属性赋值是不会被编译通过的，此时还需用用到类型断言

// 使用类型断言

const demo_ = (parma?: IDemo) => {

let _parma = parma as IDemo

_parma.x = 1

}

接口

// 定义类型

interface LabelledValue {

label: string;

}

function printLabel(labelledObj: LabelledValue) {

console.log(labelledObj.label);

}

let myObj = {size: 10, label: "Size 10 Object"};

printLabel(myObj);