Typescipt 错误 Type 'undefined' must have a Symbol.iterator method that returns an iterator
当我们尝试使用带有可能未定义的值的扩展语法时,会发生“Type 'undefined' must have a Symbol.iterator method that returns an iterator”错误。 要解决此错误,需要在使用 spread 之前使用类型保护来验证该值是否为 undefined
。
下面是错误发生的一个示例。
type Years = number[] | undefined;
const arr1: Years = undefined;
// ⛔️ Error: Type 'undefined' must have a
// '[Symbol.iterator]()' method that returns an iterator.ts(2488)
const result = [...arr1];
arr1 变量可能具有未定义的值。
当我们使用问号将属性标记为可选时,通常会发生此错误。
当一个值是可选的时,它可能等于未定义。
由于我们不能使用未定义值的扩展语法 (...)
,因此我们可以提供空数组作为默认值。
type Years = number[] | undefined;
const arr1: Years = Math.random() > 0.5 ? [2022, 2023] : undefined;
const result = [...(arr1 || [])];
console.log(result);
我们使用逻辑 OR (||) 运算符来提供备用,以防 arr1 变量存储未定义的值。
现在我们可以保证将扩展语法与数组一起使用。
我们也可以使用三元运算符来获得相同的结果。
type Years = number[] | undefined;
const arr1: Years = Math.random() > 0.5 ? [2022, 2023] : undefined;
const result = [...(arr1 !== undefined ? arr1 : [])];
console.log(result);
我们使用三元运算符来检查 arr1 是否不存储未定义的值。
如果不是,我们传递 arr1 数组,否则提供一个空数组的后备值。
使用逻辑 OR (||)
运算符和这个三元之间的区别是 - 三元更明确,直接检查 undefined
。
如果左边的值是假的,则逻辑 OR (||)
运算符返回右边的值。
我们还可以在初始化变量时提供默认值。
type Years = number[] | undefined;
const arr1: Years = undefined || []; // 空数组作为默认值
const result = [...arr1];
console.log(result);
我们在初始化 arr1 变量时提供了一个空数组的默认值。
这样,TypeScript 可以确保变量将存储一个数组,并且可以安全地将其解压缩到结果数组中。
相关文章
在 TypeScript 中使用 try..catch..finally 处理异常
发布时间:2023/03/19 浏览次数:181 分类:TypeScript
-
本文详细介绍了如何在 TypeScript 中使用 try..catch..finally 进行异常处理,并附有示例。
在 TypeScript 中使用 declare 关键字
发布时间:2023/03/19 浏览次数:97 分类:TypeScript
-
本教程指南通过特定的实现和编码示例深入了解了 TypeScript 中 declare 关键字的用途。
在 TypeScript 中 get 和 set
发布时间:2023/03/19 浏览次数:172 分类:TypeScript
-
本篇文章演示了类的 get 和 set 属性以及如何在 TypeScript 中实现它。
在 TypeScript 中格式化日期和时间
发布时间:2023/03/19 浏览次数:161 分类:TypeScript
-
本教程介绍内置对象 Date() 并讨论在 Typescript 中获取、设置和格式化日期和时间的各种方法。
在 TypeScript 中返回一个 Promise
发布时间:2023/03/19 浏览次数:182 分类:TypeScript
-
本教程讨论如何在 TypeScript 中返回正确的 Promise。这将提供 TypeScript 中 Returns Promise 的完整编码示例,并完整演示每个步骤。
在 TypeScript 中定义函数回调的类型
发布时间:2023/03/19 浏览次数:221 分类:TypeScript
-
本教程说明了在 TypeScript 中为函数回调定义类型的解决方案。为了程序员的方便和方便,实施了不同的编码实践指南。
在 TypeScript 中把 JSON 对象转换为一个类
发布时间:2023/03/19 浏览次数:110 分类:TypeScript
-
本教程演示了如何将 JSON 对象转换为 TypeScript 中的类。
使用 NPM 将 TypeScript 更新到最新版本
发布时间:2023/03/19 浏览次数:130 分类:TypeScript
-
本教程说明了如何使用 npm 更新到最新版本的 TypeScript。这将为如何使用 npm 将 TypeScript 更新到最新版本提供完整的实际示例。
使用 jQuery 和 TypeScript
发布时间:2023/03/19 浏览次数:151 分类:TypeScript
-
本教程提供了使用 jQuery 和 TypeScript 的基本理解和概念。