TypeScript常用知识之--变量和函数的约定变量的约定 1.基本类型 2.非空断言 3.never 和 void的

这是我参与8月更文挑战的第4天，活动详情查看：8月更文挑战

因为Typescript的持续火爆，分享下TS的常用知识点，我们一起学习交流，一起加油！

变量的约定

1.基本类型

// number
let number: number = 1;

//boolean
let boolean: boolean = true;

//string
let string: string = "string";

// array
let array: string[] = ["1", "2", "3"];
let array1: Array<number> = [1, 2, 3];

//null
let nullnull: null = null;

//undefined
let undefinedundefined: undefined = undefined;

//any 任何类型都可以
let anyany: any = "any";

//元组 tuple
let tupletuple: [string, number] = ["1", 11];

// 枚举
enum Color {
  Green,
  Red,
}

console.log(Color.Green, Color.Red);

// HTML类型
let htmlEle: HTMLElement = document.querySelector("p");

2.非空断言

如果一个元素有可能为空，那么取当中的属性可能会报错，这个时候需要用！进行非空断言

let div: HTMLElement | null = document.getElementById("id");
div!.style.color;

3.never 和 void的区别

1.never 是永不可能执行到的

2.void 是空

3.never 和任何类型交叉都是never

function f1(a: string): void {}

function f2(a: string): never {
  // 因为永远执行不到 所有返回是never
  throw new Error();
}

type A = string | number;
type B = never;

type AB = A & B; // never 和任何类型交叉都是never

4.联合类型

type C = number | string;
type C2 = boolean | string | number;

5.断言

有时候我们在不知道什么类型的时候调用一些属性，直接调用会报错，但是使用断言就可以避免这个问题

function fn3(a: string | Array<number>) {
  // 比如string是没有join的 这个时候就需要强转
  (a as Array<number>).join();
}

函数的约定

1.定义函数

1.可以使用interface 和 type 对函数进行约束

2.定义的类型可以是多类型使用 | 分隔

//type
type GetName = (id: string | number) => string | number;

//interface
interface GetName1 {
  (id: string | number): string | number;
}

let getName: GetName = function (id: string | number): string | number {
  return id;
};

let getName1: GetName1 = function (id: string | number): string | number {
  return id;
};

let name = getName("id");
let name2 = getName1("id");

2.函数参数

1.可选参数

2.默认参数

3.剩余参数

// 可选参数
function optional(a: string, b?: boolean): void {}
optional("1");
optional("1", true);

// 默认参数
function defaultFn(a: string, b: boolean = true) {}
defaultFn("1");

// 默认参数
function restFn(x1, x2, ...x: string[]) {
  for (let i = 0; i < x.length; i++) {
    console.log(x[i]);
  }
  console.log(x1, x2);
}
restFn("1", "2", "3", "4", "5");

3.函数重载

1.函数的定义可以进行重载，类似于Java

2.重载的意义在在于更好的约束传入的参数

function getAge(id: string, gender: boolean): number;
function getAge(id: number, gender: string): number;
function getAge(id: string | number, gender: boolean | string): number {
  if (typeof id === "string") {
    return Number(id);
  }

  if (typeof id === "number") {
    return id;
  }
}

getAge("1", true);
getAge(1, "male");
// 下面这种情况就会报错
// getAge(1,true);

TypeScript常用知识之--变量和函数的约定

变量的约定

1.基本类型

2.非空断言

3.never 和 void的区别

4.联合类型

5.断言

函数的约定

1.定义函数

2.函数参数

3.函数重载

相关资料