在前端开发中，经常需要通过数组或类数组对象来进行数据的操作。ECMAScript 2015 中引入了 Array.from() 方法来创建一个新数组，其强大之处在于可以从类数组对象或可迭代对象中创建一个新的数组实例。然而，在使用 Array.from() 方法时，开发者可能会经常遇到 Uncaught TypeError：Cannot converge object to primitive value 错误，这时应该如何解决呢？
什么是 TypeError 错误？
在 JavaScript 中，TypeError 错误表示当一个值的类型并不符合预期时，JavaScript 引擎会抛出该类型的错误。具体来说，Type Error 错误通常会发生在以下情况：
- 试图调用不是函数的对象
- 试图访问 null 或 undefined 类型的对象
- 试图给 read-only 属性设置值
- 试图使用 delete 操作符删除一个不可删除的属性
- 类型转换出错
Uncaught TypeError：Cannot converge object to primitive value 错误，则表示传递给 Array.from() 方法的对象无法被转换为原始值。
Array.from() 方法
Array.from() 方法可以将一个类数组对象或可迭代对象转换为数组。它接受两个参数：第一个参数为要转换成数组的对象，第二个参数是一个可选的映射函数，用于对每个元素进行转换。如果省略第二个参数，则返回一个与原始对象相同的数组。
例如，下面的代码将 NodeList 对象转换为数组：
----- -------- - -------------------------------- ----- ----- - ---------------------
解决 “Cannot converge object to primitive value” 错误
这个错误会在以下两种情况下出现：
- 传递给 Array.from() 方法的对象为 null 或 undefined 类型。
- 传递给 Array.from() 方法的对象不是可迭代的。
对象为 null 或 undefined 类型
为了避免这个错误，我们必须在调用 Array.from() 方法前，确保我们传递的对象不是 null 或 undefined 类型。代码示例如下：
----- --- - ----- ----- ----- - -------------- -- ----
对象不是可迭代的
如果传递给 Array.from() 方法的对象不是可迭代的，我们可以用另一种方法来实现相同的结果。我们可以将对象转换为一个可迭代的对象，例如字符串或数组，然后再使用 Array.from() 方法。代码示例如下：
----- --- - --- ---- -- ---- ------- --- ----- ----- - --------------------- - --------------- - ---------------------------------
上述示例中，我们将一个类数组对象 {0: ‘a’, 1: ‘b’, length : 2} 转换为字符串 'ab'，然后再使用 Array.from() 方法将字符串转换为数组。如果浏览器不支持 Array.from() 方法，则使用 Array.prototype.slice.call() 方法将对象转换为数组。
结论
在使用 ECMAScript 2017 的 Array.from() 方法时，我们必须确保传递给它的对象不是 null 或 undefined 类型，并且必须是可迭代的。如果这个条件得到满足，那么我们可以放心地使用 Array.from() 方法来创建新的数组实例。
对于出现 TypeError 错误，我们还可以通过传递可迭代的对象来解决这个问题。这种情况下，我们可以使用字符串或数组等可迭代的对象，然后再使用 Array.from() 方法将其转换为一个新的数组实例。
总之，在调用 Array.from() 方法时，我们需要确保传递给它的对象符合其预期的格式，否则便会产生 TypeError 错误，造成程序错误并难以调试。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/672d8a75eedcc8a97c854255