摘要：查看文档可以看到的构造函数语法，可以得知支持两种构造方式。方法会把生成的稀疏数组展开并当做参数再次传给的构造函数，就是这样子这样最终就会得到一个数组，这样就不是稀疏数组了，里面是有值的，虽然是。
今天看到一段代码：
Array.apply(null, Array(30)).map(() => 4)
这代码的写法无法让人一下理解它的意图。
Google 之后知道它的作用是构造一个长度为 30 的数组，默认值是 4。
但是为什么要写得这么别扭呢？我们来分解下它每一步在做什么：
Array.apply(null, Array(30))
这一段代码生成一个长度为30的数组，里面的值都是 undefined。
之后的 .map(() => 4) ：负责填充默认值
但是为什么构造一个空值数组需要这么麻烦呢？还要用上 apply 方法，尝试用 Array(30).map(() => 4) 来生成数组的话，你会得到这样的一个结果，根本就没有值。
[ , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ]
查看文档 可以看到 Array 的构造函数语法，可以得知 Array 支持两种构造方式。使用参数形式给定 N 个数组元素，或者给定一个数组长度。
不过比较重要的一点文档里没提到，使用 new Array(arrayLength) 方式构造的数组是一个稀疏数组，里面是没有任何值的，只有长度。所以这个方式构造出来的数组是无法遍历的，也就无法用 map 遍历填充值了。
知道了上述的原因，我们就能理解：
Array.apply(null, Array(30))
其实等于
Array.apply(null, [, , , , , , , , , , , , , , , , , , , , , , , , , , , , ,]))
然后我们要继续了解 apply 方法，在这里可以看 apply 的作用 文档解释， 这里不作介绍。apply 方法会把生成的稀疏数组展开并当做参数再次传给 Array 的构造函数，就是这样子：
Array(null,null,null......))
这样最终就会得到一个数组，这样就不是稀疏数组了，里面是有值的，虽然是 undefined。
结语[ undefined, undefined, undefined ......]
总结下，其实就是 js 的 Array 的默认构造函数生成的是稀疏数组，是无法用 map 遍历填充的。所以才写得这么绕。
不过，说了这么多，要实现原本的需求，其实有更简单的方法啦：
Array(30).fill(4)
fill 方法的说明
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/91181.html
摘要：下面这条语句将导致语法错误变量名允许包含字母数字美元符号和下划线但第一个字符不允许是数字。可以把一些布尔值存入一个数组，还可以把一组数值存入一个数组甚至可以把这种数据类型混在一起存入一个数组数组元素还可以是变量这将把数组的第一个元素赋值为。 执行Javascript的方式 第一种方式是将JS代码放到 < head > 标签中的 < script > 标签之间： ...
摘要：下面这条语句将导致语法错误变量名允许包含字母数字美元符号和下划线但第一个字符不允许是数字。可以把一些布尔值存入一个数组，还可以把一组数值存入一个数组甚至可以把这种数据类型混在一起存入一个数组数组元素还可以是变量这将把数组的第一个元素赋值为。 执行Javascript的方式 第一种方式是将JS代码放到 < head > 标签中的 < script > 标签之间： ...
摘要：下面这条语句将导致语法错误变量名允许包含字母数字美元符号和下划线但第一个字符不允许是数字。可以把一些布尔值存入一个数组，还可以把一组数值存入一个数组甚至可以把这种数据类型混在一起存入一个数组数组元素还可以是变量这将把数组的第一个元素赋值为。 执行Javascript的方式 第一种方式是将JS代码放到 < head > 标签中的 < script > 标签之间： ...
摘要：它是按以下方式工作的。对已填充的二进制进行编码时，任何完全填充不包括原始数组中的位的位组都有特殊的第个符号表示。剩下的两个位组都是填充码，用来表示。最新的浏览器提供了自动生成的方法和希望此文可以帮助你完全理解。 HTTP将BASE64-编码用于基本认证和摘要认证，在几种HTTP扩展中也使用了该编码。 Base-64编码保证了二进制数据的安全 Base-64编码可以将任意一组字节转换为较...
摘要：一共讲解了个常用的新特性，讲解过程也是由浅入深。最后一个新增的方法主要是为了弥补当做构造函数使用时产生的怪异结果。特性共享父级对象共享父级不能当做构造函数语法最简表达式前后对比很容易理解，可以明显看出箭头函数极大地减少了代码量。 showImg(https://segmentfault.com/img/bVQ5GW?w=1024&h=675); 上周在公司组织了 ES6 新特性的分享会...
阅读 1215·2019-08-30 12:54
阅读 1763·2019-08-30 11:16
阅读 1504·2019-08-30 10:50
阅读 2322·2019-08-29 16:17
阅读 1134·2019-08-26 12:17
阅读 1265·2019-08-26 10:15
阅读 2259·2019-08-23 18:38
阅读 690·2019-08-23 17:50
