一、常用的数组方法
- concat() 连接两个或更多的数组 返回新数组 不改变原数组
var a = [1,2,3]
var b = [4,5]
var c = a.concat(b)
console.log(a) // [1,2,3]
console.log(b) // [4,5]
console.log(c) // [1,2,3,4,5] - join() 把数组的所有元素放入一个字符串 元素通过指定的分隔符进行分隔 不改变原数组
//不传参数默认是, 传参 把数组中每一个元素toString()然后拼接
var a = [1,2,3]
var b = a.join('*')
console.log(a) // [1,2,3]
console.log(b) // 1*2*3- pop() 删除并返回数组的最后一个元素 改变原数组
var a = [1,2,3]
var b = a.pop()
console.log(a) // [1,2]
console.log(b) // 3- push() 向数组的末尾添加一个或更多元素 返回新的长度 改变原数组
var a = [1,2,3]
var b = a.push(4)
console.log(a) // [1,2,3,4]
console.log(b) // 4- shift() 删除并返回数组的第一个元素 改变原数组
var a = [1,2,3]
var b = a.shift()
console.log(a) // [2,3]
console.log(b) // 1- unshift() 向数组的开头添加一个或更多元素 返回新的长度 改变原数组
var a = [2,3]
var b = a.unshift(1)
console.log(a) // [1,2,3]
console.log(b) // 3- reverse() 颠倒数组中元素的顺序 返回颠倒后的数组 会改变原数组
var a = [1,2,3]
var b=a.reverse()
console.log(a) // [3,2,1]
console.log(b) // [3,2,1]
- sort() 对数组的元素进行排序 （按ASCII码） 返回排序后的数组 改变原数组
var a = ['a','b','d','c']
var b=a.sort()
console.log(a) // ['a','b','c','d']
console.log(b) // ['a','b','c','d']- slice() 从某个已有的数组返回选定的元素 返回新数组 不改变原数组
//slice(start,end) 返回[start,end)之间的元素组成的数组
var a = [1,2,3]
var b = a.slice(0,1)
var c = a.slice() // 不填参数默认剪切整个数组
console.log(a) // [1,2,3]
console.log(b) // [1]
console.log(c) // [1,2,3]
console.log(a===c) // false
// 负数表示从后往前数
var d = a.slice(-1,-2)
console.log(d) // [] 从左向右截取，所以为[]
var e = a.slice(-1)
console.log(e) // [3]- splice() 对数组进行删除修改 返回被删除的元素组成的数组 改变原数组
//splice(index,length,n1,n2....,nn) 表示从index开始删除length个元素，并从index开始新增元素n1~nn，放回被删除的元素组成的数组
var a = [1,2,3]
var b = a.splice(1,2,2,[3,4],5)
console.log(a) // [1,2,[3,4],5]
console.log(b) // [2,3]- toString() 把数组转换为字符串，并返回结果
var a=[1,2,3]
var b=a.toString()
console.log(b) //1,2,3- toLocaleString() 把数组转换为本地字符串 并返回结果
var a=[1,2,3]
var b=a.toLocaleString()
console.log(b) //1,2,3- valueOf() 返回数组对象的原始值
var a=[1,2,3]
var b=arr.valueOf()
console.log(b) //[1, 2, 3]二、ES5新增的数组方法
- indexOf() 查找某元素在数组中的位置 存在则返回第一个位置的下标 否则返回-1
var a = [1,2,3]
var b = a.indexOf(1)
var c = a.indexOf(3,3) //第二个参数表示从哪个位置开始查找某元素
console.log(b) // 0
console.log(c) // -1- lastIndexOf 和indexOf()相似 区别在于从尾部向首部查询 不改变原数组
var a = [1,2,3]
var b = a.lastIndexOf(1)
console.log(b) // 2
注：若不使用下标，则一般通过includes()方法代替indexOf()
- filter() 返回数组中满足条件的元素组成的新数组 原数组不变 filter()的参数是一个方法
var a = [1,2,3]
//第一个参数为一个函数 有三个参数 current:当前值 index:当前值下标 array:这个数组对象
var b = a.filter(function(current,index,array){
return current < 2
})
console.log(a) // [1,2,3]
console.log(b) // [1]- forEach() 遍历数组 为每个元素调用指定函数
var a = [1,2,3]
var b = a.forEach(function(el,index,arr){
console.log(el,index,arr)
})
/*1 0 (3) [1, 2, 3]
2 1 (3) [1, 2, 3]
3 2 (3) [1, 2, 3]
*/- map() 调用的数组的每一个元素传递给指定的函数 返回一个新数组 不改变原数组
var a = [1,2,3];
var b = a.map(function(el){
return el*el;
});
console.log(b); // [1,4,9]- every() 判断数组中每一项都是否满足条件 只有所有项都满足条件 才会返回true
var a = [1,2,3];
var b = a.every(function(x){
return x>1;
});
console.log(b); // false- some() 判断数组中是否存在满足条件的项 只要有一项满足条件 就会返回true
var a = [1,2,3];
var b = a.some(function(x){
return x>1;
});
console.log(b); // true- reduce() 两个参数：函数和递归的初始值 从数组的第一项开始 逐个遍历到最后
//函数接收四个参数值：前一个值 当前值 索引 数组对象
var a=[1,2,3];
var b=a.reduce(function(a,b){
return a+b;
})
console.log(b)//7- reduceRight() 与reduce()使用一样 从数组的最后一项开始 向前遍历到第一项
三、ES6新增的数组方法
（一）数组创建
- Array.of()：将参数中所有值作为元素形成数组
var re=Array.of(10) //1个元素 取出来是10
var rem=Array(10) //10个空元素 取出来是undefined
console.log(re,rem)
/* [10] (10)
0: 10 [empty × 10]
length: 1 length: 10
*/
var re=Array.of(10,20,30) //工厂创建
console.log(re) //[10, 20, 30]- Array.from()：将类数组对象或可迭代对象转化为数组
// 参数为数组,返回与原数组一样的数组但不相等
console.log(Array.from([1, 2])); // [1, 2]
// 参数含空位
console.log(Array.from([1, , 3])); // [1, undefined, 3]
var arr=Array.from([1,2,3],function(el){
return el*2
})
console.log(arr) // [2,4,6]- 类数组对象:必须含有 length 属性，且元素属性名必须是数值或者可转换为数值的字符
var arr = Array.from({
0: ''hello,
1: 'world',
2: 2022,
length: 3
});
console.log(arr); // ['hello', 'world', 2022]
// 没有 length 属性,则返回空数组
var arr = Array.from({
0: ''hello,
1: 'world',
2: 2022,
});
console.log(arr); // []
// 元素属性名不为数值且无法转换为数值，返回长度为 length 元素值为 undefined 的数组
var arr = Array.from({
a: 1,
b: 2,
length: 2
});
console.log(arr); // [undefined, undefined]（二）转换可迭代对象
- 转换map
var map = new Map();
map.set('key0', 'value0');
map.set('key1', 'value1');
console.log(Array.from(map)); // [['key0', 'value0'],['key1','value1']]- 转换set
var arr = [1, 2, 3];
var set = new Set(arr);
console.log(Array.from(set)); // [1, 2, 3]-
转换字符串
var str = 'abc';
console.log(Array.from(str)); // ["a", "b", "c"]二、扩展的方法
- find()：查找数组中符合条件的元素,若有多个符合条件的元素，则返回第一个元素
var arr=[10,20,30]
var re= arr.find(function(el){
if(el>20){
return true
}
})
console.log(re) //30注：数组空位处理为 undefined
- findIndex()：查找数组中符合条件的元素索引，有多个符合条件的元素时返回第一个元素索引
var arr=[10,20,30]
var re= arr.findIndex(function(el){
if(el>20){
return true
}
})
console.log(re) //2- includes()：包含，数组是否包含指定值
var arr=[1,2,3,4,5]
var re=arr.includes(4)
console.log(re) //返回布尔值 true-
fill()：填充，将一定范围索引的数组元素内容填充为单个指定的值
//改变原数组 无参数范围时全部填充
var arr=[1,2,3,4]
var re=arr.fill("hello")
console.log(re,arr)
//打印 0: "hello" 1: "hello" 2: "hello" 3: "hello" var arr=[{name:"hha",age:21},{name:"heie",age:28},{name:"xixi",age:14},{name:"oo",age:10}]
arr.map(function(el){
if(el.age>=18){
el.drink=true
}
})
console.log(arr)- flat(): 降维 嵌套数组转一维数组
var arr=[[10,20],30,40,[50,60,[70,[100,200],80],90]]
var arr2=arr.flat(2)
console.log(arr2)
/*
0: 10
1: 20
2: 30
3: 40
4: 50
5: 60
6: 70
7: (2) [100, 200]
8: 80
9: 90
*/案例：自己设计实现flat函数：(默认完全降维 count为降级级别)
Array.prototype.myflat=function(count=Infinity){
var arr=[]
for(i=0;i<this.length;i++){
if(this[i].constructor==Array&&count>0){
var newarr=this[i].myflat(count-1)
for(j=0;j<newarr.length;j++){
arr.push(newarr[j])
}
}else{
arr.push(this[i])
}
}
return arr
}
var re2=arr.myflat(2)
console.log(re2)
/*
0: 10
1: 20
2: 50
3: 60
4: 70
5: (2) [100, 200]
6: 80
*/遍历:
- entrys()：遍历键值对
for(let [key, value] of ['a', 'b'].entries()){
console.log(key, value);
}
// 0 "a"
// 1 "b"
// 不使用 for... of 循环
let entries = ['a', 'b'].entries();
console.log(entries.next().value); // [0, "a"]
console.log(entries.next().value); // [1, "b"]
// 数组含空位
console.log([...[,'a'].entries()]); // [[0, undefined], [1, "a"]]- keys()：遍历键名
for(let key of ['a', 'b'].keys()){
console.log(key);
}
// 0 1
// 数组含空位
console.log([...[,'a'].keys()]); // [0, 1]-
values()：遍历键值
for(let value of ['a', 'b'].values()){
console.log(value);
}
// "a" "b"
// 数组含空位
console.log([...[,'a'].values()]); // [undefined, "a"]案例：
arr=[10,20,30]
var re=arr.keys()
for(let i of re){
console.log(i) //打印 0 1 2
}
console.log(re) //Array Iterator {}
var ree=arr.values()
for(let i of ree){
console.log(i) //打印 10 20 30
}三、扩展运算符（...）
-
复制数组：
var arr = [1, 2],
arr1 = [...arr];
console.log(arr1); // [1, 2]
// 数组含空位
var arr2 = [1, , 3],
arr3 = [...arr2];
console.log(arr3); [1, undefined, 3]-
合并数组：
var arr = [10, 20, 30]
var arr1=[1,2,3]
var arr2 = [...arr,...arr1]
console.log(arr, arr2)总结：
原数组改变的方法：push pop shift unshift reverse sort splice
不改变原数组的方法：concat map filter join every some indexOf slice forEach
984
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
