[JavaScript知识库]javascript中常用的数组方法

在后期的项目开发过程中，在请求后台接口数据的时候往往需要对请求回来的数据进行相应的修改，有时候就需要使用一些简易的方法，以下是我觉得经常会使用的一些数组中的方法今天给它整理了一下。

目录

forEach()

some()

every()

filter()

map()?

readuce()?

find()

join()

toString()

reverse()

pop()

shift()

push()

unshift()

forEach()

const classRoom = [
      { name: 'lh', age: 21, sex: '女' },
      { name: 'dragon', age: 18, sex: '男' },
      { name: 'zs', age: 20, sex: '女' },
      { name: 'RNG', age: 19, sex: '男' },
      { name: 'IG', age: 22, sex: '男' },
      { name: 'ls', age: 21, sex: '女' }
    ]
// forEach() 循环数组 可以遍历数组里面的元素，然后按条件找到自己想要的元素
// 注意点: forEach() 一旦开启不会在中间某个位置停止，
// 即使使用 breack 或者 return也不允许
classRoom.forEach((item) => {
  if (item.sex === '男') {
      console.log(item)
   }
})

some()

const classRoom = [
      { name: 'lh', age: 21, sex: '女' },
      { name: 'dragon', age: 18, sex: '男' },
      { name: 'zs', age: 20, sex: '女' },
      { name: 'RNG', age: 19, sex: '男' },
      { name: 'IG', age: 22, sex: '男' },
      { name: 'ls', age: 21, sex: '女' }
    ]
// some() 用于判断数组是否存在满足某个特定条件的元素，返回值类型为 Boolean
const res = classRoom.some(item => item.age > 22)
console.log(res)  // false

every()

const classRoom = [
      { name: 'lh', age: 21, sex: '女' },
      { name: 'dragon', age: 18, sex: '男' },
      { name: 'zs', age: 20, sex: '女' },
      { name: 'RNG', age: 19, sex: '男' },
      { name: 'IG', age: 22, sex: '男' },
      { name: 'ls', age: 21, sex: '女' }
    ]
// every() 用于判断数组中的所有元素是否满足某个条件
// 返回值类型为 Boolean 只有全满足才返回 true
const res = classRoom.every(item => item.sex === '男')
console.log(res) // false

filter()

const classRoom = [
      { name: 'lh', age: 21, sex: '女' },
      { name: 'dragon', age: 18, sex: '男' },
      { name: 'zs', age: 20, sex: '女' },
      { name: 'RNG', age: 19, sex: '男' },
      { name: 'IG', age: 22, sex: '男' },
      { name: 'ls', age: 21, sex: '女' }
    ]
// filter() 用于筛选数组，根据指定条件返回一个新的数组，返回值为一个新的数组 New Array
const newClassRoom = classRoom.filter(item => item.sex === '女')
console.log(newClassRoom)

map()?

const classRoom = [
      { name: 'lh', age: 21, sex: '女' },
      { name: 'dragon', age: 18, sex: '男' },
      { name: 'zs', age: 20, sex: '女' },
      { name: 'RNG', age: 19, sex: '男' },
      { name: 'IG', age: 22, sex: '男' },
      { name: 'ls', age: 21, sex: '女' }
    ]
// map() 循环遍历数组，有返回值，但是 forEach() 没有返回值
const newClassRoom = classRoom.map(item => item.name)
console.log(newClassRoom) 

readuce()?

// readuce() 遍历数组，回调函数如果不写初始值
// 默认从数组索引为1的元素开始遍历并返回新的值
// 这里我写了初始值，从 0  开始的，也就是会从数组第一个元素开始遍历
    const arr = [1, 2, 3]
    const res = arr.reduce((amt, item) => {
      return amt += item
    }, 0)
    console.log(res) // 6

find()

const arr = [1, 2, 3]
const res = arr.find(item => item > 1)
console.log(res)  // 2

join()

// join() 用特定的字符将数组拼接成字符串,默认是','
const arr = [20, 30, 10]
const res = arr.join('-')
console.log(res)  // 20-30-10

toString()

// toString() 将数组转换成字符串，返回转后的新数组
const arr = ['a', 'b', 'c']
const res = arr.toString(arr)
console.log(res) // a,b,c

reverse()

// reverse() 将数组进行翻转,返回翻转后的数组
const arr = [1, 10, 12, 3]
const res = arr.reverse()
console.log(res) // [3, 12, 10, 1]

pop()

// pop() 删除数组最后一个元素 并返回这个元素
const arr = [1, 2, 3]
const res = arr.pop()
console.log(res) // 3

shift()

// shift()  删除数组第一个元素 并返回这个元素
const arr = [1, 2, 3]
const res = arr.shift()
console.log(res) // 1

push()

// push() 在数组结尾添加元素 返回新数组长度
const arr = [0, 1, 2, 3]
const res = arr.push(4)
console.log(res) // 5 新数组长度

unshift()

// unshift() 在数组开头添加元素 返回新数组长度
const arr = [1, 2, 3]
const res = arr.unshift(0)
console.log(res) // 4 新数组的长度

这次分享就到这了