TypeScrip-进阶（五）-索引器

1.定义

索引器（Indexers）允许你定义对象的索引签名，以便可以通过索引访问对象的属性。索引器的语法类似于数组的索引访问，但用于对象的属性。

• 对象[值]，使用成员表达式
• 使用索引器，可以添加其他符合的属性，但使用了索引器后，其他已有的成员，类型必须符号索引器的类型
• 若索引器用在类中，则必须放在最上面
• 索引器键的类型可以是字符串，也可以是数字
• 在JS中，所有的成员名本质上，都是字符串，如果使用数字作为成员名，会自动转换为字符串。
• 在TS中，可以定义两个索引器
  • 如果某个类中使用了两种类型的索引器，要求两种索引器的值类型必须匹配

2.配置

在TS中，默认情况下，不对索引器（成员表达式）做严格的类型检查
使用配置noImplicitAny开启对隐式any的检查。

{
  "compilerOptions": {
    "noImplicitAny": true
  },
}

3.使用

使用索引器，可以添加其他符合的属性，但使用了索引器后，其他已有的成员，类型必须符号索引器的类型

type Obj = {
    name: string
    age: string
    [key: string]: string
}
// 使用索引器，可以添加其他符合的属性
const obj: Obj = {
    name: '张三',
    age: '12',
    gender: '男'
}

若索引器用在类中，则必须放在最上面

class User {
    [key: string]: any
    name: string = '张三'
    getName() { }
}

const user: User = new User()
user.pid = 'pid'
user['age'] = '12'

索引器的键值为数字的情况

class User {
    [key: number]: any
    0: number = 1
    1: number = 0
}

const user: User = new User()
console.log(user[0]); // 1
user[2] = 2
console.log(user[2]); // 2

在JS中，所有的成员名本质上，都是字符串，如果使用数字作为成员名，会自动转换为字符串。

const arr: any = []
arr[0] = 1
arr['0'] = 2
console.log(arr[0]); // 2

定义两种索引器

class A {
    // 索引器的值的类型必须保持一致
    [key: string]: number
    [key: number]: number
}