TypeScript之简单类型&复杂类型

简单类型

let my_name: string = '333';

void => 返回空值

function getName(str: string): void {
    // 使用void 即 没有返回值
}
getName('222')

any => 任意类型,这里当类型不确定的时候,就可以使用 any 任意类型,不到万不得已不使用

let abc: any
abc = {}

字面量 => 定义什么,就只能赋值什么

let animal: 'dog' | 'cat';
animal = 'dog';
animal = 'cat';

复杂类型

数组 array => 声明单一指定类型的数组
let arr: number[] = [1, 2, 3]

元组 tuple => 声明多个类型的数组,但长度要一致
let tuple: [number, string] = [2, '4']

接口 interface => 它能很方便的帮我们定义 Object 类型,它是非常的灵活可以描述对象的各种类型

interface device {
    readonly id: 1, // readonly => 不可更改的
    type: string,
     number,
    height?: number, // ? => 可以省略
}

let phone: device = {
    id: 1,
    type: 'xiaomi',
     40,
}

函数 funtion => 我们要规定函数的 输入类型 和 返回类型; 在形参后面接冒号声明 形参的类型,在 ()后面冒号声明 返回值类型

function sum(num1: number, num2: number, num3?: number): number {
    return num1 + num2;
}
sum(2, 3) // 传入多余的参数,或非指定类型的参数均会报错
sum(2, 3, 4)

const sum2 = (num1: number, num2: number): number => {
    return num1 + num2;
}

const sum3 = (num1: any, num2: any) => {
    return num1 + num2;
}
interface sum {
    (num1: number, num2: number): number
}

let mySum: sum = sum3

联合类型 union types => 可以指定哪几种类型

let union: number | string;
union = '3';
union = 'aaa';

对象 object => let a: object; 是不是没有什么意义,因为 js 中对象太多了

let object: { name: string, age: number }
object = {
    name: 'zhangsan',
    age: 18
} // 属性必须在类型 { name: string; age: number; } 中

断言 type inference => 我们声明了这个类型为 number | string 它不能调用 length 方法,因为不知道到底是number类型还是string类型

  • 写法一:as => 通过 as 来指定某种具体的类型
function getLength1(params: number | string): number {
    const str = params as string;
    if (str.length) {
        return str.length
    }
    return str.toString().length
}
getLength1('345');
  • 写法二:<类型>
function getLength2(params: number | string): number {
    const str = <string>params;
    if (str.length) {
        return str.length
    }
    return str.toString().length
}

类型守卫 type guard => 遇到联合类型的时候,使用 类型守卫可以 缩小范围
类型守卫 除了 typeof 之外 ,还有 instanceof、 in

function getLength3(params: number | string): number {
    if (typeof params === 'string') {
        return params.length
    }
    return params.toString().length
}
原文地址:https://www.cnblogs.com/zpsakura/p/15178014.html