之前看到知乎上的这道题:如何不使用loop循环,创建一个长度为100的数组,并且每个元素的值等于它的下标?,在这个问题里面题主提到,他写了这么一段代码:
"use strict" let arr = Array(100).map( (item,idx) => idx)
结果arr是一个有100个空位的数组:
这说明Array.prototype.map()会跳过空位元素嘛。
然后我在下面的答案里看到这么一条:
Array.from(new Array(100), (item, idx) => idx) //or the alternative Array.from({length: 5}, (item, idx) => idx)
我本来是觉得,这个肯定也不行嘛,这俩都是用Array构造函数新建了一个全是空位的数组嘛,怎么会不一样呢?结果试了一下之后发现居然成功地得到了数组。我开始怀疑Array.from的map函数的实现和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会调用every element of the array.
而在map函数那边:
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方法本身不一致。
当然结论并没有这么厉害 Orz...后来我偶然间发现原来是因为Array.from()方法会把数组的空位转为undefined.也就是说数组空位元素的处理和map方法的实现是无关的。
数组空位元素的处理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则是明确将空位转为undefined,Array.from方法会将数组的空位转为undefined,也就是说,这个方法不会忽略空位:
Array.from(["a",,"b"]) // [ "a", undefined, "b" ]
扩展运算符(...)也会将空位转为undefined:
[...["a",,"b"]] // [ "a", undefined, "b" ]
for...of循环也会遍历空位:
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
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/79006.html
摘要:数组篇方法函数可以将函数作为参数传入,并将数组中每个元素代入函数进行处理返回,返回一个新的数组可以看出可以传入两个参数,第一个参数中函数可以填入三个参数,数组的元素,数组的索引,数组本身第二个参数用来绑定回调函数内部的注意点当元素为空位,, 数组篇 map()方法 map函数可以将函数作为参数传入,并将数组中每个元素代入函数进行处理返回,返回一个新的数组 arr.map(functio...
摘要:比如,构造函数返回的数组都是空位。方法方法方法方法方法方法方法方法对空位的处理则是明确将空位转为。在这些情况下,迭代器关闭。 原型链相关 最详尽的 JS 原型与原型链终极详解 isNaN() 和 Number.isNaN() 的区别 isNaN() 是 ES1 规范; 是全局方法; 如果参数不是一个 Number 类型,会先尝试将参数转化为数值,然后对转换后的结果进行是否是 Na...
摘要:原来的也被修改了数组实例的喝方法,用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为的成员,然后返回该成员。数组实例的方法使用给定值,填充一个数组。 1 Array.from() Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括...
阅读 2166·2021-11-22 13:54
阅读 3358·2019-08-29 12:25
阅读 3408·2019-08-28 18:29
阅读 3527·2019-08-26 13:40
阅读 3253·2019-08-26 13:32
阅读 932·2019-08-26 11:44
阅读 2194·2019-08-23 17:04
阅读 2948·2019-08-23 17:02