1.find 找到第一个满足条件的数组成员,返回该成员(ES6)
2.findIndex 找到第一个满足条件的数据成员的当前位置(ES6)
3.includes 判断数组中是否包含给定的值,第二个参数表示搜索的起始位置,默认为0,可以为负数,为负数时表示倒数的位置
4.forEach和map (ES5)
array.forEach(callback(currentValue, index, array){
//do something
})
array.map(callback(currentValue, index, array){
//do something
})
区别:
- forEach没有返回值,不改变原数组
- map有返回值, 可返回一个新的数组, 不改变原数组
- forEach、map使用return或break无法退出循环,除非使用抛异常的办法
5.filter 过滤功能,数组中的每一项运行给定函数,返回满足过滤条件组成的数组,不改变原数组(ES5)
6.every 判断数组中是否每个元素都满足条件,只有都满足条件才返回true, 可以使用return false中断循环(ES5)
7.some判断数组中是否有一个元素满足条件,只要有一个就返回true,可以使用return true中断循环(ES5)
8.indexOf()用于从左至右查找数组内指定的元素位置,查找后返回其索引,未找到则返回-1,该方法对大小写敏感(ES5),lastIndexOf与indexOf类似,区别是lastIndexOf是从数组的末尾开始查找。默认的fromIndex是array.length - 1不是0
let students = ['Mike', 'Wu', 'Lisa', 'Sir'];
console.log(students.indexOf('Mike')); // 0
console.log(students.indexOf('Mary')); // -1
console.log(students.indexOf('lisa')) // -1
9.reduce(callback,initialValue)用于遍历数组,将数组内的值拼合成一个值返回结果,返回值为计算结果(ES5)
initialValue为设定的初始值,可选可不选, callback可接收四个参数(prev, currentValue, currentIndex, arr) prev为初始值或之前计算的结果,若initialValue传值则prev为initialValue,currentValue为数组中索引值为0的数, 若不传初始值则prev为数组中索引值为0的数, currentValue为数组中索引值为1的值 currentIndex为当前数据的index arr为当前数组
let arr = [1, 3, 4, 6];
let sum = arr.reduce(function(v1, v2) {
return v1 + v2
});
console.log(sum); // 14
let sum2 = arr.reduce(function(v1, v2) {
return v1 + v2
}, 100);
console.log(sum2); // 114
let sub = arr.reduce(function(v1, v2) {
return v1 - v2
});
console.log(sub); // -12
let sub2 = arr.reduce(function(v1, v2) {
return v1 - v2
}, 100);
console.log(sub2);// 86
let sub3 = arr.reduce(function(v1, v2) {
return v2 - v1
});
console.log(sub3);// 4
reduce高级用法
一、计算数组中每个元素出现的次数
let names = ['hello', 'string', 'we', 'world', 'hello', 'see', 'string'];
let nameNum = names.reduce(function(prev, currentValue) {
if (currentValue in prev) {
prev[currentValue]++
} else {
prev[currentValue] = 1
}
return prev
}, {});
console.log(nameNum)
// {hello: 2, string: 2, we: 1, world: 1, see: 1}
二、数组去重
let singleName = names.reduce(function(prev, currentValue) {
if(!prev.includes(currentValue)) {
prev.push(currentValue)
}
return prev
}, []);
console.log(singleName) // ["hello", "string", "we", "world", "see"]
三、将多维数组转化为一维数组
let arr = [[0, 1], [2, 3], [4,[5,6,7]]]
const newArr = function(arr){
return arr.reduce((pre,cur)=>pre.concat(Array.isArray(cur)?newArr(cur):cur),[])
}
console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]
四、将二维数组转化为一维数组
let arr = [[0, 1], [2, 3], [4, 5]]
let newArr = arr.reduce((pre,cur)=>{
return pre.concat(cur)
},[])
console.log(newArr); // [0, 1, 2, 3, 4, 5]
五、对象里的属性求和
var result = [
{
subject: 'math',
score: 10
},
{
subject: 'chinese',
score: 20
},
{
subject: 'english',
score: 30
}
];
var sum = result.reduce(function(prev, cur) {
return cur.score + prev;
}, 0);
console.log(sum) //60
10.reverse()反转数组项的顺序,会改变原数组,并返回一个新的数组
11.push,pop从后面新增删除元素
push 可以接收任意参数,数组末尾添加项,返回修改后的数组长度,改变原数组,不创建新的数组 pop 删除最后一个元素,并返回最后一个元素,改变原数组
12.shift,unshift从前面新增删除元素
shift 删除原数组第一项,并返回删除元素的值,如果数组为空则返回undefined 。 unshift 将参数添加到原数组开头,并返回数组的长度 。
13.slice 截取数组,不改变原数组,返回截取的子数组,
- 第一个必选参数为起始位置的下标,如果传入的下标为负数,比如-1则从最后一个元素开始截取,
- 第二个可选参数为结束位置,但是截取的不包含结束位置的元素,如果不传第二个参数,则为起始到数组结束的所有元素
14.splice 改变原数组,返回一个包含从原数组中删除项的数组,如果没有删除项,就返回空数组,arr.splice(index,howmany,item1,.....,itemX)
- 第一个参数 起始位置, 必选
- 第二个参数 删除的元素个数,为0则不删除,必选
- item1,.....,itemX 插入的元素,可选
15.concat连接两个或多个数组,返回一个新数组
var arr1 = [1, 3, 5, 8]
var arr2 = [7, 9, 90, 8]
console.log(arr1.concat(arr2)) // [1, 3, 5, 8, 7, 9, 90, 8]
16.str.split() 将字符串转化为数组
let str = '123456'
console.log(str.split('')) // ["1", "2", "3", "4", "5", "6"]
17.判断js对象是不是数组
arr instanceof Array // true
arr.constructor == Array // true
Array.isArray(arr) // true
Object.prototype.toString.call(arr) //[object Array]
duck type
18.sort对数组进行排序, a, b只有在a大于b的时候,a和b的位置进行更换
// 升序
function sortBy(a, b) {
return a - b
}
// 降序
function sortDown(a, b) {
return b - a
}
var arr = [23, 24, 10, 50,32]
var arr1 = [23, 24, 10, 50,32]
arr.sort(sortBy)
console.log(arr) // [10, 23, 24, 32, 50]
arr1.sort(sortDown)console.log(arr1) // [50, 32, 24, 23, 10]
19.数组的拷贝
var arr = [1, 2, 3, 4]
var arr1 = arr // 引用赋值,数组之间会相互影响
arr[2] = 1
console.log(arr1) // [1, 2, 1, 4]
concat(es5),为shallow copy
var arr = [1, 2, 3, 4]
var arr2 = arr.concat([])
arr[2] = 5
console.log(arr2) // [1, 2, 3, 4]
var arr = [{name: 'zhang'}, {name: 'wang'}, {name: 'wu'}]
arr6 = arr.concat([])
arr[1].name = 'li'
console.log(arr6) // (3) [{name: "zhang"}, {name: "li"}, {name: "wu"}]
slice(ES5 shallow copy)
var arr = [1, 2, 3, 4]
var arr3 = arr.slice(0)
arr[1] = 5
console.log(arr3) // [1, 2, 3, 4]
var arr = [{name: 'zhang'}, {name: 'wang'}, {name: 'wu'}]
arr6 = arr.slice(0)
arr[1].name = 'li'
console.log(arr6) // (3) [{name: "zhang"}, {name: "li"}, {name: "wu"}]
...扩展运算符(ES6 shallow copy)
var arr = [1, 2, 3, 4]
var arr4 = [...arr]
arr[1] = 2
console.log(arr4) // [1, 2, 3, 4]
var arr = [{name: 'zhang'}, {name: 'wang'}, {name: 'wu'}]
arr6 = [...arr]
arr[1].name = 'li'
console.log(arr6) // (3) [{name: "zhang"}, {name: "li"}, {name: "wu"}]