TypeScript接口/数组类型/内置对象/函数类型/类型断言

接口 interface

在TypeScript中，使用接口来定义对象的类型，对「对象的形状（Shape）」进行描述

demo

interface Person {
    name: string;
    age: number;
    [index: string]: any; //任意属性
    sex?: number; // 可选属性
    // readonly id: number  只读属性
    //setNum(x:number):number 定义函数
}
const person: Person = {name: 'ddd', age: 5 }
//如果是其他的类型会报错

接口实现类

interface Person {
    name: string;
    age: number;
}
class Person implements Person {
    age: number = 18
    name:string = ''
}
export { Person }
const people = new Person()
people// { age:18, name: ' ' }

接口继承

interface People extends Person {
    sex: string
}

const p: People = {
    name: 'ddd', age: 22,sex: 'd'
}

数组类型

「类型 + 方括号」表示法

let arr: number[] = [1,2,3]

数组泛型

let arr: Array<string> = ['2', 'ewr']

内置对象

JavaScript 中有很多内置对象，它们可以直接在 TypeScript 中当做定义好了的类型

ECMAScript 的内置对象

let b: Boolean = new Boolean(1);
let e: Error = new Error('Error occurred');
let d: Date = new Date();
let r: RegExp = /[a-z]/;

DOM 和 BOM 的内置对象

let body: HTMLElement = document.body;
let allDiv: NodeList = document.querySelectorAll('div');
document.addEventListener('click', function(e: MouseEvent) {
  // Do something
});

函数类型

重载

重载允许一个函数接受不同数量或类型的参数，作出不同的处理
使用重载

function reverse(x: number): number;
function reverse(x: string): string;
function reverse(x: number | string): number | string {
    if (typeof x === 'number') {
        return Number(x.toString().split('').reverse().join(''));
    } else if (typeof x === 'string') {
        return x.split('').reverse().join('');
    }
}

类型断言

类型断言（Type Assertion）可以用来手动指定一个值的类型。

语法

<string>str

或

str as string

在他tsx 中只能使用最后一种

声明文件

declare