迹忆客 专注技术分享

当前位置:主页 > 学无止境 > 编程语言 >

Typescipt 错误 Type 'undefined' must have a Symbol.iterator method that returns an iterator

作者:迹忆客 最近更新:2022/08/06 浏览次数:

当我们尝试使用带有可能未定义的值的扩展语法时,会发生“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 可以确保变量将存储一个数组,并且可以安全地将其解压缩到结果数组中。

本站文章均为原创或翻译,转载请发邮件至 1244347461@qq.com 进行申请,未经许可,禁止转载。经作者同意之后,转载请以链接形式注明出处

本文地址:

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

热门文章

教程更新

热门标签

扫码一下
查看教程更方便