定义
数组是一组数据的集合,在内存中是一段连续的内存空间。(数组是一种特殊变量,它能够一次存放一个以上的值)
数组用于在单一变量存储多个值。
数组是一种特殊类型的对象。在JavaScript中对数组使用typeof
运算符会返回object
数组与普通对象的区别
a. 普通对象使用字符串作为属性名,而数组使用数字作为索引来操作元素
(数组使用数字来访问其“元素”。对象使用名称来访问其“成员”。)
// 数组->sun[0]返回sunny
let sun = ["sunny", "summer", 18];
// 对象->sun.firstName返回Bom
let sun = {firstName: "Bom", lastName: "Mi", age: 28};
b. 数组的存储性能比普通对象好
创建数组
- 使用数组文本是创建JavaScript数组最简单的方法。——> [];
语法:let array = [item1, item2, ...]; ——> let name = ["Job", "Bom", "Hum"];
空格和折行并不重要,声明可以横跨多行:
let name = [ "Job", "Bom", "Hum" ];
请不要在最后一个元素之后添加逗号(比如"Hum",),可能存在跨浏览器兼容性问题。
- 使用 JavaScript 关键词 new ——> new Array();
let name = new Array("Job", "Bom", "Hum");
简单的说:[]和new Array()是等价的。无需使用new Array()
。出于简洁、可读性和执行速度的考虑,请使用第一种方法(数组文本方法)。
- new Array(3); new Array(3)稍稍有点不一样
var a = [];
console.log(a);
// []
var b = new Array();
console.log(b);
// []
var c = new Array(3);
console.log(c);
//[empty × 3]
我们发现a和b数组都是空数组,而c的长度为3。当我们对c使用push方法之后,我们发现它的长度变成4了
var c = new Array(3);
console.log(c);
//[empty × 3]
c.push(10);
console.log(c);
//[empty × 3, 10]
我们知道push是在数组的尾部添加元素,所以当我们使用push的时候c的长度就为4,即便前3个什么值都没有。
我们再来看a和b,虽然看上去这两种方法完全不一样,但其实是一样的,[]
这种方法正是new Array()
的简单写法,[]
是js
的一个语法糖
。我们可以这样验证一下,我们都知道每一个函数都有prototype
属性,每一个实例对象有一个__proto__
属性,而这个prototype
就等于__proto__
,所以我们就判断Array.prototype
是否等于[].__proto__
,如果相等,则说明[]
底层就是通过new Array()
来实现的。
a.__proto__ === Array.prototype
// true
我们看到结果是true,所以就验证了我们的上述观点。
ps: prototype
是显示原型,__proto__
是隐示原型
数组中的元素可以是任意类型,包括对象、函数
特点
- 数组定义时可以无需指定数组长度
- 存储数据时无需指定具体类型,可以存储任意类型
- 数组的标志:
[]
- 数组的索引:从0开始的整数
- array.length。对于连续的数组,使用length属性可获取数组的长度,而非连续的数组,使用length获得的是数组的最大索引+1
- 访问数组元素:我们通过引用索引号(下标号)来引用某个数组元素。
[0]
是数组中的第一个元素。[1]
是第二个。数组索引从0
开始。
数组和对象的区别
在 JavaScript 中,数组使用数字索引。
在 JavaScript 中,对象使用命名索引。
数组是特殊类型的对象,具有数字索引。
何时使用数组,何时使用对象?
- JavaScript 不支持关联数组。
- 如果希望元素名为字符串(文本)则应该使用对象。
- 如果希望元素名为数字则应该使用数组。
数组的相关方法
我们通过
[].__proto__
来查看一下数组拥有哪些方法
push():向数组的末尾添加一个或多个元素,并返回数组新的长度,可以将要添加的元素作为方法的参数传递,这样这些元素会自动添加到数组末尾
pop(): 删除数组的最后一个元素并且返回被删除的元素
unshift():向数组的开头添加一个或多个元素并返回新的长度
shift() :删除数组第一个元素并将被删除的元素作为返回值
sort():对数组的元素进行排序:arr.sort(function(a,b)){return b-a};b-a为降序,a-b为升序
revere():倒序,与sort相反
splice():替换、插入、删除;会影响到原数组,将被删除的值返回;arr.splice(m,n,data1,data2)——从m开始,共n个,替换成data2
slice():截取,不改变原数组;arr.slice(m,n);m为开始位置,n为结束位置,假如n不写,截取到的则是从m到最后;假如n为-1,则从倒数开始截取
concat():可以连接两个或多个数组,并将新的数组返回,不对原数组造成影响;var result = arr.(arr2,arr3);或者 arr.concat(arr2,"123");
join():将数组连接转成字符串,对原数组无影响;join可以将指定字符串作参数,这个字符串将成为数组元素中的连接符
forEach():遍历数组,需要一个函数作为参数(value,index,object);数组中有几个元素就会执行几次,每次执行时,浏览器会将遍历到的元素以实参的形式传递进来,我们可以定义形参来读取内容
map():遍历当前数组,然后调用参数中的方法,返回当前方法的返回值
filter():同map()一样,但是返回值为布尔值true时,才返回数据,过滤筛选,组成新的数组返回
every():遍历数组,函数对每一项都返回true才返回true
some():其中一项返回true,则true(返回true后不在循环)
indexOf():返回指定value的索引位置,返回第一次出现元素的索引,没有找到就返回-1
lastIndexOf():从后往前找,但索引值不变,返回最后一个出现的元素的索引
reduce():迭代,收敛;返回值是最后一次函数调用时的返回值,不写true时,默认返回underfined
reduceRight():与reduce相反
copywithin(target, start, end):从数组的指定位置拷贝元素到数组的另一个指定位置中。例如:Array.copyWithin(0, 3, 5)就是把第3个位置的元素拷贝到第0个位置,把第4个位置的元素拷贝到第1个位置。
entries():返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)。 迭代对象中数组的索引值作为 key, 数组元素作为 value。
fill(value, start, end):把索引从start到end-1的位置全部填充为value。
find(callback):返回满足callback条件的数组的第一个元素
findIndex(callback):返回满足callback条件的数组的第一个元素的索引
includes(el):是否包含某个元素
forEach(callback):遍历数组
flat():返回扁平化后的数组。执行一次falt就少一层数组,直到只有一层数组位置
flatMap(callback):首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。它与map
和深度值1的flat
几乎相同,但flatMap
通常在合并成一种方法的效率稍微高一些。