typescript基础

 

• 数据类型
• 类型推断
• 联合类型
• 接口
• 数组
• 函数
• 断言
• 声明文件

---

---

数据类型

boolean | number | string | null | undefined | void | any

定义类型：

let num : number = 6;

void（空值），函数返回空值：

function sayHello(name: string): void {
  console.log("hello, " + name)
}

undefined和null是所有类型的子类型，所以可以给其他类型赋值：

let num : number = undefined;

任意值类型：any，可被赋值为任何类型、访问任何属性/方法。声明变量时若没有指定类型，被识别为any类型

let val : any = 'hello';
val = 7;

let obj : any;
console.log(obj.name)
console.log(obj.hello())

类型推断

let num = 7;

等价于：

let num : number = 7;

联合类型

用 | 分隔多个类型，取义为“或”，表示变量取值为多种类型中的一种

let val : string | number;
val = 'hello';
console.log(val.slice(1));
val = [1,2];
console.log(val.push(1))

作为函数参数，只能访问多种类型的公共属性或方法

function getVal(val: string | number){
    console.log(val.toString())
}

接口

既可以对类的一部分行为进行抽象以外，也常用于对“对象的形状”进行描述

确定属性，属性不可多不可缺

interface Student {
  name: string;
  age: number;
}

let student = {
  name: 'jj',
  age: 9,
}
// 不可少
// let studentA = {
//   name: 'jj'
// }
// 不可多
// let studentB = {
//   name: 'jj',
//   age: 9,
//   gender: 'f'
// }

可选属性：

interface Student {
  name: string;
  age?: number;
}

let studentA = {
  name: 'jj'
}
let studentB = {
  name: 'jj',
  age: 9,
}

任意属性，一旦定义了任意属性，那么确定属性和可选属性的类型都必须是任意属性类型的子集：

interface Student {
  name: string;
  age?: string;    //都是string类型
  [propName: string]: string;
}

只读属性，对象被创建之后只读属性不能再被重新赋值

interface Student {
  readonly id: number;
  name: string;
  age?: string;
  [propName: string]: any;
}

数组

let arr: number[] = [1,2,3]    // 不允许有其他类型

let arrA: Array<number> = [1,2,3]    // 数组泛型

用接口定义类数组：

function sum() {
    let args: {
        [index: number]: number;
        length: number;
        callee: Function;
    } = arguments;
}

函数

函数声明，输入参数不可多不可少

function sum(x: number, y: number): number {
    return x + y
}

sum(1,2)

函数表达式，=>符号左边是输入类型，需要用括号，右边是输出类型，注意区别于箭头函数的符号

let mySum: (x: number, y: number) => number = function (x: number, y: number): number { return x+y }

接口定义函数的形状：

interface Sum {
    (x: number, y: number): number;
}

let mySum: Sum;
sum = (x: number, y: number) {
    return x + y;
}

可选参数，必须在必需参数后面

function showName(firstName: string, lastName?: string) {
    if(lastName) {
        console.log(firstName + ' ' + lastName)
    } else {
        console.log(firstName)
    }
}

默认参数

function showName(firstName: string, lastName: string = 'John') {
    return firstName + lastName;
}

剩余参数

function push(arr: any[], ...items: any[]) {
    items.forEach(function(item) {
        array.push(item)
    })
}

重载

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('');
    }
}

断言

手动指定一个值的类型，在联合类型中的应用：

function getLength(something: string | number): number {
    if ((<string>something).length) {
        return (<string>something).length;
    } else {
        return something.toString().length;
    }
}

声明文件