typescript 数组 包含-TypeScript 类型防护:获取字段中元素对象属性的值作为新类型

类别:TypeScript 类型围栏

标签:

首先我们来谈谈获取元素对象属性在字段中的值作为一种新型的解决方案

const arr = [
    {
        key: 'update',
    },
    {
        key: 'delete'
    }
]

数组包含某个字符串_typescript 数组 包含_数组包含某个元素

将update和delete指定为类型提示是非常有必要的

// 'delete' | 'update'
type OperationalKey = (typeof arr)[number]['key']

详细介绍

我遇到了一个麻烦的问题。 我个人在项目中使用的是TypeScript+Vue技术栈。 目前的需求是为一个Action定义一个类型来获取类型提示,并且这个Action里面有一个key属性。 密钥是一个字符串,我希望仅限于某些字符串。

数组包含某个元素_typescript 数组 包含_数组包含某个字符串

const actions = [
    {
        key: 'add',
        ...
    },
    {
        key: 'delete',
    },
    {
        key: 'update'
    }
]
const onAction = (action: {key: string}) => {
    
}

显然,当我们直接使用string作为key的类型时typescript 数组 包含,我们只能看到代码有哪些运算符。 如果我们直接重写action中的字符串类型:{key:type},会很麻烦,也很难维护,所以如何获取actions字段中元素对象的属性值作为新的类型是我们要解决的问题想要解决。

数组包含某个字符串_typescript 数组 包含_数组包含某个元素

对于一个对象,我们可以使用keyof取出所有属性并作为新类型返回typescript 数组 包含,而我们需要的是属性的值作为新类型,所以某一步操作必须是['key']。

依次看链表,如何获取链表的元素类型呢? 经过一番查找,发现使用[number]是符合要求的。 JavaScript的数字类型索引通常是用户通过push、unshift等操作添加的链表,所以解释其实是不正确的,因为JavaScript链表是一个对象,而JavaScript对象的键是一个字符串。 您可以查看详细信息。 一般来说,通过非负数访问链表就是我们需要的结果,所以[number]没有问题。

可以获得链表的元素对象类型之后,还有一点需要注意的是,链表必须是不可变的,一般用asconst修改。 如果链表是可变的,那么相关的元素属性也会是可变的,很难正确获取。

更好的解决方案

一般为了防止幻数、幻字符串,即一系列难以理解的定义,我们会定义一些常量集来判断,但有时如果我们认为可以使用上面的方法来判断类型很麻烦。

其他