javascript 数组的常用方法

本文详细介绍了JavaScript中会改变数组的7种方法(push(), pop(), unshift(), shift(), reverse(), sort(), splice()),以及不会改变数组的5种操作(concat(), join(), slice(), indexOf(), lastIndexOf())。同时讲解了复杂语法下的一些数组处理技巧如forEach(), map(), filter(), every(), some(), find(), 和 reduce()。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 =================以下方法会改变数组(以数组的方式返回)==============

        let arr = [-10, 20, 30, 40, 50, -9]
    // ==================以下方法会改变数组(以数组的方式返回)===============
    // 1. push() -- 在数组末尾追加一条数据 => 最新的长度
    let arr = [1, 2, 3, 4]
    console.log(arr)
    let res = arr.push('新来的')
    console.log(arr)
    // 2. pop() -- 删除数组最后一条数据 => 被删除的数据
    let res = arr.pop()
    console.log(arr);
    // 3. unshift() -- 在数组前面追加一条数据 => 最新的长度
    let res = arr.unshift('我也是新来的')
    console.log(arr);
    // 4. shift() -- 删除数组最前面的数据 => 被删除的数据
    let res = arr.shift()
    console.log(arr);
    // 5. reverse() -- 反转数组 => 反转后的数组
    let res = arr.reverse()
    console.log(arr);
    // 6. sort() -- 对数组进行升降序排序 => 排序后的数组
    // => 一位一位看待
    let res = arr.sort()
    // => 升序排列
    let res = arr.sort(function(a, b) { return a - b })
    // => 降序排列
    let res = arr.sort(function(a, b) { return b - a })
    console.log(arr);
    // 7. splice(开始索引,多少个,'要插入的数据') -- 截取数组选择性是否插入内容 => 是一个新数组
    let res = arr.splice(1, 1, '新来的')
    console.log(arr);

  =================以下方法会改变数组(以返回值的方式返回)==============

    // ==============以下方法不会改变数组(以返回值的方式返回)==============


    let arr = [1, 2, 3, 4, 5]
    let arr = ['hello', 'world']
    console.log(arr);

    // 1. concat(数据, 数组, ...) -- 进行数组拼接 => 拼接好的数组
    let res = arr.concat([100, 300])
    console.log(arr);
    console.log(res);

    // 2. join('连接符') -- 使用连接符把数组内的每一项连接成为一个字符串 => 链接好的字符串
    let res = arr.join('^_^')
    console.log(res)

    // 3. slice(开始索引, 结束索引) -- 截取数组,从数组内复制一些内容出来 => 被截取的数组
    // 包前不包后
    let res = arr.slice(1,4)
    console.log(res);

    // 4. indexOf(数据, 开始索引的位置(默认是0)) -- 从开始索引向后检索该数组中是否有该数据 => (第一次出现的被检索的数据出现的位置, 如果没有该数据差就显示 -1)
    let res = arr.indexOf(3)
    console.log(res);

    // 5. lastIndexOf() -- 和 4 一样只不过是从后往前索引
    let res = arr.lastIndexOf(2)
    console.log(res);

  =================以下方法会改变数组(以return的方式返回)==============

                                                相对复杂的数组类型语法

    // ===============以下方法不会改变数组(以return的方式返回)===============

    // 相对复杂的数据类型语法

    // 1. forEach(function(){}) -- 用来遍历数组 => undefined
    // 可以接受三个参数 1 => 数组内的每一项 2 => 数组内每一项索引 3 => 原始数组
    arr.forEach((item, index, arr) => {
      console.log('我执行了')
      console.log(item + '----' + index + '----' + arr)
    })
    let sum = ''
    arr.forEach((item) => {
      sum += item
    })
    console.log(sum)

    // 2. map(function(item,index,arr){return}) -- 映射数组 => 是一个新数组,和原始数组长度一致
    let res = arr.map((item) => {
      return item * 10
    })
    console.log(res)

    // 3. filter(funtion(item,index,arr){}) -- 过滤数据 => 是一个新数组,数组内是原始数组中所有满足条件的数组,以return的形式返回
    let res = arr.filter((item) => {
      return item > 3
    })
    console.log(res)

    // 4. every(function(item,index,arr){}) -- 判断数组是不是每一个都满足条件 => 一个布尔值
    let res = arr.every((item) => {
      return item <= 5
      // 有任意一个不满足都是 false
    })
    console.log(res)

    // 5. some(function(item,index,arr){}) -- 判断数组是不是某一个满足条件 -- 一个布尔值
    let res = arr.some((item) => {
      return item > 3
      // 有任意一个满足都返回 true
    })
    console.log(res)

    // 6. find(function(item,index,arr){}) -- 查找数组中某一个数据 => 数组中你查找到的该数据
    // 查找的一般都是复杂数据类型
    let id = prompt('请输入你要查找学生的id') - 0
    let studentArr = [
      { id: 1, name: 'Jack' },
      { id: 2, name: 'Rose' },
      { id: 3, name: 'Tom' }
    ]
    let student = studentArr.find((item) => {
      return item.id === id
    })
    console.log(student);

    // 7. reduce(function(prev,item,index,arr){}, 初始值) -- 进行叠加累计 => 默认是0,表示从什么位置开始叠加
    // 四个参数 1 => 初始值 或 每一次叠加后的结果 2 => 每一项 3=> 索引 4 => 原始数组
    let res = arr.reduce((prev, item) => {
      return prev + item
    },100)
    console.log(res);

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值