示例代码:

<!DOCTYPE html>
<html lang="zh"> <head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>js 创建数组方法以及区别</title>
</head> <body> <script type="text/javascript">
//方法一 new Array
console.log(new Array(2))
//方法二 Array.from
console.log(Array.from({
length: 2
}))
//方法三
let arr= [1,2]
console.log(arr)
//方法四
console.log([...arr]) function generateCards(n) {
return Array.from({
length: n
}).map((val, i) => i)
} let cards = generateCards(2)
console.log(cards);
</script>
</body> </html>

控制台输出为:

使用new Array创建的数组,具有length属性,没有每个元素

使用Array.from创建的数组,具有length属性,每个元素为undefined,因此后续可以使用filter或者map等方法。array.from还可以转为类似数组的对象,...扩展运算符不能。

概念:类似数组的对象,本质特征只有一点,即必须有length属性。

js 创建数组方法以及区别的更多相关文章

  1. js 循环 js创建数组

    循环 for (var i = 0; i < myArray.length; i++) { console.log(myArray[i]); }; for (var arr in myArray ...

  2. JS创建数组的三种方法

    1     常规方式 创建数组并给数组元素赋值 var myCars = new Array(); myCars[0] = "Saab"; myCars[1] = "Vo ...

  3. js 删除数组方法

    今天遇到一个比较脑残的问题 ,在在用js删除数组的时候 delete 数组[下标]的方法删除数组时,该数组的下标变为null,但是数组的长度并没有发生相应的变化 转而使用splice(小标,第N个)删 ...

  4. js中数组方法大全

    js数组方法大全 一:前言 我们在学到js中数组的时候,我们会接触到js中数组的一些方法,这些方法对我们来说,可以很遍历的达到我们想要的结果,但是因为方法比较多,有些方法也不常用,可能会过一段时间就会 ...

  5. js的数组方法整理

    slice 从已有的数组中返回选定的元素.该方法不会修改数组,而是返回一个子数组. 语法:arr.slice(start,end) start: 必须,规定从何处开始选取.如果是负数,就是从尾部开始算 ...

  6. JS中数组方法的封装之slice

    slice方法的功能 // 1) : 数组的截取 // 2) :slice(m,n): 从数组索引m开始,截取到索引n,但是不包含n;[前包后不包] // slice(m) : 从索引m开始,截取到末 ...

  7. JS中数组方法小总结

    1.array.concat(item……) 返回:一个新数组 该方法产生一个新数组,它包含一份array的浅复制,并把一个或多个参数item附加在其后.如果参数item是一个数组,那么它的每个元素会 ...

  8. js基础---数组方法

    数组数据的排序及去重 sort无形参的排序方式 arr1=[2,12,3,15]; var a=arr1.sort();console.log(arr1);console.log(a);//排序会改变 ...

  9. js中数组方法及分类

    数组的方法有很多,这里简单整理下常用的21种方法,并且根据它们的作用分了类,便于记忆和理解. 根据是否改变原数组,可以分为两大类,两大类又根据不同功能分为几个小类 一.操作使原数组改变   1.数组的 ...

随机推荐

  1. ReentrantLock和ReentrantReadWriteLock对比

    本文系作者原创,转载请注明:https://www.cnblogs.com/yanfei1819/p/10314533.html ReentrantLock 一.简介 ReentrantLock重入锁 ...

  2. Codeforces Round #116 (Div. 2, ACM-ICPC Rules) Letter(DP 枚举)

    Letter time limit per test 1 second memory limit per test 256 megabytes input standard input output ...

  3. 服务器Tomcat WAS JBoss

    做任何web项目,都离不开服务器,有钱的公司用WebSphere.WebLogic,没钱公司用nginx+tomcat,不要小瞧nginx+tomcat麻雀虽小,五脏俱全. 服务器的知识,在笔试.面试 ...

  4. CocurrentHashMap和HashTable区别分析

    集合是编程中最常用的数据结构.而谈到并发,几乎总是离不开集合这类高级数据结构的支持.比如两个线程需要同时访问一个中间临界区(Queue),比如常会用缓存作为外部文件的副本(HashMap).这篇文章主 ...

  5. NOIP 2006 提高组 t1 能量项链

    题目描述 在Mars星球上,每个Mars人都随身佩带着一串能量项链.在项链上有N颗能量珠.能量珠是一颗有头标记与尾标记的珠子,这些标记对应着某个正整数.并且,对于相邻的两颗珠子,前一颗珠子的尾标记一定 ...

  6. File I/O知识点

    问题1:File类的作用? 解答:File 类用于访问文件或目录的属性.File类位于java.io包中. 问题2:流?及流的分类? 解答:流是指一连串流动的字符,是以先进先出的方式发送信息的通道.程 ...

  7. js 封装的自动创建表格的相关操作

    因为要做一个动态输入的表格,现在积累一下资料,在网上找了一些资料,经过总结是使用更加方便些,谁有更好的插件和封装的东西,请大家分享一下. <script type="text/java ...

  8. [转] Mybatis 示例之 SelectKey

    SelectKey在Mybatis中是为了解决Insert数据时不支持主键自动生成的问题,他可以很随意的设置生成主键的方式. 不管SelectKey有多好,尽量不要遇到这种情况吧,毕竟很麻烦. sel ...

  9. CDOJ 1277 智商杯考试 每周一题 div2 二分+数学

    智商杯考试 题目连接: http://acm.uestc.edu.cn/#/problem/show/1277 Description 你是一个挂科选手. 你现在正在考试,你很方. 你参加的考试叫做智 ...

  10. Codeforces Round #343 (Div. 2) E. Famil Door and Roads lca 树形dp

    E. Famil Door and Roads 题目连接: http://www.codeforces.com/contest/629/problem/E Description Famil Door ...