多个对象添加到一个空的数组js_JavaScript数组及部分API介绍

本博客介绍的内容如下：

1、创建数组的一般用法；

2、数组对象与普通对象的一些对比；

3、伪数组；

4、数组对象与字符串对象的一些对比；

5、数组window.array的API——forEach、sort；

6、数组window.array的API——join、concat、map、filter、reduce；

7、部分总结

MDN关于数组的介绍链接

Array​developer.mozilla.org

---

1、创建数组的一般用法

什么是数组——数组是按次序排列的一组值，在JavaScript里面就是用构造函数Array构造出来的对象，就是数组。数组也属于对象。

前面介绍过JavaScript的几种类型及相关的用法

bomber：《JS 历史、数据类型、对象、typeof》​zhuanlan.zhihu.com

(1)只传入一个参数（数字）

var a=Array(3)

打印出来可以看到只有一个length:3，在加上原型（公用属性）

它有数组单独的原型（公用属性），并且最内层公用属性还是Object。

除此之外相应的value也没有

对应的key也没有

并且他的构造函数是Array

其他类型的构造函数、原型、__proto__和prototype的区别见博客

bomber：《Global Object、公用属性（原型）、prototype和__proto__》​zhuanlan.zhihu.com

顺便说下，下面的undefined是一个语句的值，声明开头的比如var所返回的值都是undefined。

(2)传入的参数（数字）至少为2个

这时候不仅有长度length，数组的原型（公用属性），还有key和value

这就是数组传入一个参数（数字）和多个参数（数字）的不一致性。

(3)用new创建数组

可以看到加new与不加new的效果是一样的，这与对象（复杂类型）是一致的，因为数组本身也是属于对象。

而前面介绍过基本类型——数字、字符串、布尔，加new与不加new的效果是不一致的。

bomber：《Global Object、公用属性（原型）、prototype和__proto__》​zhuanlan.zhihu.com

单个参数（数字）

多个参数（数字）

(4)用中括号[]创建数组

可以看到，用中括号[]创建的数组，不管传入一个参数(数字)还是多个参数(数字)，都可以存在key、value、length还有原型（公用属性）

---

2、数组对象与普通对象的一些对比

(1)数组对象与普通对象的原型链的对比

一个数组对象

var a=[1,2,3]

列一个长得很像上面数组的普通对象

var b={
    
0:1,
1:2,
2:3,
length:3
}

通过打出来可以看到他们长得特别像

虽然本身的内容很像，但是他们各自的__proto__不同，对应的他们各自的构造函数也不同。

数组对象是由构造函数Array构造的，普通对象是由构造函数Object构造的。Array.prototype有Object.prototype没有的属性，比如pop，push，shift等

之前在算法和数据结构中有说到队列和栈

bomber：算法和数据结构​zhuanlan.zhihu.com

而队列和栈才可以使用pop、push、shift，所以队列和栈是用数组来实现的，数组可以是队列或者栈，但是普通对象不能实现。

但是数组和对象都可以是哈希表。

(2)数组对象与普通对象属性访问器（点号或中括号）的对比

同样是(1)里面的数组对象和普通对象。

经过测试，可以看到数组对象和普通对象都是可以进行属性访问器的操作，并赋值，唯一不同的是数组对象如果使用了数字key，那么他的length就会改变为最大的数字key加一。这与前面算法与数据结构里面哈希一节说到的length完全一致。

如果数字key与原来的数字key之间有间隔，那么会多出几个empty

bomber：算法和数据结构​zhuanlan.zhihu.com

(3)数组对象与普通对象遍历的对比

数组对象代码：

var a=[1,2,3]
a.xxx='xxx'
a.yyy='yyy'
a[10]=1

普通对象代码：

var b={
    
0:1,
1:2,
2:3,
length:3
}
b.xxx='xxx'
b.yyy='yyy'
b[10]=1

(3-1)用for循环遍历

(3-1-1)遍历数组对象a

for(let i=0;i<a.length;i++){
    console.log(a[i])
}

可以看到只会遍历到数字key对应的value。中间空出来的几个会显示undefined，而不是数字的xxx和yyy作为key的时候不会打出任何信息。

(3-1-2)遍历普通对象b

可以看到只会遍历到数字key对应的value。

因为普通对象里面的length是我们手动写进去，为了显示和数字一样而已，这里的length还是3，所以遍历不到数字10。

把判定条件修改为i<11后

显示的效果跟数组是一样的。

---

说明数组默认有对应的key，key从0开始计数。数组的某个数字key就是对应的索引值。因为这里for循环是用的数字来获取key值，所以相应的非数字key是无法获取得到的。

如果想遍历对象里面的所有key，该方法（用for循环遍历）仅仅适用于数字作为key的对象，因为本身i设置的就是从0开始做加1计算来判定，而数组对象刚好就是默认所有的key都是数字做为key。当然用户可以