typescript定义对象、数组、函数

1、对象

基础使用
interface Person {
    name: string;
    age: number;
}

let tom: Person = {
    name: 'Tom',
    age: 25
};
可选属性
interface Person {
    name: string;
    age?: number;
}

let tom: Person = {
    name: 'Tom'
};

// 特征是打了个问号,意味着并不是必须的,而是可选的属性
//但是这个时候可以少属性,却不能多属性
任意属性
interface Person {
    name: string;
    age?: number;
    [propName: string]: any;
}

let tom: Person = {
    name: 'Tom',
    gender: 'male'
};

需要注意的是,一旦定义了任意属性,那么确定属性和可选属性的类型都必须是它的类型的子集:

interface Person {
    name: string;
    age?: number;
    [propName: string]: string; // 任意属性只包含了string类型
}

let tom: Person = {
    name: 'Tom',
    age: 25, // age的nubmer属性不在任意属性string内,会报错
    gender: 'male'
};
只读属性
interface Person {
    readonly id: number;
    name: string;
    age?: number;
    [propName: string]: any;
}

let tom: Person = {
    id: 89757,
    name: 'Tom',
    gender: 'male'
};

tom.id = 9527;// 该属性只读,赋值操作会报错

2、数组类型

「类型 + 方括号」表示法

let fibonacci: number[] = [1, 1, 2, 3, 5];

数组泛型

let fibonacci: Array = [1, 1, 2, 3, 5];

用接口(interface)表示数组

interface NumberArray {
    [index: number]: number;
}
let fibonacci: NumberArray = [1, 1, 2, 3, 5];

3、函数类型

传统的定义函数的输入与输出

// 函数声明的写法
function sum(x: number, y: number): number {
    return x + y;
}
// 多参数 | 少参数 是不被允许的哦

// 函数表达式的写法,等式左边的可以被省略而完全又右边类型判断出来。
let mySum: (x: number, y: number) => number = function (x: number, y: number): number {
    return x + y;
};

用接口定义函数的输入与输出

interface SearchFunc {
    (source: string, subString: string): boolean;
}
let mySearch: SearchFunc = function(source: string, subString: string) {
    return source.search(subString) !== -1;
}

前面我们提到,输入多/少的参数式不被允许的,这在接口定义中也存在着这个限制,同样的,我们也可以使用?来定义可选参数

!!!可选参数必须接在必需参数后面,否则会报错。如下是正确写法
function buildName(firstName: string, lastName?: string) {
    if (lastName) {
        return firstName + ' ' + lastName;
    } else {
        return firstName;
    }
}
let tomcat = buildName('Tom', 'Cat');
let tom = buildName('Tom');

参数也可以拥有默认值, TypeScript 会将添加了默认值的参数识别为可选参数,此时就不受「可选参数必须接在必需参数后面」的限制了:

function buildName(firstName: string, lastName: string = 'Cat') {
    return firstName + ' ' + lastName;
}
let tomcat = buildName('Tom', 'Cat');
let tom = buildName('Tom');

你可能感兴趣的:(我的前端,typescript,javascript,前端)