JS常用方法-数组篇
共 4092字，需浏览 9分钟
·
2021-08-25 14:37
会改变原数组的方法
以下七种：
push(),pop(),shift(),unshift(),splice(),sort(),reserve()，我自己比较常用的有unshfit(),splice()
01 - 添加数组元素方法
push()方法：
在数组结尾处向数组添加一个新的元素（其余元素索引未改变），参数为被添加元素
let fruits = ['苹果','香蕉','橘子']
fruits.push('西瓜') // 向数组添加一个新元素
console.log(fruits); // ['苹果','香蕉','橘子','西瓜']返回值为改变后新数组的长度
let fruits = ['苹果','香蕉','橘子']
let x = fruits.push('西瓜') // x的值为4unshift()方法：
在数组开头处添加一个新元素（其余元素索引都向后移一位），参数为被添加元素
let fruits = ['苹果','香蕉','橘子']
fruits.unshift('西瓜') // 向数组开头添加一个新元素
console.log(fruits); // ['西瓜','苹果','香蕉','橘子']返回值为改变后新数组的长度
let fruits = ['苹果','香蕉','橘子']
let x = fruits.unshift('西瓜') // x的值为402 - 删除数组元素方法
pop()方法：
删除数组中最后一个元素（其余元素索引未改变）
let fruits = ['苹果','香蕉','橘子']
fruits.pop() // 删除数组的最末尾元素
console.log(fruits); // ['苹果','香蕉']返回值为被删除元素
let fruits = ['苹果','香蕉','橘子']
let x = fruits.pop() // x的值为'橘子'shift()方法：
删除数组首个元素（其余元素索引都向前移一位）
let fruits = ['苹果','香蕉','橘子']
fruits.shift() // 删除数组的首位元素
console.log(fruits); // ['香蕉','橘子']返回值为被删除元素
let fruits = ['苹果','香蕉','橘子']
let x = fruits.shift() //x的值为'苹果'03 - 特殊方法splice()
1、用于向数组添加新项
第一个参数定义添加新元素的位置（索引号）；第二个参数定义删除元素数目；第三个及之后的参数定义新添加元素。
let fruits = ['苹果','香蕉','橘子']
fruits.splice(1,0,'西瓜','芒果') // 在索引号为1的位置添加'西瓜'和'芒果'
console.log(fruits); // ["苹果", "西瓜", "芒果", "香蕉", "橘子"]返回值为被删除元素组成的数组（如果有）
let fruits = ['苹果','香蕉','橘子']
x = fruits.splice(1,1,'西瓜','芒果') // 在索引号为1的位置删除一个元素并在该位置添加'西瓜'和'芒果'
console.log(x); // ["香蕉"]
console.log(fruits); // ["苹果", "西瓜", "芒果", "橘子"]2、用于删除数组元素
只定义第一个和第二个参数（删除元素个数，不为0）。
let fruits = ['苹果','香蕉','橘子']
fruits.splice(1,1) //在索引号为1的位置删除1个元素
console.log(fruits); //["苹果", "橘子"]04 - 数组排序方法
sort()方法：
默认让数组按照字母排序，返回值为排序后的新数组
let fruits = ["Banana", "Orange", "Apple", "Mango"]
x = fruits.sort() // 让数组按照字母排序
console.log(x); // ["Apple", "Banana", "Mango", "Orange"]
console.log(fruits); // ["Apple", "Banana", "Mango", "Orange"]给数值数组排序
let nums = [98, 57, 87, 36, 7]
x = nums.sort(function(a, b){return a - b}) //从小到大
console.log(x); // [7, 36, 57, 87, 98]
y = nums.sort(function(a, b){return b - a}) //从大到小
console.log(y); // [98, 87, 57, 36, 7]reverse()方法：
将原数组顺序翻转，返回值为翻转后的新数组
let fruits = ["Banana", "Orange", "Apple", "Mango"]
x = fruits.reverse() // 让数组顺序翻转
console.log(x); // ["Mango","Apple","Orange","Banana"]不改变原数组的方法
01 - 数组合并和裁剪
concat()方法：
合并两个数组或是一个数组和多个元素，类似于向数组添加元素参数可以为一个数组或是元素，返回值为合并后的新数组
let fruits = ["Banana", "Orange", "Mango"]
let fruits2 = ['葡萄','香蕉','西瓜']
fruitsArr = fruits.concat(fruits2) // 合并fruits和fruits2
console.log(fruitsArr); // ["Banana", "Orange", "Mango", "葡萄", "香蕉", "西瓜"]slice()方法：
用数组的某个片段切出新数组，参数：第一个为开始索引，第二个为结束参数（不包括）
let fruits = ["Banana", "Orange", "Mango", "Apple", "Pear", "Lemon"]
fruitsCut = fruits.slice(1,3) // 剪切索引从1到3之前的元素作为新数组
console.log(fruitsCut); // ["Orange", "Mango"]不定义第二个参数时，裁剪从开始参数之后所有元素作为新数组
let fruits = ["Banana", "Orange", "Mango", "Apple", "Pear", "Lemon"]
fruitsCut = fruits.slice(3) // 剪切索引从3开始的所有元素作为新数组
console.log(fruitsCut); // ["Apple", "Pear", "Lemon"]02 - 数组迭代方法
对每个数组项进行操作
forEach()：
遍历数组的每个元素参数：第一个为每个元素，第二个为该元素索引号，第三个为数组本身常用的为前两个参数接受回调函数对数组进行操作
let fruits = ["Banana", "Orange", "Orange"]
fruits.forEach((item,index) => {
console.log(item); // 分别输出Banana，Orange，Orange
console.log(index); // 分别输出0，1，2
});indexOf()：
搜索元素值在数组中第一次出现的位置，返回索引值，没有找到返回-1参数为被查找元素
let fruits = ["Banana", "Orange", "Mango"]
let x = fruits.indexOf('Mango') // 查找'Mango'
console.log(x); // x值为2
let y = fruits.indexOf('Apple') // 查找'Apple'
console.log(y); // y值为-1filter()：
过滤出符合条件的元素组成一个新数组参数：第一个为每个元素，第二个为该元素索引号，第三个为数组本身回调函数中return限制条件
let nums = [98, 57, 87, 36, 7]
let numsFil = nums.filter((item,index) => {
return item > 50 // 过滤出大于50的元素成为新数组
})
console.log(numsFil); // [98, 57, 87]reduce()：
可以用统计符合条件元素总数参数：第一个为总数（初始值/先前返回值），第二个参数为每个元素，第三个参数为元素索引号，第四个参数为数组本身常用的为前两个参数
let nums = [98, 57, 87, 36, 7]
let total = nums.reduce((pre,val) => {
if(val<50){ // 条件为值小于50
pre++ // 符合条件时pre加1
}
return pre // 不符合时返回pre
},0) // 接收初始值，不写时默认为0
console.log(total); // total值为2