資訊專欄INFORMATION COLUMN
之前看到知乎上的這道題：如何不使用loop循環(huán)，創(chuàng)建一個長度為100的數(shù)組，并且每個元素的值等于它的下標(biāo)？，在這個問題里面題主提到，他寫了這么一段代碼：
"use strict" let arr = Array(100).map( (item,idx) => idx)
結(jié)果arr是一個有100個空位的數(shù)組:
這說明Array.prototype.map()會跳過空位元素嘛。
然后我在下面的答案里看到這么一條：
Array.from(new Array(100), (item, idx) => idx)
//or the alternative
Array.from({length: 5}, (item, idx) => idx)
我本來是覺得，這個肯定也不行嘛，這倆都是用Array構(gòu)造函數(shù)新建了一個全是空位的數(shù)組嘛，怎么會不一樣呢？結(jié)果試了一下之后發(fā)現(xiàn)居然成功地得到了數(shù)組。我開始懷疑Array.from的map函數(shù)的實現(xiàn)和Array.prototype.map有不一樣的地方。再加上MDN的文檔也來搗亂：
Array.from(arrayLike[, mapFn[, thisArg]]) #arrayLike An array-like or iterable object to convert to an array. #mapFn Optional. Map function to call on. #thisArg Optional. Value to use as this when executing mapFn.
在這里mapFn下面明確地指出mapFn會調(diào)用every element of the array.
而在map函數(shù)那邊：
callback is invoked only for indexes of the array which have assigned values, including undefined. It is not called for missing elements of the array.
明確說明會跳過空位元素，所以我就想是不是這倆家伙的map方法本身不一致。
當(dāng)然結(jié)論并沒有這么厲害 Orz...后來我偶然間發(fā)現(xiàn)原來是因為Array.from()方法會把數(shù)組的空位轉(zhuǎn)為undefined.也就是說數(shù)組空位元素的處理和map方法的實現(xiàn)是無關(guān)的。
數(shù)組空位元素的處理forEach(), filter(), every() 和some()都會跳過空位。
map()會跳過空位，但會保留這個值
join()和toString()會將空位視為undefined，而undefined和null會被處理成空字符串
// forEach方法
[,"a"].forEach((x,i) => log(i)); // 1
// filter方法
["a",,"b"].filter(x => true) // ["a","b"]
// every方法
[,"a"].every(x => x==="a") // true
// some方法
[,"a"].some(x => x !== "a") // false
// map方法
[,"a"].map(x => 1) // [,1]
// join方法
[,"a",undefined,null].join("#") // "#a##"
// toString方法
[,"a",undefined,null].toString() // ",a,,"
ES6則是明確將空位轉(zhuǎn)為undefined,Array.from方法會將數(shù)組的空位轉(zhuǎn)為undefined,也就是說，這個方法不會忽略空位:
Array.from(["a",,"b"]) // [ "a", undefined, "b" ]
擴(kuò)展運算符（...）也會將空位轉(zhuǎn)為undefined:
[...["a",,"b"]] // [ "a", undefined, "b" ]
for...of循環(huán)也會遍歷空位:
let arr = [, ,];
for (let i of arr) {
console.log(1);
}
// 1
// 1
entries()、keys()、values()、find()和findIndex()會將空位處理成undefined:
// entries() [...[,"a"].entries()] // [[0,undefined], [1,"a"]] // keys() [...[,"a"].keys()] // [0,1] // values() [...[,"a"].values()] // [undefined,"a"] // find() [,"a"].find(x => true) // undefined // findIndex() [,"a"].findIndex(x => true) // 0
參考：阮一峰ES2015
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/79006.html
摘要：數(shù)組篇方法函數(shù)可以將函數(shù)作為參數(shù)傳入，并將數(shù)組中每個元素代入函數(shù)進(jìn)行處理返回，返回一個新的數(shù)組可以看出可以傳入兩個參數(shù)，第一個參數(shù)中函數(shù)可以填入三個參數(shù)，數(shù)組的元素，數(shù)組的索引，數(shù)組本身第二個參數(shù)用來綁定回調(diào)函數(shù)內(nèi)部的注意點當(dāng)元素為空位，， 數(shù)組篇 map()方法 map函數(shù)可以將函數(shù)作為參數(shù)傳入，并將數(shù)組中每個元素代入函數(shù)進(jìn)行處理返回，返回一個新的數(shù)組 arr.map(functio...
摘要：比如，構(gòu)造函數(shù)返回的數(shù)組都是空位。方法方法方法方法方法方法方法方法對空位的處理則是明確將空位轉(zhuǎn)為。在這些情況下，迭代器關(guān)閉。 原型鏈相關(guān) 最詳盡的 JS 原型與原型鏈終極詳解 isNaN() 和 Number.isNaN() 的區(qū)別 isNaN() 是 ES1 規(guī)范； 是全局方法； 如果參數(shù)不是一個 Number 類型，會先嘗試將參數(shù)轉(zhuǎn)化為數(shù)值，然后對轉(zhuǎn)換后的結(jié)果進(jìn)行是否是 Na...
摘要：中的方法遍歷一下數(shù)組中的每個選項返回一個新的數(shù)組。還可以接受第二個參數(shù)，作用類似與數(shù)組的方法，用于對每個元素進(jìn)行處理。這個方式是用于將一組值，轉(zhuǎn)換為數(shù)組?？蛇x到該位置前停止讀取數(shù)據(jù)，默認(rèn)等于數(shù)組長度。如果是負(fù)數(shù)，表示倒數(shù)。 ES6中數(shù)組增加了很多新的方法，但是先回顧下之前ES5中的數(shù)組的方法。 ES5中的方法 Array.prototype.forEach 遍歷一下數(shù)組中的每個選...
摘要：原來的也被修改了數(shù)組實例的喝方法，用于找出第一個符合條件的數(shù)組成員。它的參數(shù)是一個回調(diào)函數(shù)，所有數(shù)組成員依次執(zhí)行該回調(diào)函數(shù)，直到找出第一個返回值為的成員，然后返回該成員。數(shù)組實例的方法使用給定值，填充一個數(shù)組。 1 Array.from() Array.from方法用于將兩類對象轉(zhuǎn)為真正的數(shù)組：類似數(shù)組的對象（array-like object）和可遍歷（iterable）的對象（包括...
摘要：數(shù)組定義數(shù)組是按次序排列的一組值每個值都有編號，從開始可以在定義時賦值，也可以先定義后賦值任何類型的數(shù)據(jù)都可以存入數(shù)組數(shù)組的本質(zhì)本質(zhì)上，數(shù)組屬于一種特殊的對象，它的鍵名是按次序排列的一組整數(shù)數(shù)組成員的鍵名是固定的，因此不用為每個元素指定鍵名 數(shù)組定義 數(shù)組是按次序排列的一組值 每個值都有編號，從0開始 可以在定義時賦值，也可以先定義后賦值 任何類型的數(shù)據(jù)都可以存入數(shù)組 ...
閱讀 2226·2021-11-22 13:54
閱讀 3384·2019-08-29 12:25
閱讀 3448·2019-08-28 18:29
閱讀 3594·2019-08-26 13:40
閱讀 3284·2019-08-26 13:32
閱讀 970·2019-08-26 11:44
閱讀 2238·2019-08-23 17:04
閱讀 2979·2019-08-23 17:02
