javascript - JS 中的 [{}].concat() 是做什么的？

Question

我知道这是我可以查找的东西，但我不知道它叫什么，更不用说要搜索什么了。最好能有指点!

一些背景知识，我们正在从 API 中获取一组对象并将它们保存在一个状态变量“notes”中，该变量被传递到下面的函数中。

代码如下:

function renderNotesList(notes) {
  return [{}].concat(notes).map((note, i) =>
    i !== 0 ? (
      // Do something
    ) : (
      // Do something else
  )
}

我将上面的代码简化为

function renderNotesList(notes) {
        console.log([{}].concat(notes))
    }

这是函数运行前后开发工具控制台的输出

0: Object { id: "1", note_text: "I am the first test note" }
​
1: Object { id: "2", note_text: "I am a new test note" }
​
length: 2

之后

0: Object {  }
​
1: Object { id: "1", note_text: "I am the first test note" }
​
2: Object { id: "2", note_text: "I am a new test note" }
​
length: 3

我不明白为什么 tutorial正在做这个。似乎 [{}].concat(notes) 只是添加了一个额外的空对象？

我看过https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat但它似乎没有与此类似的东西。或者至少，我不知道哪一部分是相关的。

Answer 1

你是对的 [{}] 确实只是创建了一个包含空对象的数组，所以 [{}].concat(notes) 将创建一个带有空对象的数组，之后是 notes 数组的内容。

这是故意的，因为代码随后会通过 .map 更改每个元素.然而，它使用了特殊的逻辑，其中所有的 notes 元素都将被用来显示它们的信息，而第一个元素将是一个带有文本“创建新笔记”的链接，点击它会添加另一个笔记.

第一项是什么并不重要，检查是根据索引 i !== 0 完成的，它将执行 第一个 代码分支注意(任何不是第一个元素的东西`和第二个代码分支只针对第一个元素(空对象)。