数组是引用类型，JavaScript中万物皆对象。
数组元素可以是一个字符串，数字，数组，布尔，或者其他对象类型。
数组的创建
1.使用数组字面量
let arr0 = [1, "array", true, Date.now()];2.使用构造函数Array()
let arr1 = new Array();//等同于[]
let arr2 = new Array(1, 2, 3, "array");//显示指定
let arr3 = new Array(10);//指定长度数组的属性
| 属性 | 描述 |
|---|---|
| length | 设置或返回数组元素的个数 |
| constructor | 返回创建数组对象的原型函数 |
| prototype | 向数组对象添加属性或方法 |
数组的方法
会改变自身的方法
- pop()
功能：用于删除数组的最后一个元素并返回删除的元素。
参数：无
返回值：返回删除的元素
let arr = [2, 4, 6, 'a', 8, true, 9];
arr.pop();
console.log(arr);//[ 2, 4, 6, 'a', 8, true ]- push()
功能：向数组的末尾添加一个或更多元素，并返回新的长度。
参数：push(newData1, newData2, ......)
返回值：新数组长度
let arr = [2, 4, 6, 'a', 8, true, 9];
arr.push("c");
console.log(arr);//[ 2, 4, 6, 'a', 8, true, "c" ]- shift()
功能：用于删除并返回数组的第一个元素。
参数：无
let arr = [2, 4, 6, 'a', 8, true, 9];
console.log(arr.shift());//2
console.log(arr);//[ 4, 6, 'a', 8, true, 9 ]- unshift()
功能：向数组的开头添加一个或更多元素，并返回新的长度。
参数：unshift(newData1, newData2, ......)
let arr = [2, 4, 6, 'a', 8, true, 9];
arr.unshift(()=>{});
console.log(arr);//[ [Function], 2, 4, 6, 'a', 8, true, 9 ]- reverse()
功能：颠倒数组中元素的顺序，并返回更改后的数组
参数：无
let arr = [2, 6, 'a', 8, true, 9];
arr.reverse();
console.log(arr);//[ 9, true, 8, 'a', 6, 2 ]- sort()
功能：对数组中的元素进行排序，默认是升序，返回新数组
参数：无
注意：在排序前，会先调用数组的toString()方法，将每个元素都转成字符之后，再进行排序，此时会按照字符串的排序，逐位比较，进行排序。
let arr = [2, 16, 'a', 8, true, 9];
arr.sort();
console.log(arr);//[ 16, 2, 8, 9, 'a', true ]解决方法：通过传入自定义函数 。sort(fn)
若fn(a,b)函数返回负数，则a排在b前面。
若fn(a,b)函数返回负数，则b排在a前面。
function fnS_B(a,b){ //从小到大
return a-b;
}
function fnB_S(a,b){ //从大到小
return b-a;
}
//注意：Number('a')为 NaN,不能用于排序。
let arr = [2, 16, 8, true, 9];
console.log(arr.sort(fnS_B));
console.log(arr.sort(fnB_S));- splice()
功能：向数组中添加，或从数组删除，或替换数组中的元素，然后返回被删除/替换的元素。数组的长度前后不会改变。
参数：splice(start,num,data1,data2,...); 所有参数全部可选；分为多种情况
- start：整数，规定添加/删除项目位置的索引，使用负数可从数组结尾处规定删除的位置
- num：整数，规定要删除元素的数量，若为0则不会删除
- data1，data2，data3.....:可选，规定需要添加的元素
let arr = [2, 8, true, 9];
arr.splice(1, 0, 'a', 'b');
console.log(arr);//[ 2, 'a', 'b', 8, true, 9 ]
arr.splice(1,2,16);
console.log(arr);//[ 2, 16, 8, true, 9 ]- copyWithin()
#ES6
功能：从数组的指定位置拷贝元素到数组的另一个指定位置。并返回新数组。
参数：array.copyWithin(target, start, end)
- target:必需。复制到指定目标索引位置。
- start:可选。元素复制的起始位置。默认start = 0。
- end:可选。停止复制的索引位置 (默认为 array.length)。如果为负值，表示倒数。
注意:复制的元素是[start,end)
let arr = [2, 8, 'a', true, 9];
console.log(arr.copyWithin(1, 2, 4));//[ 2, 'a', true, true, 9 ]- fill
#ES6
功能：用于将一个固定值替换数组的元素。
参数：array.fill(value, start, end)
- target :必需。复制到指定目标索引位置。
- start:可选。元素复制的起始位置。默认start = 0。
- end:可选。停止复制的索引位置 (默认为 array.length)。如果为负值，表示倒数。
注意:复制的元素是[start,end)
let arr = [2, 8, 'a', true, 9];
console.log(arr.fill(6, 1, 3));//[ 2, 6, 6, true, 9 ]不会改变自身的方法
这些方法都返回操作后的结果
- concat()
功能：用于连接两个或多个数组。该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。
参数：array1.concat(array2,array3,...,arrayX)
let arr1= [1,'a',false];
let arr2=[2,'b',true];
console.log(arr1.concat(arr2));//[ 1, 'a', false, 2, 'b', true ]- join()
功能：join() 方法用于把数组中的所有元素转换一个字符串并返回这个字符串。元素是通过指定的分隔符进行分隔的。
参数：array.join(separator)
separator：可选。指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。
let arr = [2, 8, 'a', true, 9];
console.log(arr.join('-')); //2-8-a-true-9- slice()
功能：从已有的数组中返回选定的元素。slice()方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。
参数：slice(start, end)
start:可选。规定从何处开始选取。end:可选。规定从何处结束选取。注意：选取元素为[ start, end )
let arr = [2, 8, 'a', true, 9];
console.log(arr.slice()); //[ 2, 8, 'a', true, 9 ]
console.log(arr.slice(1, 3)); //[ 8, 'a' ]- toString()
功能：可把数组转换为字符串，并返回结果。数组中的元素之间用逗号分隔。
参数：无。
let arr = [2, 8, 'a', true, 9];
console.log(arr.toString()); //2,8,a,true,9- indexOf()
功能：可返回数组中某个指定的元素位置。若要检索的元素没有出现，则该方法返回 -1。
参数：array.indexOf(item,start)
- item:必选。查找的元素。
- start:可选。规定在数组中开始检索的位置。默认start = 0。它的合法取值是 0 到 array.length - 1。
let arr = [2, 8, 'a', true, 9];
console.log(arr.indexOf(8)); // 1
console.log(arr.indexOf(9, 2)); // 4
console.log(arr.indexOf(8, -1)); //- lastIndexOf()
功能：返回一个指定的元素在数组中最后出现的位置，从该字符串的后面向前查找。 若要检索的元素没有出现，则该方法返回 -1。
参数：array.lastIndexOf(item,start)
- item:必选。查找的元素。
- start:可选。规定在数组中开始检索的位置。默认start= -1。
let arr = [2, 8, 'a', 8,true, 9];
console.log(arr.lastIndexOf(8, 1)); // 1
console.log(arr.lastIndexOf(8)); // 3- includes()
#ES7
功能：用来判断一个数组是否包含一个指定的值，如果是返回 true，否则false。
参数：arr.includes(item, start)
- item:必选。查找的元素。
- start:可选。规定在数组中开始检索的位置。默认start= 0。如果为负值，则按升序从 array.length + start 的索引开始搜索。
注意与indexOf()的区别。
let arr = [2, 8, 'a', true, 9];
console.log(arr.includes(8)); //true
console.log(arr.includes(8, 2)); //false
console.log(arr.includes(8, -2)); //false遍历方法
- forEach()
功能：用于调用数组的每个元素，并将元素传递给回调函数。不会对空数组进行检测。
参数：array.forEach(function(currentValue, index, arr), thisValue)
function(currentValue, index, arr):必选。数组中每个元素需要调用的函数。
currentValue:必需。当前元素。index:可选。当前元素的索引值。arr:可选。当前元素所属的数组对象。- thisValue:可选。执行回调函数时用作this的值。默认值为undefined
//将数组所有元素相加
let sum = 0;
function add(item){
sum+=item;
}
let arr = [1,3,8,6];
arr.forEach(add);
console.log(sum); //18- map()
功能：1.同forEach功能；
2.返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
3.原数组不改变。
参数：array.map(function(currentValue,index,arr), thisValue)
function(currentValue, index, arr):必选。数组中每个元素需要调用的函数。
currentValue:必需。当前元素。index:可选。当前元素的索引值。arr:可选。当前元素所属的数组对象。- thisValue:可选。执行回调函数时用作this的值。如果省略了 thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。
//输出数组的平方
function fn(item) {
return item * item;
}
let arr = [6, 2, 8, 5];
console.log(arr.map(fn)); //[ 36, 4, 64, 25 ]- filter()
功能：创建一个新的数组，新数组中的元素指定数组中符合条件的所有元素。如果没有符合条件的元素则返回空数组。
参数：array.filter(function(currentValue,index,arr), thisValue)
function(currentValue, index, arr):必选。数组中每个元素需要调用的函数。必须返回一个boolean值。
currentValue:必需。当前元素。index:可选。当前元素的索引值。arr:可选。当前元素所属的数组对象。- thisValue:可选。执行回调函数时用作this的值。默认值为undefined
//输出数组中的偶数
function fn(item) {
if (item % 2) {
return false;
} else {
return true;
}
}
let arr = [6, 2, 8, 5];
console.log(arr.filter(fn)); //[ 6, 2, 8 ]- every()
功能：用于检测数组所有元素是否都符合指定条件。如果所有元素都通过检测返回 true，否则返回 false。
参数：array.every(function(currentValue,index,arr), thisValue)
function(currentValue, index, arr):必选。数组中每个元素需要调用的函数。
currentValue:必需。当前元素。index:可选。当前元素的索引值。arr:可选。当前元素所属的数组对象。- thisValue:可选。执行回调函数时用作this的值。默认值为undefined
//判断数组元素是否都为偶数
function fn(item) {
if (item % 2) {
return false;
} else {
return true;
}
}
let arr = [6, 2, 8, 5];
console.log(arr.every(fn)); //false- some()
功能：用于检测数组中的元素是否满足指定条件。
some() 方法会依次执行数组的每个元素：
- 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
- 如果没有满足条件的元素，则返回false。
参数：array.every(function(currentValue,index,arr), thisValue)
function(currentValue, index, arr):必选。数组中每个元素需要调用的函数。
currentValue:必需。当前元素。index:可选。当前元素的索引值。arr:可选。当前元素所属的数组对象。- thisValue:可选。执行回调函数时用作this的值。默认值为undefined
//判断数组中是否存在奇数
function fn(item) {
if (item % 2) {
return true;
} else {
return false;
}
}
let arr = [6, 2, 8, 5];
console.log(arr.some(fn)); // true- reduce()
功能：从数组的第一项开始，为数组中的每一个元素依次执行函数，逐个遍历到最后，迭代数组的所有项，返回计算结果。
参数：array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
function(total,currentValue, index,arr):必选。数组中每个元素需要调用的函数。
total:必需。初始值, 或者计算结束后的返回值。currentValue:必需。当前元素。currentIndex:可选。当前元素的索引。arr:可选。当前元素所属的数组对象。- initialValue:可选。传递给函数的初始值
//将数组所有元素相加
function fn(total, item) {
return total += item;
}
let arr = [1, 3, 8, 6];
console.log(arr.reduce(fn, 0)); //18- reduceRight()
功能：从数组的末尾开始，为数组中的每一个元素依次执行函数，逐个遍历到数组的第一个元素，迭代数组的所有项，返回计算结果。（与reduce执行顺序相反）
参数：array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
function(total,currentValue, index,arr):必选。数组中每个元素需要调用的函数。
total:必需。初始值, 或者计算结束后的返回值。currentValue:必需。当前元素。currentIndex:可选。当前元素的索引。arr:可选。当前元素所属的数组对象。- initialValue:可选。传递给函数的初始值
//将数组所有元素相加
function fn(total, item) {
return total += item;
}
let arr = [1, 3, 8, 6];
console.log(arr.reduceRight(fn, 0)); // 18- find()
#ES6
功能：返回通过测试的第一个元素值。如果没有符合条件的元素返回 undefined
参数：array.find(function(currentValue, index, arr),thisValue)
function(currentValue, index, arr):必选。数组中每个元素需要调用的函数。
currentValue:必需。当前元素。index:可选。当前元素的索引值。arr:可选。当前元素所属的数组对象。- thisValue:可选。执行回调函数时用作this的值。默认值为undefined
//查找第一个大于5的元素值
function fn(item) {
return item>5;
}
let arr1 = [1, 3, 8, 6];
console.log(arr1.find(fn)); // 8
let arr2 = [1, 3, 2, 5];
console.log(arr2.find(fn)); // undefined- findIndex()
#ES6
功能：返回通过测试的第一个元素值的索引。如果没有符合条件的元素返回 -1
参数：array.findIndex(function(currentValue, index, arr), thisValue)
function(currentValue, index, arr):必选。数组中每个元素需要调用的函数。
currentValue:必需。当前元素。index:可选。当前元素的索引值。arr:可选。当前元素所属的数组对象。- thisValue:可选。执行回调函数时用作this的值。默认值为undefined
//查找第一个大于5的元素值的索引
function fn(item) {
return item>5;
}
let arr1 = [1, 3, 8, 6];
console.log(arr1.findIndex(fn)); // 2
let arr2 = [1, 3, 2, 5];
console.log(arr2.findIndex(fn)); // -1- entries()，keys() 和 values()
#ES6
功能：用于遍历数组。它们都返回一个遍历器对象。可以用for...of循环进行遍历，唯一的区别是keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历。
参数：无
let arr = [1, 3];
console.log(arr.keys());
for (let i of arr.keys()) {
console.log(i);
}
//0
//1
for (let i of arr.values()) {
console.log(i);
}
//1
//3
for (let [i, elem] of arr.entries()) {
console.log(i + "--" + elem);
}
//0--1
//1--3
其他
- 扩展运算符
...
功能：将一个数组转为用逗号分隔的参数序列。该运算符主要用于函数调用。
//扩展运算符
function add(a, b) {
return a + b;
}
let arr = [2, 3];
console.log(add(...arr));// 5- from()
ES6
功能：将类数组对象和可遍历对象转化为数组。
参数：Array.from(object, fn, thisValue)
- object：必需，要转换为数组的对象
- fn：可选，数组中每个元素要调用的函数
- thisValue：可选，映射函数(mapFunction)中的 this 对象
let obj ={
0:'a',
1:'b',
2:'c',
length:3
};
console.log(Array.from(obj));//[ 'a', 'b', 'c' ]- of()
ES6
功能：用于将一组值，转换为数组。主要目的是弥补数组构造函数Array()的不足。因为参数个数的不同，会导致Array()的行为有差异。
参数：Array.of(element0[, element1[, ...[, elementN]]])
Array(); //[]
Array.of(); //[]
Array(3);//[ , , ,]
Array.of(3);//[3]
Array(2, 4);//[2,4]
Array.of(2, 4);//[2,4]数组应用
数组去重
- indexOf()
// indexOf()
function unique(array) {
let res = [];
for (let i of arr) {
if (res.indexOf(i) === -1) {
res.push(i);
}
}
return res;
}
let arr = [1, 1, "1", true];
console.log(unique(arr)); //[ 1, '1', true ]- object 键值对
function unique(arr) {
let obj = {};
let res = [];
for (let i of arr) {
if (!obj[i]) {
obj[i] = true;
res.push(i);
}
}
return res;
}
let arr = [1, 1, "1", true];
console.log(unique(arr)); //[ 1, true ]- set、map
ES6
function unique(array){
return Array.from(new Set(array));
// return [...(new Set(array))];
}
let arr = [1, 1, "1", true];
console.log(unique(arr)); //[ 1, '1', true ]求数组的最值
使用 Math 的静态方法
Math.max();
Math.min();
- apply()
let arr = [1, 6, 2, 8];
console.log(Math.max.apply(null,arr));//8
console.log(Math.min.apply(null,arr));//1- 扩展运算符
ES6
let arr = [1, 6, 2, 8];
console.log(Math.max(...arr)); //8
console.log(Math.min(...arr)); //1数组乱序
//数组乱序
function fn(){
return Math.random()-0.5;
}
let arr = [1,2,3,4,5,6];
console.log(arr.sort(fn));