[JavaScript知识库]TypeScript快速入门（二）

上一章：TypeScript快速入门（一）(陆续更新知识点)

6.TypeScript中数组类型的定义

一般数组类型定义（类型推断）:

/**
 * 一般数组类型定义（类型推断）
 */
const numberArr = [1,2,3]; //此时类型推断出numberArr 为 number[];

一般数组类型定义（类型注解）:

/**
 * 一般数组类型定义（类型注解）
 */

const numberArr : number[] = [ 1,2,3];

同理我们可以定义字符串数组:

/**
 * 同理我们可以定义字符串数组
 */
const strArr : string[] = ["one","two","three"]

综上所述，可以发现，我们是可以任意类型的数组都是可以定义的

/**
 * 综上所述，可以发现，我们是可以任意类型的数组都是可以定义的
 */
const undefinedArr : undefined[] = [undefined,undefined];

多重类型数组 举个例子：包含有字符串以及数字类型的数组:

/**
 * 多重类型数组 举个例子：包含有字符串以及数字类型的数组
 */
const strAndNumberArr :(string | number)[] = ["1","2",3];

定义一个包含对象的数组（不使用类型别名）

/**
 * 定义一个包含对象的数组(没有使用类型别名)
 */
const objArr: {
    name: string,
    age: number
}[] = [
    {name: "houwenyao",age: 24}, 
    {name: "liuyipeng",age: 25}
]

定义一个包含对象的数组（使用类型别名）

类型别名：类型别名用来给一个类型起个新名字

/**
 * 定义一个包含对象的数组（使用类型别名）
 */
type people = {
    name:string,
    age:number
}
const objArr :people[] = [
    {name:"houwenyao",age:24},
    {name:"liuyipeng",age:25}
]

定义一个包含类的数组 ,(类中的属性以分号分割)

/**
 * 定义一个包含类的数组 ,(类中的属性以分号分割)
 */
class Person {
    name:string;
    age:number;
}
const classArr : Person[] = [
    {name:"liuyipeng",age:25},
    {name:"houwenyao",age:24}
]

07.TypeScript中interface接口的使用（注意接口非必选值的定义）

/**
 * 接口是一系列抽象方法的声明，是一些方法特征的集合，这些方法都应该是抽象的，需要由具体的类去实现
 */
//定义接口IPerson
interface IPerson {
    name: string,
    age: number,
    sex: string,
    hobby?:string //定义可选值 注意在：号前面加 ？
}
/**
 * 定义对象Boy实现接口IPerson
 */
const Boy : IPerson = {
    name:"liuyipeng",
    age:25,
    sex:"男",
    hobby:"basketball"
}
const Girl : IPerson = {
    name:"houwenyao",
    age:24,
    sex:"女",
}
/**
 * 定义方法实现接口
 */
const getBoy = (Boy:IPerson):void => {
    console.log(Boy.name)
    console.log(Boy.age)
    console.log(Boy.sex)
    console.log(Boy.hobby)
}
getBoy(Boy);
getBoy(Girl);

输出结果：（undefined与null不一样，前者是有属性无值，后者为无属性）

定义一个允许加入任意值的接口（如果删除[propname:string] :any，程序会报错）

/**
 * 定义一个允许加入任意值的接口
 */

interface IBoy {
    name:string,
    age:number,
    sex:string,
    [propname:string] :any //属性的名字是字符串类型，属性的值可以是任何类型any
}
const boy:IBoy = {
    name:"liuyipeng",
    age:25,
    sex:"男",
    hobby:"basketball" //只要符合在接口定义的规范，都可以作为属性添加
}
const getPeople = (boy:IBoy)=>{
    console.log(boy.name)
    console.log(boy.age)
    console.log(boy.sex)
    console.log(boy.hobby) 
}
getPeople(boy)