JavaScript Array(数组)方法总结
数组的作用:
使用单独的变量名来存储一系列的值,用于在单一变量中存储多个值
数组的创建:
1. 通过Array构造函数
var arr = new Array() //创建一个空数组
var arr = new Array(9) //创建一个长度为9的数组
var arr = new Array('a', 'b', 'c') //创建一个包含三个字符串的数组
2. 通过字面量表达式
var arr = [] //创建一个空数组
var arr = ['a', 'b', 'c'] //创建一个包含三个字符串的数组
数组方法:
Array.isArray() 方法用于判断一个对象是否为数组
参数: Array.isArray(obj)
-
obj: 必需,要判断的对象
返回值: 如果对象是数组返回 true,否则返回 false
var arr = [1, 2, 3]
var b = Array.isArray(arr)
console.log(b) //true
var str = '123'
var b = Array.isArray(str)
console.log(b) //false
Array.of() 方法创建一个具有可变数量参数的新数组实例,而不考虑参数的数量或类型
参数: Array.of(item1, item2, …, itemX)
-
item1, item2, …, itemX: 必需,任意个参数,将按顺序成为返回数组中的元素
返回值: 返回一个新的数组
var arr = Array.of(1, 2, 3)
console.log(arr) //[1, 2, 3]
concat() 方法用于连接两个或多个数组,该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本
参数: array1.concat(array2, array3…, arrayX)
-
array2, array3…, arrayX: 必需,该参数可以是具体的值,也可以是数组对象,可以是任意多个
返回值: 返回一个新的数组。该数组是通过把所有 arrayX 参数添加到arrayObject 中生成的。如果要进行 concat() 操作的参数是数组,那么添加的是数组中的元素,而不是数组
var arr1 = [1, 2]
var arr2 = [3, 4]
var arr3 = arr1.concat(arr2)
console.log(arr3) //[1, 2, 3, 4]
console.log(arr1) //[1, 2](原数组不变)
console.log(arr2) //[3, 4](原数组不变)
join() 方法用于把数组中的所有元素放入一个字符串,元素是通过指定的分隔符进行分隔的
参数: array.join(separator)
-
separator: 可选,指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符
返回值: 返回一个字符串。该字符串是通过把 arrayObject 的每个元素转换为字符串,然后把这些字符串连接起来,在两个元素之间插入 separator 字符串而生成的
var arr = [1, 2, 3]
var str = arr.join('')
console.log(str) //'123'
console.log(arr) //[1, 2, 3](原数组不变)
var arr = [1, 2, 3]
var str = arr.join('-')
console.log(str) //'1-2-3'
console.log(arr) //[1, 2, 3](原数组不变)
pop() 方法用于删除数组的最后一个元素
返回值: 返回删除的元素
var arr = [1, 2, 3]
var a = arr.pop()
console.log(a) //3
console.log(arr) //[1, 2](原数组改变)
push() 方法可向数组的末尾添加一个或多个元素
参数: array.push(item1, item2, …, itemX)
-
item1, item2, …, itemX: 必需,要添加到数组的元素
返回值: 返回新数组的长度
var arr = [1, 2, 3]
var n = arr.push(4)
console.log(n) //4
console.log(arr) //[1, 2, 3, 4](原数组改变)
var arr = [1, 2, 3]
var n = arr.push(4, 5)
console.log(n) //5
console.log(arr) //[1, 2, 3, 4, 5](原数组改变)
shift() 方法用于把数组的第一个元素从其中删除
返回值: 返回第一个元素的值
var arr = [1, 2, 3]
var a = arr.shift()
console.log(a) //1
console.log(arr) //[2, 3](原数组改变)
unshift() 方法可向数组的开头添加一个或更多元素
参数: array.unshift(item1, item2, …, itemX)
-
item1, item2, …, itemX: 必需,向数组起始位置添加一个或者多个元素
返回值: 返回新数组的长度
var arr = [1, 2, 3]
var n = arr.unshift(4)
console.log(n) //4
console.log(arr) //[4, 1, 2, 3](原数组改变)
var arr = [1, 2, 3]
var n = arr.unshift(4, 5)
console.log(n) //4
console.log(arr) //[4, 5, 1, 2, 3](原数组改变)
reverse() 方法用于颠倒数组中元素的顺序
返回值: 返回颠倒顺序后的数组
var arr1 = [1, 2, 3]
var arr2 = arr1.reverse()
console.log(arr2) //[3, 2, 1]
console.log(arr1) //[3, 2, 1](原数组改变)
slice() 方法可从已有的数组中返回选定的元素
参数: array.slice(start, end)
-
start: 必需,规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推 -
end: 可选,规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素
返回值: 返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素
var arr1 = [1, 2, 3]
var arr2 = arr1.slice(1)
console.log(arr2) //[2, 3]
console.log(arr1) //[1, 2, 3](原数组不变)
var arr1 = [1, 2, 3]
var arr2 = arr1.slice(1, 2)
console.log(arr2) //[2]
console.log(arr1) //[1, 2, 3](原数组不变)
sort() 方法用于对数组的元素进行排序
参数: array.sort(sortby)
-
sortby: 可选,规定排序顺序。必须是函数
返回值: 对数组的引用。请注意,数组在原数组上进行排序,不生成副本
var arr1 = [1, 3, 2]
var arr2 = arr1.sort()
console.log(arr2) //[1, 2, 3]
console.log(arr1) //[1, 2, 3](原数组改变)
var arr1 = [1, 3, 2]
var arr2 = arr1.sort((a, b) => {return a-b}) //升序
console.log(arr2) //[1, 2, 3]
console.log(arr1) //[1, 2, 3](原数组改变)
var arr1 = [1, 3, 2]
var arr2 = arr1.sort((a, b) => {return b-a}) //降序
console.log(arr2) //[3, 2, 1]
console.log(arr1) //[3, 2, 1](原数组改变)
splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目
参数: array.splice(index, howmany, item1, …, itemX)
-
index: 必需,整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置 -
howmany: 必需,要删除的项目数量。如果设置为 0,则不会删除项目 -
item1, …, itemX: 可选,向数组添加的新项目
返回值: 如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组
var arr1 = [1, 2, 3]
var arr2 = arr1.splice(1, 2)
console.log(arr2) //[2, 3]
console.log(arr1) //[1](原数组改变)
var arr1 = [1, 2, 3]
var arr2 = arr1.splice(1, 2, 4, 5)
console.log(arr2) //[2, 3]
console.log(arr1) //[1, 4, 5](原数组改变)
toString() 方法可把数组转换为字符串
返回值: 返回字符串,数组的所有值用逗号隔开
var arr = [1, 2, 3]
var str = arr.toString()
console.log(str) //1,2,3
console.log(arr) //[1, 2, 3](原数组不变)
indexOf() 方法可返回一个指定的元素在数组中第一次出现的位置,从该数组的前面向后查找,如果在数组中没找到指定元素则返回 -1
参数: array.indexOf(item, start)
-
item: 必需,查找的元素 -
start: 可选,整数参数。规定在数组中开始查找的位置。它的合法取值是 0 到 array.length – 1。如省略该参数,则将从数组的首个值开始查找
返回值: 返回元素在数组中第一次出现的位置,如果没有查找到则返回 -1
var arr = [1, 2, 2, 3]
var n = arr.indexOf(2)
console.log(n) //1
console.log(arr) //[1, 2, 2, 3](原数组不变)
var arr = [1, 2, 2, 3]
var n = arr.indexOf(1, 2)
console.log(n) //-1
console.log(arr) //[1, 2, 2, 3](原数组不变)
lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置,从该数组的后面向前查找,如果在数组中没找到指定元素则返回 -1
参数: array.lastIndexOff(item, start)
-
item: 必需,查找的元素 -
start: 可选,整数参数,规定在数组中开始查找的位置。它的合法取值是 0 到 array.length – 1。如省略该参数,则将从数组的最后一个值开始查找
返回值: 返回元素在数组中最后出现的位置,如果没有查找到则返回 -1
var arr = [1, 2, 2, 3]
var n = arr.lastIndexOf(2)
console.log(n) //2
console.log(arr) //[1, 2, 2, 3](原数组不变)
var arr = [1, 2, 2, 3]
var n = arr.lastIndexOf(3, 2)
console.log(n) //-1
console.log(arr) //[1, 2, 2, 3](原数组不变)
includes() 方法用来判断一个数组是否包含一个指定的值
参数: array.includes(searchElement, fromIndex)
-
searchElement: 必需,需要查找的元素值 -
fromIndex: 可选,从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0
返回值: 如果找到指定值返回 true,否则返回 false
var arr = [1, 2, 3]
var b = arr.includes(2)
console.log(b) //true
console.log(arr) //[1, 2, 3](原数组不变)
var arr = [1, 2, 3]
var b = arr.includes(2, 2)
console.log(b) //false
console.log(arr) //[1, 2, 3](原数组不变)
fill() 方法用于将一个固定值替换数组的元素
参数: array.fill(value, start, end)
-
value: 必需,填充的值 -
star: 可选,开始填充位置 -
end: 可选,停止填充位置 (默认为 array.length)
返回值: 返回替换后的数组
var arr1 = [1, 2, 3]
var arr2 = arr1.fill(4)
console.log(arr2) //[4, 4, 4]
console.log(arr1) //[4, 4, 4](原数组改变)
var arr1 = [1, 2, 3]
var arr2 = arr1.fill(4, 0, 2)
console.log(arr2) //[4, 4, 3]
console.log(arr1) //[4, 4, 3](原数组改变)
copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中
参数: array.copyWithin(target, start, end)
-
target: 必需,停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数 -
star: 可选,元素复制的起始位置 -
end: 可选,停止填充位置 (默认为 array.length)
返回值: 返回拷贝后的数组
var arr1 = [1, 2, 3, 4, 5]
var arr2 = arr1.copyWithin(2)
console.log(arr2) //[1, 2, 1, 2, 3]
console.log(arr1) //[1, 2, 1, 2, 3](原数组改变)
var arr1 = [1, 2, 3, 4, 5]
var arr2 = arr1.copyWithin(2, 1)
console.log(arr2) //[1, 2, 2, 3, 4]
console.log(arr1) //[1, 2, 2, 3, 4](原数组改变)
var arr1 = [1, 2, 3, 4, 5]
var arr2 = arr1.copyWithin(2, 1, 3)
console.log(arr2) //[1, 2, 2, 3, 5]
console.log(arr1) //[1, 2, 2, 3, 5](原数组改变)
map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值
参数: array.map(function(currentValue, currentIndex, arr), thisValue)
-
function(currentValue, currentIndex, arr): 必需,数组每个元素需要执行的函数函数参数: -
currentValue:必需,当前元素 -
currentIndex:可选,当前元素的索引 -
arr:可选,当前元素所属的数组对象 -
thisValue: 可选,传递给函数的值一般用 “this” 值,如果这个参数为空, “undefined” 会传递给 “this” 值
返回值: 返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值
var arr1 = [1, 2, 3]
var arr2 = arr1.map(num => {
return num+1
})
console.log(arr2) //[2, 3, 4]
console.log(arr1) //[1, 2, 3](原数组不变)
forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数
参数: array.forEach(function(currentValue, currentIndex, arr), thisValue)
-
function(currentValue, currentIndex, arr): 必需,数组每个元素需要执行的函数函数参数: -
currentVaue:必需,当前元素 -
currentIndex:可选,当前元素的索引 -
arr:可选,当前元素所属的数组对象 -
thisValue: 可选,传递给函数的值一般用 “this” 值,如果这个参数为空, “undefined” 会传递给 “this” 值
返回值: undefined
var arr1 = [1, 2, 3]
var total = 0
var arr2 = arr1.forEach(num => {
total += num
})
console.log(total) //6
console.log(arr2) //undefined
console.log(arr1) //[1, 2, 3](原数组不变)
reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值
参数: array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
-
function(total, currentValue, index, arr): 必需,用于执行每个数组元素的函数函数参数: -
total:必需,初始值, 或者计算结束后的返回值 -
currentValue:必需,当前元素 -
currentIndex:可选,当前元素的索引 -
arr:可选,当前元素所属的数组对象 -
initialValue: 可选,传递给函数的初始值
返回值: 返回计算结果(reduce() 对于空数组是不会执行回调函数的)
var arr = [1, 2, 3]
var n = arr.reduce(function(total, num) {
return total + num
})
console.log(n) //6
console.log(arr) //[1, 2, 3](原数组不变)
var arr = [1, 2, 3]
var n = arr.reduce(function(total, num) {
return total + num
}, 2)
console.log(n) //8
console.log(arr) //[1, 2, 3](原数组不变)
常见用法:
//求数组中最大值(最小值同理)
var arr = [1, 2, 3]
var max = arr.reduce(function(max, item) {
return max > item ? max : item
})
console.log(max) //3
//数组去重
var arr1 = [1, 2, 2, 3]
var arr2 = arr1.reduce(function(arr, item) {
if(arr.indexOf(item) === -1) {
arr.push(item)
}
return arr
}, [])
console.log(arr2) //[1, 2, 3]
//统计数组中每一项重复数量
var arr = ['a', 'b', 'b', 'c', 'c', 'c']
var res = arr.reduce(function(obj, item) {
obj[item] ? obj[item]++ : obj[item] = 1
return obj
}, {})
console.log(res) //{'a': 1, 'b': 2, 'c': 3}
//数组维度转换
var arr1 = [[1, 2], [3, 4], [5, 6]]
var arr2 = arr1.reduce(function(arr, item) {
return arr.concat(item)
}, [])
console.log(arr2) //[1, 2, 3, 4, 5, 6]
reduceRight() 方法接收一个函数作为累加器,数组中的每个值(从右到左)开始缩减,最终计算为一个值
参数: array.reduceRight(function(total, currentValue, currentIndex, arr), initialValue)
-
function(total, currentValue, index, arr): 必需,用于执行每个数组元素的函数函数参数: -
total:必需,初始值, 或者计算结束后的返回值 -
currentValue:必需,当前元素 -
currentIndex:可选,当前元素的索引 -
arr:可选,当前元素所属的数组对象 -
initialValue: 可选,传递给函数的初始值
返回值: 返回计算结果(reduceRight() 对于空数组是不会执行回调函数的)
var arr = [1, 2, 3]
var n = arr.reduceRight(function(total, num) {
return total + num
}, 0)
console.log(n) //6
console.log(arr) //[1, 2, 3](原数组不变)
var arr = [1, 2, 3]
var n = arr.reduceRight(function(total, num) {
return total + num
}, 3)
console.log(n) //9
console.log(arr) //[1, 2, 3](原数组不变)
find() 方法返回通过测试(函数内判断)的数组的第一个元素的值
参数: array.find(function(currentValue, currentIndex, arr), thisValue)
-
function(currentValue, currentIndex, arr): 必需,数组每个元素需要执行的函数函数参数: -
currentValue:必需,当前元素 -
currentIndex:可选,当前元素的索引 -
arr:可选,当前元素所属的数组对象 -
thisValue: 可选,传递给函数的值一般用 “this” 值,如果这个参数为空, “undefined” 会传递给 “this” 值
返回值: 返回符合测试条件的第一个数组元素值,如果没有符合条件的则返回 undefined
var arr = [1, 2, 3]
var n = arr.find(num => {
return num>1
})
console.log(n) //2
console.log(arr) //[1, 2, 3](原数组不变)
var arr = [1, 2, 3]
var n = arr.find((num, index) => {
return num>1 && index>1
})
console.log(n) //3
console.log(arr) //[1, 2, 3](原数组不变)
findIndex() 方法返回通过测试(函数内判断)的数组的第一个元素的位置
参数: array.findIndex(function(currentValue, currentIndex, arr), thisValue)
-
function(currentValue, currentIndex, arr): 必需,数组每个元素需要执行的函数函数参数: -
currentValue:必需,当前元素 -
currentIndex:可选,当前元素的索引 -
arr:可选,当前元素所属的数组对象 -
thisValue: 可选,传递给函数的值一般用 “this” 值,如果这个参数为空, “undefined” 会传递给 “this” 值
返回值: 返回符合测试条件的第一个数组元素索引,如果没有符合条件的则返回 -1
var arr = [1, 2, 3]
var n = arr.findIndex(num => {
return num>1
})
console.log(n) //1
console.log(arr) //[1, 2, 3](原数组不变)
var arr = [1, 2, 3]
var n = arr.findIndex((num, index) => {
return num>1 && index>1
})
console.log(n) //2
console.log(arr) //[1, 2, 3](原数组不变)
every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)
参数: array.every(function(currentValue, currentIndex, arr), thisValue)
-
function(currentValue, currentIndex, arr): 必需,数组每个元素需要执行的函数函数参数: -
currentValue:必需,当前元素 -
currentIndex:可选,当前元素的索引 -
arr:可选,当前元素所属的数组对象 -
thisValue: 可选,传递给函数的值一般用 “this” 值,如果这个参数为空, “undefined” 会传递给 “this” 值
返回值: 如果所有元素都满足条件返回 true,有一个元素不满足返回 false(剩余的元素不会再进行检测)
var arr = [1, 2, 3]
var b = arr.every(num => {
return num>0
})
console.log(b) //true
console.log(arr) //[1, 2, 3](原数组不变)
var arr = [1, 2, 3]
var b = arr.every(num => {
return num>1
})
console.log(b) //false
console.log(arr) //[1, 2, 3](原数组不变)
some() 方法用于检测数组中是否有元素满足指定条件(通过函数提供)
参数: array.some(function(currentValue, currentIndex, arr), thisValue)
-
function(currentValue, currentIndex, arr): 必需,数组每个元素需要执行的函数函数参数: -
currentValue:必需,当前元素 -
currentIndex:可选,当前元素的索引 -
arr:可选,当前元素所属的数组对象 -
thisValue: 可选,传递给函数的值一般用 “this” 值,如果这个参数为空, “undefined” 会传递给 “this” 值
返回值: 如果数组中有元素满足条件返回 true(剩余的元素不会再执行检测),否则返回 false
var arr = [1, 2, 3]
var b = arr.some(num => {
return num>2
})
console.log(b) //true
console.log(arr) //[1, 2, 3](原数组不变)
var arr = [1, 2, 3]
var b = arr.some(num => {
return num>4
})
console.log(b) //false
console.log(arr) //[1, 2, 3](原数组不变)
filter() 方法返回一个新数组,新数组中的元素是通过检查指定数组中符合条件(通过函数提供)的所有元素
参数: array.filter(function(currentValue, currentIndex, arr), thisValue)
-
function(currentValue, currentIndex, arr): 必需,数组每个元素需要执行的函数函数参数: -
currentValue:必需,当前元素 -
currentIndex:可选,当前元素的索引 -
arr:可选,当前元素所属的数组对象 -
thisValue: 可选,传递给函数的值一般用 “this” 值,如果这个参数为空, “undefined” 会传递给 “this” 值
返回值: 返回数组,包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组
var arr1 = [1, 2, 3]
var arr2 = arr1.filter(num => {
return num>1
})
console.log(arr2) //[2, 3]
console.log(arr1) //[1, 2, 3](原数组不变)
var arr1 = [1, 2, 3]
var arr2 = arr1.filter((num, index) => {
return num>1 && index>1
})
console.log(arr2) //[3]
console.log(arr1) //[1, 2, 3](原数组不变)
原文始发于微信公众号(前端24):JavaScript Array(数组)方法总结
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/217219.html