原來new Array(1) 和 [undefined]不同

先看一段代碼

const array = new Array(5).map((item) => {
  return item = {
    name: 'stone'
  }
});
console.log(array);
複製代碼

覺得的結果：[{name: 'stone'}, {name: 'stone'}, {name: 'stone'}, {name: 'stone'}, {name: 'stone'}]

實際的結果：[undefined × 5]

what the fuck??? 黑人問號

我覺得緣由是：由於咱們數組裏面的值是undefined，因此咱們不能給undefined賦值。好的，接下來驗證個人猜測。

const array = [undefined, undefined, undefined, undefined, undefined];
const newArr = array.map((item) => {
  return item = {
     name: 'stone'
   }  
});
console.log(newArr);
複製代碼

輸出的結果：

what the fuck??? 黑人問號

什麼緣由致使出現這樣的結果了

原來如此：developer.mozilla.org/en-US/docs/…

實際上new Array(x)這個操做不是建立一個x項都是undefined的數組，它建立的是一個只有長度的數組，裏面的每項都是沒有被賦過值的(能夠想象new Array(5)其實是建立了一個[ , , , , , ]的數組。

const array = [ , , , , , ];
const newArr = array.map((item) => {
  return item = {
     name: 'stone'
   }  
});
console.log(newArr);
複製代碼

輸出的結果：[undefined × 5]

因此總結一下：map函數的回調函數只會被賦過值的項調用。new Array(1) 和 [undefined]不同。new Array(1)沒有爲數組中的項賦過值，而[undefined]爲數組中的項賦了一個undefined值。

解決辦法

const array = new Array(5).fill().map((item) => {
  return item = {
    name: 'stone'
  }
});
console.log(array);
複製代碼