javascript - 为什么 Array.prototype.map 会忽略稀疏数组中的空槽，而 Array.prototype.join 不会？

Question

Array.prototype.map 当应用于具有 undefined 的数组时，函数按预期工作值(value)观:

const array = [undefined, undefined, undefined];
console.log(array.map(x => 'x')); // prints ["x", "x", "x"]

但是，当使用 map在具有空槽的稀疏数组上，它不会像前面的示例那样将它们映射到“x”。相反，它返回 undefined值(value)观:

const array = [,,,];
console.log(array.map(x => 'x')); // prints [undefined, undefined, undefined]

即使我们有一个混合了空槽和实际值的数组，也只有后者被映射:

const array = [,'a',,'b',];
console.log(array.map(x => 'x')); // prints [undefined, "x", undefined, "x"]

相比之下，我注意到 Array.prototype.join 适用于空插槽:

const array = [,,,,];
console.log(array.join('x')); // prints "xxx"

为什么join将空槽视为有效元素，但 map才不是？

此外，在 join documentation ，他们提到如果一个元素是 undefined , null或 empty array [] ，它被转换为一个空字符串。他们没有提到空槽，但似乎他们也在将它们转换为空字符串。

那么它是 MDN 文档中的问题吗？为什么没有 join也以同样的方式忽略空槽map做？这似乎是文档中的问题或 join 的实现中的问题。 .

Answer 1

join尝试生成数组的序列化表示。 map通过一些变换函数产生数组元素的投影。
与 map ，可以说:“当您单步遍历数组时，如果遇到没有属性的索引，请在输出数组中同样取消设置该属性。”对于所有现有属性，输出索引仍将对应于它们的输入索引，并且在输入和输出中都会跳过缺失的属性。
与 join的字符串输出，我们不能真正做到这一点。如果我们加入 [,'a',,'b',] ，输出为 ,a,,b,是代表这一点的最佳方式。跳过缺失属性的输出 - 即 a,b -- 会产生极大的误导，看起来是一个长度为 2 的数组，其元素位于索引 0和 1 .
不像 map ，它可以生成具有各种存在或不存在属性的数组，join在渲染字符串输出时卡住了，它无法轻易区分其输出中缺失的属性和空属性，而不会产生极大的误导性结果。
为了完整起见，这里是函数在输入数组中循环的实际 ECMAScript 指定行为(在每个数组中，k 是循环变量):
Array.prototype.join

Repeat, while k < len

• If k > 0, set R to the string-concatenation of R and sep.
• Let element be ? Get(O, ! ToString(k)).
• If element is undefined or null, let next be the empty String; otherwise, let next be ? ToString(element).
• Set R to the string-concatenation of R and next.
• Increase k by 1.

Array.prototype.map

Repeat, while k < len

• Let Pk be ! ToString(k).
• Let kPresent be ? HasProperty(O, Pk).
• If kPresent is true, then
  • Let kValue be ? Get(O, Pk).
  • Let mappedValue be ? Call(callbackfn, T, « kValue, k, O »).
  • Perform ? CreateDataPropertyOrThrow(A, Pk, mappedValue).
• Increase k by 1.

即使您不知道如何阅读所有这些内容，也很容易看到 map包括 HasProperty检查第二个循环步骤。 join明确地说“如果元素是 undefined 或 null ，让下一个是空字符串。” Get(O, ! ToString(k))是一种常见的属性查找，对于普通对象，它会产生 undefined当一个属性不存在时，“如果元素是 undefined”的情况适用。
值得注意的是，MDN 文档简化了其信息，以便专注于最常见的情况，而不是坚持严格的完整性。 (我会说稀疏数组是一种不常见的情况。)特别是，他们说空数组将序列化为空字符串，这是真的。对于任何具有 toString 的值，这通常是正确的。返回空字符串的函数:

["foo", { toString: a=>""}, "bar"].join()

这将产生输出 foo,,bar .