在 JavaScript 中,数组可以容纳任何类型的值,可以是字符串、数字、对象(object),甚至是其他数组(多维数组就是通过这种方式来实现的)\
空数组
给定一个空数组,里面默认的是undefined
var b = new Array(3)
console.log(...b) //undefined undefined undefined
在js数组原型中有以下方法,也可以在原型扩展自定义方法
增
1. push() 添加到数组末尾
新添加的加到数组末尾,并返回修改后数组的长度,改变了原来的数组,新添加的元素可以是字符串、数字、数组
var arr = [1,2,3,4,5,6,7,8,9]
arr.push(10)
console.log(arr); //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
2. unshift() 添加到数组开头
逐个添加到数组开头,并返回修改后数组的长度,改变了原来的数组,新添加的元素可以是字符串、数字、数组
var arr = [1,2,3,4]
arr.unshift(10)
console.log(arr); //[10, 1, 2, 3, 4]
3. splice() 数组任意位置添加元素
在数组任意位置添加元素 ,该方法的返回值是被删除的数组,改变了原来的数组,新添加的元素可以是字符串、数字、数组
var arr = [1,2,3,4,5]
arr.splice(1,2,7) //在下标为1的位置删除2个,并加入新元素7
console.log(arr); //[1, 7, 4, 5]
删
1. pop() 删除数组末尾
改变了原来的数组,返回修改后数组的长度
var arr = [1,2,3,4,5]
arr.pop()
console.log(arr); // [1, 2, 3, 4]
2. splice() 数组任意位置删除元素
改变了原来的数组,返回修改后数组的长度
var arr = [1,2,3,4,5]
arr.splice(1,2) //在下标为1的位置删除2个
console.log(arr); // [1, 4, 5]
3. shift() 删除数组中第一个元素
改变了原来的数组,返回修改后数组的长度
var arr = [1,2,3,4,5]
console.log(arr.shift()); //1
console.log(arr); //[2, 3, 4, 5]
改
1. flat() 把嵌套数组换成一个数组
let arr = [1,2,[3,[4,[5]]]]
console.log(arr.flat(1)); // [1, 2, 3, Array(2)]
console.log(arr.flat(2)); // [1, 2, 3, 4, Array(1)]
console.log(arr.flat(Infinity)); // [1, 2, 3, 4, 5]
2. toString() 把数组转换为字符串
原始数组不改变,数组中的元素之间用逗号分隔。
var arr = [1,2,3,4,5]
console.log(arr.toString()); //1,2,3,4,5
console.log(arr); //[1, 2, 3, 4, 5]
3. toLocaleString() 把Date对象转换为字符串
var d=new Date();
var n=d.toLocaleString();
console.log(n); //2022/7/28 15:43:36
查
1. at() 根据索引找值
可正可负,负的从后向前遍历
var arr = [1,2,3,4,5]
console.log(arr.at(2)); // 3
console.log(arr.at(-1)); // 5
2. indexOf() 根据值找索引
找不到显示-1,内部使用严格相等运算符(===)进行判断,这会导致对NaN的误判。
var arr = [1,2,3,4,5]
console.log(arr.indexOf(1)); // 0 数字1在下标为0的位置
console.log(arr.indexOf(2,3)); //-1 从3的位置查找2所处的位置,找不到为-1
3. lastIndexOf() 元素在数组中最后出现的位置
从该字符串的后面向前查找。如果要检索的元素没有出现,则该方法返回 -1。
var arr = [3,2,3,4,5,4]
console.log(arr.lastIndexOf(4)); //5 4在数组最后出现的位置是5
console.log(arr.lastIndexOf(3,4)); //2 从下标为4的位置向前找3最后出现的位置
4. includes() 数组是否包含指定的值
var arr = [1,2,3,4,5]
console.log(arr.includes(5)); //true
console.log(arr.includes(5,0)); //true 从下标为0的位置开始查找
5. find() 符合函数条件的数组元素
查找数组中符合条件的第一个元素,如果没有符合条件的元素,则返回undefined
var arr = [1,2,3,4,5]
var sum = arr.find(item => item > 2)
console.log(sum); //3 符合条件的第一个元素是3
5.1 findIndex() 符合函数条件的数组第一个元素
var arr = [1,2,3,4,5]
var sum = arr.findIndex(item => item > 2)
console.log(sum); //2 符合条件元素3,它的下标为2
5.2 findIndex() 符合函数条件的数组第一个元素下标
var arr = [1,2,3,4,5]
var sum = arr.findIndex(item => item > 2)
console.log(sum); //2 符合条件元素3,它的下标为2
5.3 findfindLast() 符合函数条件的数组最后一个元素
var arr = [1,2,3,4,5]
var sum = arr.findLast(item => item > 2)
console.log(sum); //5
5.4 findfindLast() 符合函数条件的数组最后一个元素下标
var arr = [1,2,3,4,5]
var sum = arr.findLastIndex(item => item > 2)
console.log(sum); //4
6. some() 元素是否满足指定条件
some() 方法会依次执行数组的每个元素:如果有一个元素满足条件返回true , 剩余的元素不会再执行检测。如果没有满足则返回false。不会改变原始数组。不会对空数组进行检测。
var arr = [1,2,3,4,5]
var sum = arr.some(item => {
return item > 5
})
console.log(sum); //false 没有大于5,返回false
7. every() 元素是否都满足指定条件
测数组所有元素是否都符合指定条件。如果数组中检测到有一个元素不满足,则返回 false ,且剩余的元素不会再进行检测。如果所有元素都满足条件,则返回 true。不会对空数组进行检测。不会改变原始数组。
var arr = [1,2,3,4,5]
var sum = arr.every((value) => {
return value > 2 //1、2不满足大于2
})
console.log(sum); //false
遍历
1. entries() 遍历键值对
是一个键值对存在
var arr = [1,2,3,4,5]
var a = arr.entries() //Array Iterator {}
var b = a.next() //{value: Array(2), done: false}
while(!b.done) {
console.log(b.value);
b = a.next()
} // [0, 1], [1, 2] ,[2, 3]
var arr = [1,2,3,4,5]
for(obj of arr.entries()){
console.log(obj);
}
2. forEach() 遍历元素
调用数组的每个元素,并将元素传递给回调函数。参数第一个是value,第二个是index,原始数组不变
var arr = [1,2,3,4,5]
arr.forEach((value,index) => {
console.log(index,value); //0 1 1 2 2 3
})
3. keys() 遍历数组中的key(键)
var arr = [1,2,3,4,5]
console.log(arr.keys()); //Array Iterator {}
for (obj of arr.keys()){
console.log(obj); //0,1,2,3,4
}
4.map() 处理数组的每个元素
返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。原始数组不变
var arr = [1,2,3,4,5]
var sum = arr.map((value) => {
return value*value;
})
console.log(sum); //[1, 4, 9, 16, 25]
console.log(arr); //[1, 2, 3, 4, 5]
5. reduce() 数组元素计算为一个值(从左到右)
累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
var arr = [1,2,3,4,5]
var sum = arr.reduce((sum,value) => {
return sum += value //1+1+2+3+4+5
},1) //初始值为1
console.log(sum); //16
console.log(arr); //[1, 2, 3, 4, 5]
6. reduceRight() 数组元素计算为一个值(从右到左)
和reduce一样,不过从右向左加
7. values()
var arr = [1,2,3,4,5]
console.log(arr.values()); //Array Iterator {}
for (obj of arr.values()){
console.log(obj); // 1 2 3 4 5
}
截取
1. copyWithin()
会修改原数组里面的内容,返回新的数组
var arr = [1,2,3,4,5]
var le = arr.copyWithin(1,2,4) //从下标2到4的位置值为[3,4],换到下标为1的位置
console.log(le); // [1, 3, 4, 4, 5]
console.log(arr); // [1, 3, 4, 4, 5]
2. fill() 填充并截取
var arr = [1,2,3,4,5]
arr.fill(5) //[5, 5, 5, 5, 5]
arr.fill(5,1,3) // [1, 5, 5, 4, 5] 从截取下标1到3(不包括)的位置,并把5填充进去
console.log(arr);
3. slice() 截取
截取的位置返回新数组,原始数组还是不变
var arr = [1,2,3,4,5,6,7,8,9]
console.log(arr.slice(1,3)); //从下标为1到3(不包括)截取返回新数组 [2, 3]
console.log(arr); // [1, 2, 3, 4, 5, 6, 7, 8, 9]
合并
1. concat()
参数可以是数组,也可以是数字、字符。返回一个新的数组,不会改变原来的数组。
var arr = [1,2,3,4,5]
var arr1 = [1,2,3,4,5,6]
var le = arr.concat(arr1) //将arr1追加到arr后面
console.log(arr); //[1, 2, 3, 4, 5]
console.log(le); // [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 6]
2. join() 拼接数组
把数组中的所有元素转换一个字符串,元素是通过指定的分隔符进行分隔的。原始数组不变
var arr = [1,2,3,4,5]
console.log(arr.join("or")); // 数组中的用or拼接 1or2or3or4or5
console.log(arr); // [1, 2, 3, 4, 5]
排序
1. reverse()反转
反转原来的数组中的列表,原数组内容也会反转
var arr = [1,2,3,4,5]
console.log(arr.reverse()) //[5, 4, 3, 2, 1]
console.log(arr); //[5, 4, 3, 2, 1]
2. sort() 排序
排序顺序可以是字母或数字,并按升序或降序。默认排序顺序为按字母升序。会改变原始数组!
var arr = [5,1,8,2,6,6,0]
console.log(arr.sort()) //[0, 1, 2, 5, 6, 6, 8]
console.log(arr); //[0, 1, 2, 5, 6, 6, 8]
自定义升序
var arr = [5,1,8,2,6,6,0]
console.log(arr); //[5, 1, 8, 2, 6, 6, 0]
arr.sort((x,y) =>{
return x-y
})
console.log(arr); //[0, 1, 2, 5, 6, 6, 8]
过滤
1. filter()
创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素,返回一个新数组,元素中里内容不变
var arr = [1,2,3,4,5]
var newArr = arr.filter(function(index,value){
return value >= 3
})
console.log(newArr); //[4,5]
map()和forEach()区别?
forEach将计算出的结果遍历出来,而map是生成一个新数组。forEach不能用变量接收,map可以
var arr = [1,2,3,4,5]
-------forEach
arr.forEach((value) => {
console.log( value*value); //1 4 9 16 25
})
-------map
var sum = arr.map((value) => {
return value*value; //[1, 4, 9, 16, 25]
})
console.log(sum); //[1, 4, 9, 16, 25]
ES6 为 Array 增加了一些静态函数和原型
Array.of()
用于将一组值,转换为数组,原数组不变。参数数字个数不少于2个时,才会返回由参数组成的新数组
var arr = "hello world"
var sum = Array.of(arr)
console.log(sum); //['hello world']
console.log(arr); //hello world
Array.from()
对象形式的转为数组键必须是'0','1'这种形式,提供map功能
var obj = {
'0' : 'zs',
'1': 20,
length:2
}
var sum = Array.from(obj)
var arr = [1,2,3,4,5]
var sum1 = Array.from(arr)
console.log(sum); // ['zs', 20]
console.log(sum1); // [1, 2, 3, 4, 5]
...扩展运算符
var arr = [1,2,3,4,5]
console.log(...arr); //1 2 3 4 5
var res = []
res.push(...arr)
console.log(res); //[1, 2, 3, 4, 5]
ES6 明确将空位转为undefined。