JavaScript在其内部封装了一个Array对象,使得我们可以方便地使用数组这种简单的数据结构,同时,也在 Array对象的原型上定义了一些常用并且很有用的操作数组的函数。
一、引言
二、数组方法
函数 | 作用 |
---|---|
join() | 将数组中所有元素都转化为字符串连接在一起 |
sort() | 将数组中的元素排序 |
reverse() | 将数组中的元素颠倒顺序 |
concat() | 将多个数组或数连接起来,组成一个新的数组 |
slice() | 返回指定数组的一个片段或子数组 |
splice() | 在数组指定位置插入或删除元素 |
push() | 在数组的尾部添加一个或多个元素 |
pop() | 删除数组的最后一个元素,并返回该元素 |
unshift() | 在数组的头部添加一个或多个元素 |
shift() | 删除数组第一个元素,并返回该元素 |
toString() | 返回将数组每个元素转化为字符串并用逗号分隔连接起来的字符串 |
forEach() | 从头至尾遍历数组,为每个元素调用指定的函数 |
map() | 将调用的数组的每个元素传递给指定的函数,并返回一个数组 |
filter() | 根据回调函数内的逻辑判断过滤数组元素,并返回一个新的数组 |
every() | 对数组元素应用指定的函数进行判断,返回true或false |
some() | 对数组元素应用指定的函数进行判断,返回true或false |
reduce() | 使用指定的函数将数组元素进行组合 |
reduceRigth() | 使用指定的函数将数组元素进行组合 |
indexOf() | 判断一个数在该数组中的索引位置 |
lastIndexOf() | 判断一个数在该数组中的索引位置 |
find() | 遍历数组,找出第一个符合回调函数的元素 |
findIndex() | 遍历数组,找出第一个符合回调函数的元素的索引 |
fill() | 用于填充数组 |
includes() | 判断一个数是否在该数组中 |
1、join()
var arr = [1, 2, 3, 4]
arr.join() //返回 "1,2,3,4"
arr.join('-') //返回 "1-2-3-4"
复制代码
2、sort()
var arr = ['cherry', 'apple', 'banana']
arr.sort() //未传入回调函数作为参数
console.log(arr) //返回 ['apple', 'banana', 'cherry']
复制代码
var arr = [54, 78, 12, 64]
arr.sort(function (a, b) {
return a - b
})
console.log(arr) //返回 [12, 54, 64, 78] 升序排列
复制代码
var arr = [54, 78, 12, 64]
arr.sort(function (a, b) {
return b - a
})
console.log(arr) //返回 [78, 64, 54, 12] 降序排列
复制代码
3、reverse()
var arr = [54, 78, 12, 64]
arr.reverse()
console.log(arr) //返回 [64, 12, 78, 54]
复制代码
4、concat()
var arr = [1,2,3,4]
var new_arr = arr.concat()
console.log(new_arr) //返回 [1,2,3,4]
复制代码
var arr = [1,2,3,4]
var new_arr = arr.concat(5,6,7,8)
console.log(new_arr) //返回 [1,2,3,4,5,6,7,8]
复制代码
var arr = [1,2,3,4]
var new_arr = arr.concat([5,6,7,8])
console.log(new_arr) //返回 [1,2,3,4,5,6,7,8]
复制代码
var arr = [1,2,3,4]
var new_arr = arr.concat([5,6,7,8,[9,10]])
console.log(new_arr) //返回 [1,2,3,4,5,6,7,8,[9,10]]
复制代码
5、slice()
var arr = [1,2,3,4,5,6,7]
arr.slice(1,3) //返回 [2,3]
arr.slice(3) //返回 [4,5,6,7]
arr.slice(4,-1) //返回 [5,6]
arr.slice(-3) //返回 [5,6,7]
arr.slice(-3,-2) //返回 [5]
复制代码
6、splice()
var arr = [1,2,3,4,5,6,7]
arr.splice(4) //返回 [5,6,7],此时arr为[1,2,3,4]
arr.splice(1, 2) //返回 [2,3],此时arr为[1,4]
arr.splice(1, 0, 'new1', 'new2') //返回[],此时arr为[1,'new1','new2',4]
复制代码
7、push()
var arr = []
arr.push(1) //返回 1, 此时arr为 [1]
arr.push(5) //返回 2, 此时arr为 [1,5]
arr.push(3,2) //返回 4, 此时arr为 [1,5,3,2]
复制代码
8、pop()
var arr = [6,8,7]
arr.pop() //返回 7, 此时arr为 [6,8]
arr.pop() //返回 8, 此时arr为 [6]
复制代码
9、unshift()
var arr = []
arr.unshift(1) //返回 1, 此时arr为 [1]
arr.unshift(5) //返回 2, 此时arr为 [5,1]
arr.unshift(3,2) //返回 4, 此时arr为 [2,3,5,1]
复制代码
10、shift()
var arr = [6,8,7]
arr.shift() //返回 6, 此时arr为 [8,7]
arr.shift() //返回 8, 此时arr为 [7]
arr.shift() //返回 7, 此时arr为 []
复制代码
11、toString()
[1,2,3].toString() //返回 '1,2,3'
['cherry','apple','bannana'].toString() //返回 'cherry,apple,banana'
[1,2,[6,7]].toString() //返回 '1,2,6,7'
[1,[3,6,[8,9]]].toString() //返回 '1,3,6,8,9'
复制代码
12、forEach()
var a = [1,2,3,4,5]
a.forEach(function (value, index, arr) {
arr[index] = value + 2
})
console.log(a) // [3,4,5,6,7]
复制代码
var a = [1,2,3,4,5]
var sum = 0
a.forEach(function(value) {
sum += value
})
console.log(sum) // 15
复制代码
13、map()
var arr = [1,2,3,4,5]
var new_arr = arr.map(function (value) {
return value * value
})
console.log(new_arr) // [1, 4, 9, 16, 25]
复制代码
14、filter()
var arr = [6, 12, 7, 1, 9, 3, 0, 19]
var new_arr = arr.filter(function (value) {
return value < 6
})
console.log(new_arr) // [1, 3, 0]
复制代码
var arr = [6,12,7,1,9,3,0,19]
var new_arr = arr.filter(function (value, index) {
return index % 2 === 0
})
console.log(new_arr) // [6, 7, 9, 0]
复制代码
15、every()
var arr = [1,2,3,4,5,6,7,8]
var result = arr.every(function (value) {
return value < 10
})
console.log(result) // true, 表示该数组所有元素都小于10
复制代码
var arr = [1, 2, 3, 4, 5, 6, 12, 8]
var result = arr.every(function (value) {
return value < 10
})
console.log(result) // false, 表示该数组中有某个元素不小于10
复制代码
16、some()
some()`方法跟`every()`方法类似,只是逻辑判断略有不同,前者是当**每个元素**调用回调函数后的返回值中,只要有一个为`true`,则最终返回`true`;反之,只有当**每个元素**调用回调函数后的返回值**全部都**为`false`时,最后才返回`false
var arr = [3, 8, 9, 45, 12]
var result = arr.some(function (value) {
return value === 12
})
console.log(result) // true, 表示该数组中有元素12
复制代码
var arr = [3, 8, 9, 45]
var result = arr.some(function (value) {
return value === 12
})
console.log(result) // false, 表示该数组中并没有元素12
复制代码
17、reduce()
var arr = [1,2,3,4,5,6]
var result = arr.reduce(function (x, y) {
return x * y
})
console.log(result) // 720
复制代码
var arr = [10, 11, 13, 14, 12]
var result = arr.reduce(function (x, y) {
return x + y
}, 29) //这里将老师的年龄29作为reduce()方法的第二个参数
console.log(result) // 89
复制代码
18、reduceRight()
19、indexOf()
var arr = ['小红', '小明', '张三', '李四', '王五']
var index = arr.indexOf('张三') + 1
console.log(index) // 3, 表示张三成绩排名第三
复制代码
var arr = ['张三', '小红', '小明', '张三', '李四', '王五']
//给indexOf()方法的第二个参数赋值1,表示从数组的第二个元素开始找
var index = arr.indexOf('张三', 1) + 1
console.log(index) // 4, 表示成绩差点的张三排名第四
复制代码
var arr = ['小红', '小明', '张三', '李四', '王五']
var index = arr.indexOf('小王')
if(index === -1) {
console.log('false')
}
else {
console.log('true')
}
// false
复制代码
20、lastIndexOf()
21、find()
var arr = [1, 7, 3, 10, 12, 20]
var result = arr.find(function (value) {
return value > 10
})
console.log(result) // 12, 表示数组中找到的第一个比10大的元素为12
复制代码
22、findIndex()
var result = [3, 4, 10, 8, 9, 0].findIndex(function (value) {
return value > 9
})
console.log(result) // 2,表示该数组中第一个大于9的元素索引为2
复制代码
23、fill()
[1,2,3,4,5].fill(6) //返回 [6, 6, 6, 6, 6]
[1,2,3,4,5].fill(6, 2) //返回 [1, 2, 6, 6, 6]
[1,2,3,4,5].fill(6, 2, 3) //返回 [1, 2, 6, 4, 5]
复制代码
24、includes()
var arr = ['chery', 'banana', 'apple', 'watermelon']
var result = arr.includes('banana')
console.log(result) //true, 表示banana在数组中
复制代码
var arr = ['chery', 'banana', 'apple', 'watermelon']
var result = arr.includes('banana', -2) //表示从倒数第二个开始找
console.log(result) //false, 表示从倒数第二个开始找,没有找到banana
复制代码