javascript - 这个数组连接如何产生字符串？

Question

CodeWars 的一个问题是编写一个函数 accum(s)，它执行以下操作:

accum("abcd");    // "A-Bb-Ccc-Dddd"
accum("RqaEzty"); // "R-Qq-Aaa-Eeee-Zzzzz-Tttttt-Yyyyyyy"
accum("cwAt");    // "C-Ww-Aaa-Tttt"

这个问题的答案如下:

function accum(s) {
  return s.split('').map((x,index) => x.toUpperCase()+Array(index+1).join(x.toLowerCase())).join('-');
}

我对 x.toUpperCase()+Array(index+1).join(x.toLowerCase()) 的作用特别感兴趣。

如果我分段写，Array 输出[]。 Array(1) 输出 [ ]。 Array(2) 输出 [ , ]。这似乎……很奇怪。

更奇怪的是，'a' + Array() 输出a，'a' + Array(1) 貌似输出 a 同样，'a' + Array(2) 输出 a,，'a' + Array(3) 输出一个，，。请注意尖括号不见了。即，它不是数组。同样，这似乎……很奇怪。

更好的是，'a' + Array() + 'b' 输出 a，'a' + Array(1) + 'b' 输出 a，'a' + Array(2) + 'b' 输出 ab。

我的问题是，是否有人可以解释这三种情况下到底发生了什么。在第一种情况下，为什么从 Array() 到 Array(1) 似乎添加了一个空格？为什么 Array(2) 不输出 [,]，而是输出 [ , ]？

当字母与 Array(n) 连接时会发生什么？在这种情况下，Array(n) 返回什么？

Answer 1

这是可行的，因为它创建了一个数组，其中包含一定数量的默认 undefined 元素，然后使用字母作为分隔符将它们连接起来。

想一想如果你用逗号分隔符加入一个空白字符串数组会是什么样子:

// join with blank delimiter
console.log(['A', 'B', 'C'].join(''));

// join with comma delimiter
console.log(['A', 'B', 'C'].join(','));

// join blank strings with comma delimiter
console.log(['', '', ''].join(','));

// join blank strings with letter delimiter
console.log(['', '', ''].join('a'));

// join undefined with letter delimiter
console.log([undefined, undefined, undefined].join('a'));

// join array of undefined with letter delimiter
console.log(Array(3).join('a'));

请注意，数组中的最后一个元素没有分隔符，因此与数组长度相比，结果总是少一个字符。这就是为什么他们使用 Array(index+1) 使临时数组更大以容纳额外的分隔符。