一、 数组的概念
1.1 什么是数组
数组是指的数据的有序列表。
- 数组中每个值称之为数组的一个元素。
- 数组中的每个元素都有一个位置,这个位置称之为索引(下标、index)。数组的索引是从 0 开始的
- 同一个数组中,元素的类型不做任何限制。也就是说,同一个数组中可以方法Number、String、Boolean、Object对象等等。可以同时放入任何的类型。甚至数组中的元素可以是另外一个数组(构成多维数组)。
1.2 JavaScript中数组的特点
虽然每种语言都有数组这种数据结构,但是JavaScript的数组相比他们有很大不同。
- 数组长度可以动态改变。
- 同一个数组中可以存储不同的数据类型。
- 数据的有序集合
- 每个数组都有一个length属性,表示的是数组中元素的个数
二、数组的创建
数组有两种基本创建方式:字面量方式和构造函数
2.1 字面量的方式
数组字面量: 所有的元素用方括号括起来,不同的元素之间用逗号分隔。
例如:[“a”, 5, “b”]
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 1
- 2
- 3
- 4
- 5
- 6
- 7
2.2 构造函数的方式
构造函数在创建对象的时候使用。数组的构造函数式 Array()
例如: new Array(数组长度);
- 1
- 2
- 3
- 4
- 5
- 6
- 1
- 2
- 3
- 4
- 5
- 6
注意:
- 使用构造函数创建数组对象的时候,最后一个元素后面不要添加括号,否则报错。 这样是错误的:
new Array("a", ) - 使用构造函数如果只传入了一个Number值,则这个值必须 >= 0, 否则会报错。
- 使用构造函数创建数组对象的时候,new 关键字是可以省略的。 例如:Array(5) 这样是可以的。
三、访问和修改数组中的元素
利用索引访问数组中的元素。
如果数组的长度为 5,那么数组的索引为 0,1,2,3,4
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 1
- 2
- 3
- 4
- 5
- 6
- 7
四、数组的长度
4.1 获取数组的长度
每个数组都有一个叫 length的属性,表示数组的长度(即:元素的个数)。
- 1
- 2
- 1
- 2
4.2 修改数组的长度
在一般的强类型语言中,数组的长度是固定的,即:数组一旦创建成功,则不能改变数组的长度。
但是,JavaScript是一种弱类型的动态语言,数组的长度可以在程序运行期间根据需要进行动态的更改
==数组length属性不是只读,而是可以修改的。==
- 通过设置length的值直接修改数组的长度到指定的数值。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 通过给最后一个元素赋值来动态修改元素的长度。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
五、数组的遍历
一般有3种方法遍历数组:
- for循环
- for… in
- for each ( ES5 新增)
5.1 使用普通for循环遍历数组
- 1
- 2
- 3
- 4
- 1
- 2
- 3
- 4
5.2 使用 for…in 循环遍历数组
for-in 语句是一种精准的迭代语句,可以用来枚举对象的属性和数组的元素。
示例:
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
5.3 使用for …each遍历数组
ES5为每个数组新增了一个方法 array.forEach(function) ,使用这个方法,可以自动帮我们遍历数组中的所有元素
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 1
- 2
- 3
- 4
- 5
- 6
- 7
六、 数组常用方法
6.1 转换方法
toString()转换方法:
- 返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串
- 1
- 2
- 3
- 4
- 5
- 1
- 2
- 3
- 4
- 5
join() 方法:
- toString() 方法只能使用逗号连接,而 join() 方法可以使用指定的连接符连接
- 1
- 2
- 3
- 4
- 1
- 2
- 3
- 4
6.2 栈方法
栈:一种数据结构。特点:FILO (先进后出)
向栈中存入元素 称之为 入栈(push)、从栈中移除元素称之为出栈(pop)。先入栈的元素在栈地下,后入栈的元素在栈顶。这两个动作都是对栈顶的元素进行操作。一般栈提供这两个操作足矣。
JavaScript中,支持像操作栈一样去操作数组。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
说明:
队列也是一种数据结构。 特点:FIFO(先进先出)
JavaScript中,对数组的操作也提供了模拟队列的方法。
- 向队列头部添加元素(unshift)、从队列头部移除元素(shift)
- 向队列尾部添加元素、从队列尾部移除元素
注意:对队列尾部的操作没有提供新的方法,使用push和pop可以完成相应的操作。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
6.3 数组中元素的倒置
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 1
- 2
- 3
- 4
- 5
- 6
- 7
注意:
- ==倒置操作是对原数组本身做了操作,返回的也是原数组对象,并不是一个新创建的数组。==
6.4 查找指定元素在数组中的索引
indexOf(item): 从前面开始向后查找 item 第一次出现的位置
lastIndexOf(item): 从尾部开始向前查找 item 第一次出现的位置
- 如果找不到元素,则返回 -1
- 1
- 2
- 3
- 4
- 5
- 1
- 2
- 3
- 4
- 5
indexOf(item, fromBack): 从第二个参数的位置开向后始查找 item 第一次出现的位置
lastIndexOf(item, fromForward): 从第二个参数的位置开始向前查找 item 第一次出现的位置
- 1
- 2
- 3
- 4
- 5
- 1
- 2
- 3
- 4
- 5
6.4 获取新的数组
- arr.contact(arrayX,arrayX,……,arrayX)
该方法用于连接两个或多个数组。至少传入一个参数,参数可以是数组也可以是元素。
==注意:该方法是返回的一个新的数组,原数组没有做任何改变==
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
arr.slice(start,end) : 截取数组,并返回截取到的新数组
- start:必须。从原数组中的start位置开始截取==(包括下标为start的元素)==。 如果是负数表示从尾部开始截取: -1表示最后一个元素
- end: 可选。截取到指定位置==(不包括下标为end的元素)==。如果没指定,则指的是截取到最后一个元素
- end要大于start,否则截取不到元素
==注意:该方法是返回的一个新的数组,原数组没有做任何改变==
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
arr.splice(index,howmany,item1,…..,itemX) 方法向/从数组中添加/删除元素,然后==返回被删除的元素组成的数组。==
- 必需。整数,规定添加/删除元素的位置,使用负数可从数组结尾处规定位置。
- 必需。要删除的元素数量。如果设置为 0,则不会删除元素。 如果添加元素这里应该是0
- 可选。向数组添加的新项目。
==注意:这个方法会对原数组做出修改。==
- 删除元素
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 添加元素
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 1
- 2
- 3
- 4
- 5
- 6
- 7
七、 数组排序
JavaScript中,所有的数组对象都提供了一个排序函数。
arr.sort(sortby) 方法用于对数组的元素进行排序。
- sortby 可选。规定排序顺序。必须是函数。
- 不传入参数的时候,是默认的升序排列。但是做升序排列的时候,是把每个元素转换成string之后,按照编码表中的顺序排序的。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 从上面可以看出来,当数组中的元素是Number的时候,按照编码表排序并不太符合我们的预期,我们更想按照数字的大小排序。这时,我们可以传递一个 “比较函数”。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 纯数字的数组,还有一种更简洁的排序函数。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
八、 数组检测
如何检测一个对象是不是一个Array。
- 使用instanceof运算符。
- 使用Array.isArray(arr) 方法。
8.1 instanceof运算符
JavaScript中instanceof运算符会返回一个 Boolean 值,指出对象是否是特定构造函数的一个实例。
- 1
- 2
- 1
- 2
8.2 Array.isArray(arr) 方法
Array.isArray(arr) , 如果arr是数组,则返回true,否则返回false
- 1
- 2
- 3
- 1
- 2
- 3
九、 二维数组
如果数组中的元素存储的是数组,则就构成了二维数组。