为什么 TypeScript 在使用不同类型的 Array.prototype.includes() 时会抛出错误？

为什么 Array.prototype.includes() 需要数组元素的匹配类型

Array.prototype.includes() 方法旨在确定如果数组包含特定元素。为了确保结果准确可靠，searchElement 参数必须与数组元素的类型匹配。这种类型安全性可以防止错误的比较并保持数组数据的完整性。

考虑以下代码片段：

<code class="js">type AllowedChars = 'x' | 'y' | 'z';
const exampleArr: AllowedChars[] = ['x', 'y', 'z'];

function checkKey(e: KeyboardEvent) { 
    if (exampleArr.includes(e.key)) { 
        // ...
    } 
}</code>

TypeScript 编译器标记一个错误，表明 e.key参数与 exampleArr 元素的AllowedChars 类型不匹配。这个错误是因为includes()方法假设searchElement与数组元素具有相同的类型。

这可能看起来矛盾，因为Array.prototype.includes()返回一个布尔值而不是一个赋值，如下所示错误提示。然而，TypeScript 的类型系统在这里起着至关重要的作用。

在数组中包含一个元素意味着该元素的类型与数组的元素一致。但是，在提供的示例中，e.key 参数的类型是字符串，而 exampleArr 元素是AllowedChars 类型。这种不匹配需要类型断言或类型扩展来覆盖 TypeScript 类型系统的期望。

解决此问题的最简单且最推荐的方法是将 exampleArr 的类型扩展为更广泛的 string[] 类型，或者将 searchElement 参数缩小为仅包含允许的字符。这些修改确保类型兼容性，防止任何潜在的与类型相关的错误或不一致。

以上是为什么 TypeScript 在使用不同类型的 Array.prototype.includes() 时会抛出错误？的详细内容。更多信息请关注PHP中文网其他相关文章！