元组

元组，可以理解为：已知元素数量和类型的数组

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 联合类型
const xjj:(string | number)[] = ['a',22,'b'] // 规定整个数组当中可以有string或number

// 元组注解 注意这里的注解只有一个中括号
const xjj1: [string, number, number] = ['a', 22, 33] // 规定了数组每个元素对应位置的类型

// Note: 在开发中元祖的使用在相对少


// CSV的方式定义数据格式； （二维数组时需要多加一个中括号）
const xjj2: [string, number, number][] = [
  ['a', 22, 33],
  ['a', 22, 33]
]

接口

接口，可以理解为对象属性的类型描述。和类型别名类似，不同的是 接口必须是一个对象，而别名可以直接是一个类型，如 type Girl = string

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
interface Girl { // 接口 （理解：对象属性的类型描述）
  readonly name: string; // 只读属性 （定义之后不能再修改）
  age: number;
  waistline?: number; // 加个问号表示是可选值
  [propname: string]: any; // 表示可以有不限制属性名的属性，但属性名需要是字符串，值可以是任意类型
  say(): string; // 函数类型，返回值是string (如无返回值时是 void)。  say()也可以加入参数类型检查，如say(p:number)
}
// 和类型别名类似，不同的是 接口必须是一个对象，而别名可以直接是一个类型，如 type Girl = string

// 接口的继承
interface Teacher extends Girl {
  teach(): string;
}


const girl = {
  name: '大脚',
  age: 18,
  sex: '女',
  say() {
    return '欢迎光临'
  },
  teach() {
    return '教'
  }
}


const screenResume = ({ name, age, bust, sex }: Girl) => {
  console.log(name, age, bust, sex)
}
const getResume = ({ name, age, bust, teach}: Teacher) => {
  teach();
  console.log(name, age, bust)
}
screenResume(girl)
getResume(girl)


// 接口在class类中的使用
class xiaojjj implements Girl {
  name = "xiaojj"
  age = 18
  bust = 98
  sex = '女'
  say() {
    return '欢迎光临'
  }
}

可索引的类型

1
2
3
4
5
6
interface Arr {
    [index: number]:string   // 表示通过索引访问数据时返回的类型是string
}

const myArr:Arr = ['1','2','3']
const myStr:string = myArr[1]