为什么需要复制数组，才能使用 .map() 方法？-CSDN博客

map()方法

语法

var new_array = arr.map(callback(currentValue[, index [, array]]) {
    //返回new_array的元素
} [, thisArg ])
复制代码

参数

callback 产生新数组元素的函数，带有三个参数：

  currentValue
      当前元素在数组中处理。
  index 可选的
      数组中正在处理的当前元素的索引。
  array 可选的
      该阵列map被召唤。
复制代码

thisArg 可选的 this 执行时要使用的值 callback。

返回值

一个新数组，每个元素都是回调函数的结果。
描述

map 按顺序为数组中的每个元素调用一次提供的 callback 函数，并从结果中构造一个新数组。仅对已分配值的数组的索引（包括 undefined）调用。它不会被调用缺少数组的元素（即，从未设置过的索引，已删除的索引或从未赋值的索引）。

由于map构建了一个新数组，因此在不使用返回数组时使用它是一种反模式; 使用forEach或for-of代替。标志你不应该使用map：A）你没有使用它返回的数组，和/或B）你没有从回调中返回一个值。

callback 使用三个参数调用：元素的值，元素的索引和遍历的Array对象。

如果thisArg提供了参数map，则它将用作回调的this值。否则，该值undefined将用作其this值。this最终可观察到的值callback是根据确定this函数所见的通常规则确定的。

map不会改变callback调用它的数组（虽然，如果调用，可能会这样做）。

处理的元素范围map在第一次调用之前设置callback。在调用map开始后附加到数组的元素将不会被访问callback。如果更改了数组的现有元素，则传递给它们的值callback将是map访问它们时的值。map 在访问开始之后和访问之前删除的元素不会被访问。

由于规范中定义的算法，如果调用的映射数组是稀疏的，则生成的数组也将是稀疏的，保持相同的索引为空。

使用 Array()，定义一个数量固定条目未定的数组

Array(2); // [empty × 2]
复制代码

使用 .map() 方法遍历数量固定条目未定的新数组

Array(2).map( () => "foo");  // [empty × 2]
复制代码

复制该数组后，使用 .map() 方法

[...Array(2)].map( () => "foo");  // ["foo", "foo"]
复制代码

Answers

1、使用 Array(arrayLength) 创建数组：一个新的 js 数组，其 length 属性设置为该数字

注意：这意味着 arrayLength 空插槽的数组，而不是具有实际未定义值的插槽

该数组实际上不包含任何值，甚至不包含undefined值 - 它只是一个 length 属性。

当您将具有 length 属性的项扩展到数组中时，例如[...{ length: 4 }]，扩展语法访问每个索引并在新数组中设置该索引处的值 ``` const arr1 = []; arr1.length = 4; // 该数组中不包含任何的index索引值 console.log('1' in arr1);
```
  const arr2 = [...arr1];
  console.log(arr2);
  console.log('2' in arr2);
  ```
复制代码
```
并且 .map 只映射属性实际存在于要映射的数组中的属性/值。

使用数组构造函数令人困惑。我建议使用 Array.from，从头开始创建数组时 - 你可以传递一个带有 length 属性的对象，以及一个映射函数 const arr = Array.from( { length: 2 }, () => 'foo' ); console.log(arr);

2、数组元素未分配。仅对已分配值的数组索引（包括undefined）调用 callback

var array1 = Array(2);
array1[0] = undefined;

// pass a function to map
const map1 = array1.map(x => x * 2);

console.log(array1); // [undefined, empty]
console.log(map1); // [NaN, empty]
复制代码