JavaScript复习——操作数组的api（一）

数组的增删改查

push()

push方法主要是向数组的尾部添加一个或者多个元素，然后返回新数组的长度。

let arr = []
let arrLen = arr.push(1,2,3,4)

console.log("返回数组的长度:", arrLen, ",新数组: ", arr)
// 返回数组的长度: 4 ,新数组:  [ 1, 2, 3, 4 ]

pop()

pop方法主要是删除数组的最后一个元素，并返回删除的元素。

let arr = [1,2,3,5]
let deleteItem = arr.pop()

console.log("返回删除的元素: ", deleteItem, ",新数组：", arr) 
// 返回删除的元素: 5 ,新数组： [ 1, 2, 3 ] 

unshift()

unshift方法可向数组的头部添加一个或多个元素，并返回新数组的长度。

let arr = []
let arrLen = arr.unshift(1,2,3,4)

console.log("返回数组的长度:", arrLen, ",新数组: ", arr)
// 返回数组的长度: 4 ,新数组:  [ 1, 2, 3, 4 ]

shift()

shift 方法主要是删除数组的第一个元素，并返回删除的元素。

let arr = [1,2,3,4]
let deleteItem = arr.shift()

console.log("返回删除的元素：", deleteItem, "，新数组：", arr)
// 返回删除的元素： 1 ，新数组： [ 2, 3, 4 ]

splice()

splice方法可以传入多个参数，第一个参数代表数组添加/删除项目的起始下标，第二个参数代表要删除的元素的数量，第 n+2 个参数代表即将向数组添加的元素。以下将使用splice方法对数组实现增删改。splice方法的返回值是一个数组，数组里存放的是删除的元素

• 使用splice删除数组元素

let arr = [1,2,3,4]
let deleteArr = arr.splice(1, 2)

// 以下标为 1/n 的元素开始，删除两个元素console.log("删除元素后的数组:", arr,"删除的元素:", deleteArr) 
// 删除元素后的数组: [ 1, 4 ] 删除的元素: [ 2, 3 ]

• 使用splice修改数组元素

let arr = ["张三", "李四", "王五", "赵六"]
let deleteArr = arr.splice(1, 1, "熊大")
//  以下标为 1/n 的元素开始，删除一个元素，添加另外一个元素
console.log("修改后的数组:", arr,"删除的元素:", deleteArr)
// 修改后的数组: [ '张三', '熊大', '王五', '赵六' ] 删除的元素: [ '李四' ]

• 使用splice添加数组元素

let arr = ["张三", "李四", "王五", "赵六"]
let deleteArr = arr.splice(1, 0, "熊大") 
//  以下标为 1/n 的元素开始，删除 0/n 个元素，在下标为 1/n 的位置添加 1/n 个元素

console.log("修改后的数组:", arr,"删除的元素:", deleteArr)
// 修改后的数组: [ '张三', '熊大', '李四', '王五', '赵六' ] 删除的元素: []

indexOf()

indexOf 方法用于查找数组元素，可以返回某个指定的字符串值在字符串中首次出现的位置。如果数组中有指定的元素值，那么返回元素的下标，如果没有则返回 -1 。该方法有两个参数，第一个参数是要查找的元素，第二个参数是是要查找的起始下标。

let arr = ["张三", "李四", "王五", "赵六", "张三"]

let index1 = arr.indexOf("张三") 
let index2 = arr.indexOf('张三', 1) // 以下标为1开始查找元素
let notFind = arr.indexOf('熊二')

console.log("查找的数组:", arr)
console.log("有范围地查找元素:", index1, "无范围地查找元素的:", index2, "未查找到的返回值：", notFind)
// 查找的数组: [ '张三', '李四', '王五', '赵六', '张三' ]
// 有范围地查找元素: 0 无范围地查找元素的: 4 未查找到的返回值： -1

lastIndexOf()

lastIndexOf也是用于查找数组元素，但是，它是从后面往前找，如果数组中有指定的元素值，那么返回元素的下标，如果没有则返回 -1 。该方法有两个参数，第一个参数是要查找的元素，第二个参数是是要查找的起始下标。

let arr = ["张三", "李四", "王五", "赵六", "张三"]

let index1 = arr.lastIndexOf("张三") 
let index2 = arr.lastIndexOf('张三', 1) // 以下标为1开始查找元素
let notFind = arr.lastIndexOf('熊二') 

console.log("查找的数组:", arr)
console.log("有范围地查找元素:", index1, "无范围地查找元素的:", index2, "未查找到的返回值：", notFind)

// 查找的数组: [ '张三', '李四', '王五', '赵六', '张三' ]
// 有范围地查找元素: 4 无范围地查找元素的: 0 未查找到的返回值： -1

findIndex()

findIndex是用于查找元素的，它的返回值是返回第一个符合条件的元素的下标，如果没有查找到符合的元素，那么返回 -1。它可以传入两个参数，第一个参数是一个回调函数,数组中的每个元素都调用一次回调函数。在回调函数中可以写你要查找元素的条件，当条件成立为true时，返回该元素的下标，没有则返回 -1。第二个参数我们通常不会用到，但是也说一下，它可以传入一个任意类型的值，这个值可以改变第一个参数内部的this指向。

let arr = [1,2,3,4]
let obj = {  name: '张三'}

// 第一个参数是一个回调函数，函数的形参有三个  数组元素：val,数组下标：index,原数组：array
let index = arr.findIndex(function(val, index, array) {
  console.log('数组元素:', val, ",元素下标:", index, ', 原数组:', array, "，传入的对象:", this)
  return val <= 2
}, obj) 
// 传入一个对象，那函数内部的this 指向就改变了，即函数内部的环境上下文就改变了console.log('查找到符合条件的元素的下标:', index)

// 数组元素: 1 ,元素下标: 0 , 原数组: [ 1, 2, 3, 4 ] ，传入的对象: { name: '张三' }
// 查找到符合条件的元素的下标: 0

find()

find可以用于查找元素，它的返回值是返回第一个符合条件的元素，如果没有，则返回undefined。它可以传入两个参数，这两个参数的跟findIndex是一样的，这里就不累述了。

let arr = [1,2,3,4]
let obj = {name:'张三'}

// 第一个参数是一个回调函数，函数的形参有三个  数组元素：val,数组下标：index,原数组：array
let index = arr.find(function(val, index, array) {   
    console.log('数组元素:', val, ",元素下标:", index, ', 原数组:', array, "，传入的对象:", this)  
    return val <= 2
}, obj) 
// 传入一个对象，那函数内部的this 指向就改变了，即函数内部的环境上下文就改变了

console.log('查找到符合条件的元素:', index)

// 数组元素: 1 ,元素下标: 0 , 原数组: [ 1, 2, 3, 4 ] ，传入的对象: { name: '张三' }
// 查找到符合条件的元素的下标: 0

includes()

includes用于判断数组是否存在指定的值，它的返回值是一个布尔值，存在就返回true，不存在就返回false。它可以传入两个参数，第一个参数是要查找的元素，第二个参数是要查找的起始位置。

let arr = [1,2,3,4]let isExit = arr.includes(1, 0)

console.log("是否存在指定的元素：", isExit)
// 是否存在指定的元素： true