ES5新增的方法
forEach
const arr = [10, 8, 18, 6, 12]
arr.forEach(function(item, index, array) {
console.log(index, item)
})
map
const arr = [10, 8, 18, 6, 12]
const arr1 = arr.map(function(item, index, array) {
return item - 1
})
console.log(arr1) // [ 9, 7, 17, 5, 11 ]
filter
const arr = [10, 8, 18, 6, 12]
const arr2 = arr.filter(function(item, index, array) {
return item > 10
})
console.log(arr2) // [ 18, 12 ]
some
const arr = [10, 8, 18, 6, 12]
const res1 = arr.some(function(item, index, array) {
return item > 20
})
console.log(res1) // false
every
const arr = [10, 8, 18, 6, 12]
const res2 = arr.every(function(item, index, array) {
return item % 2 === 0
})
console.log(res2) // true
reduce
一开始,prev代表数组第一个元素,next指向数组第二个元素;
函数有个返回值,会作为下次的prev值;
const arr = [10, 8, 18, 6, 12]
const res3 = arr.reduce(function(prev, next) {
console.log(prev, next)
return prev + next
})
console.log(res3)
/** 打印结果
10 8
18 18
36 6
42 12
54
*/
slice
定义:方法返回一个从开始到结束(不包括结束)选择的数组的一部分浅拷贝到一个新数组对象,且原数组不会被修改。 语法
array.slice(begin, end);
- begin(可选): 索引数值,接受负值,从该索引处开始提取原数组中的元素,默认值为0。
- end(可选):索引数值(不包括),接受负值,在该索引处前结束提取原数组元素,默认值为数组末尾(包括最后一个元素)。
slice方法是浅拷贝
例子:
const arr = [10, 8, 18, 6, 12]
const arr1 = arr.slice() // [ 10, 8, 18, 6, 12 ]
const arr2 = arr.slice(1) // [ 8, 18, 6, 12 ]
const arr3 = arr.slice(1, 4) // [ 8, 18, 6 ]
const arr4 = arr.slice(-2) // [ 6, 12 ]
join
定义:把数组中的所有元素通过指定的分隔符进行分隔放入一个字符串,返回生成的字符串。 语法
array.join(splitStr);
- splitStr(可选): 指定要使用的分隔符,默认使用逗号作为分隔符。
const arr = [10, 8, 18, 6, 12]
const res1 = arr.join() // 10,8,18,6,12
const res2 = arr.join(';') // 10;8;18;6;12
const arr2 = [{name: 'zs', age: 20}, {name: 'ls', age: 22}]
const res3 = arr2.join() // [object Object],[object Object]
concat
定义:方法用于合并两个或多个数组,返回一个新数组。 语法:
let newArr = oldArray.concat(arrayX, arrayX, ......, arrayX)
const arr = [10, 8, 18, 6, 12]
const arr2 = [100, 200, 300]
const res = arr.concat(arr2) // [10, 8, 18, 6, 12, 100, 200, 300]
也可以用ES6的开展运算符(...)
const res3 = [...arr, ...arr2] // [10, 8, 18, 6, 12, 100, 200, 300]
indexOf
定义: 返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。 语法:
array.indexOf(searchElement, fromIndex)
- searchElement(必须):被查找的元素
- fromIndex(可选):开始查找的位置(不能大于等于数组的长度,返回-1),接受负值,默认值为0。
const arr = [10, 8, 18, 6, 12, NaN]
const res1 = arr.indexOf(8) // 1
const res2 = arr.indexOf(8, 2) // -1
const res3 = arr.indexOf(NaN) // -1 不能识别`NaN`
indexOf()不能识别
NaN
lastIndexOf
定义: 方法返回指定元素,在数组中的最后一个的索引,如果不存在则返回 -1。(从数组后面往前查找)
splice
定义:向/从数组中添加/删除项目,然后返回被删除的项目
const newArr = array.splice(index,howmany,item1,.....,itemX)
- index:必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。
- howmany:可选。要删除的项目数量。如果设置为 0,则不会删除项目。
- item1, ..., itemX: 可选。向数组添加的新项目。 删除元素
const arr = [10, 8, 18, 6, 12]
const res1 = arr.splice(0, 2) // //[ 10, 8 ]
console.log(arr) // [ 18, 6, 12 ]
删除并新增
const arr = [10, 8, 18, 6, 12]
const res2 = arr.splice(0, 2, 2, 22)
console.log(arr) // [ 2, 22, 18, 6, 12 ]
pop
定义:删除一个数组中的最后的一个元素,并且返回这个元素
const arr = [10, 8, 18, 6, 12]
const res = arr.pop() // 12
console.log(arr) // [ 10, 8, 18, 6 ]
push
定义:向数组的末尾添加一个或多个元素,并返回新的长度。
const arr = [10, 8, 18, 6, 12]
const res = arr.push(20) // 6
console.log(arr) // [ 10, 8, 18, 6, 12, 20 ]
shift
定义:删除数组的第一个元素,并返回这个元素。
const arr = [10, 8, 18, 6, 12]
const res = arr.shift(20) // 10
console.log(arr) // [ 8, 18, 6, 12 ]
unshift
定义:向数组的开头添加一个或更多元素,并返回新的长度。
const arr = [10, 8, 18, 7, 12]
const res = arr.unshift(20) // 6
console.log(arr) // [ 20, 10, 8, 18, 7, 12 ]
reverse
定义:反转数组中元素的顺序
const arr = [10, 8, 18, 7, 12]
const res = arr.reverse() // [ 12, 7, 18, 8, 10 ]
console.log(arr) // [ 12, 7, 18, 8, 10 ]
sort
定义:数组元素进行排序,并返回这个数组
const arr = [10, 8, 18, 7, 12]
const res = arr.sort() // [ 10, 12, 18, 7, 8 ]注意!
const res1 = arr.sort((item1, item2) => {
return item1 - item2
}) // [ 7, 8, 10, 12, 18 ]
默认情况下sort()方法没有传比较函数的话,默认按字母升序
Array.isArray()
定义: 用于判断一个对象是否为数组, 返回true或false 语法:
const res = Array.isArray(arr)
ES6新增的方法
fill
定义:用给定值,填充一个数组
语法:
const newArr = arr.fill(value, start, end)
- value: 要填充的值
- start: 可选,填充的开始位置,默认值为0
- end: 可选,填充的结束位置,默认是为
this.length
const arr = ['a', 'b', 'c']
const res = arr.fill('A') // [ 'A', 'A', 'A' ]
find
定义:用于找出第一个符合条件的数组成员,并返回该成员,如果没有符合条件的成员,则返回undefined
const arr = [ { id: 1, name: '刘备' }, { id: 2, name: '关羽' }, { id: 3, name: '张飞' } ]
const res = arr.find((item, index, arr) => {
return item.id === 2
}) // { id: 2, name: '关羽' }
console.log(res)
该方法识别
NaN,弥补了indexOf的不足.
findIndex
定义:返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1
Array.of()
定义:返回由所有参数值组成的数组,如果没有参数,就返回一个空数组。
let a = Array.of(3, 11, 8); // [3,11,8]
let a = Array.of(3); // [3]
Arrary.from()
定义: 将两类对象转为真正的数组(不改变原对象,返回新的数组)
// 1. 对象
let obj = {0: 'a', 1: 'b', 2:'c', length: 3};
let arr = Array.from(obj); // ['a','b','c'];
// 2. 部署了 Iterator接口的数据结构 比如:字符串、Set、NodeList对象
let arr = Array.from('hello'); // ['h','e','l','l','o']
let arr = Array.from(new Set(['a','b'])); // ['a','b']
ES7 新增的方法
includes
定义: 返回一个布尔值,表示某个数组是否包含给定的值 语法:
array.includes(searchElement, fromIndex=0)
能识别
NaN