JS数组方法整理

数组常用方法总结

01_数组常用方法1
=> 数组基础方法
=> push()
=> pop()
=> unshift()
=> shift()
02_数组常用方法2
=> ES3.0, IE 6 7 8 可以是使用
=> reverse()
=> sort()
=> splice()
=> join()
=> slice()
=> concat()
03_数组常用方法3
=> ES5.0, IE 6 7 8 不好使了
=> indexOf()
=> lastIndexOf()
=> forEach()
=> map()
=> fliter()
=> every()
=> some()
04_数组常用方法4
=> ES2015(ES6) 以后, 标准浏览器, IE 10 以上
=> fill()
=> copyWithin()
=> includes()
=> flat()
=> flatMap()
=> find()
=> findIndex()

数组常用方法

        + 就是 JS 自带一些操作数组得方法
        + 数组常用方法得使用格式, 必须是 数组.xxx()
        + 数组和伪数组得区别
          => length 和 索引都一样, 循环遍历都一样
          => 长得也一样
          => 唯独数组常用方法, 伪数组同不了

      1. push()

        => 语法: 数组.push(数据1, 数据2, 数据3, ...)
        => 作用: 把所有得参数按照顺序追加到数组得末尾位置
        => 返回值: 追加以后数组得长度
        => 直接操作原始数组

      2. pop()

        => 语法: 数组.pop()
        => 作用: 删除数组得最后一个数据
        => 返回值: 被删除得数据
        => 直接操作原始数组

      3. unshift()

        => 语法: 数组.unshift(数据1, 数据2, 数据3, ...)
        => 作用: 从数组得最前面插入一些数据
        => 返回值: 插入后得数组长度
        => 直接操作原始数组

      4. shift()

        => 语法: 数组.shift()
        => 作用: 删除数组得最前面一个数据
        => 返回值: 被删除得数据
        => 直接操作原始数组

      5. reverse()

        => 语法: 数组.reverse()
        => 作用: 反转数组
        => 返回值: 反转后得数组
        => 直接操作原始数组

      6. sort()

        => 语法:
          1. arr.sort()
            -> 按照每一个数据中得每一位数据得 ASCII 码进行排列
          2. arr.sort(function (a, b) { return a - b })
            -> 升序排列
          3. arr.sort(function (a, b) { return b - a })
            -> 降序排列
        => 作用: 数组排序
        => 返回值: 排序后得数组
        => 直接操作原始数组

      7. splice()

        => 语法:
          1. 数组.splice(开始索引, 多少个)
            -> 从开始索引, 截取多少个
            -> 第二个参数可以不写, 直接到末尾
          2. 数组.splice(开始索引, 多少个, 替换数据1, 替换数据2, 替换数据3, ...)
            -> 把替换数据按照顺序插入到你截取得位置
            -> 注意: **从哪个索引开始删除, 替换数据得第一个就插入哪个位置**
        => 作用: 有两个
          1. 截取数组
          2. 替换新内容
        => 返回值: 一定是一个数组
          -> 如果你截取多个数据, 数组里面有多个
          -> 如果你截取一个数据, 数组里面有一个
          -> 如果你一个都不截取, 那么是一个空数组
        => 直接操作原始数组

      8. concat()

        => 语法: 数组.concat(数组1, 数据2, ...)
        => 作用:
          -> 如果参数是数组, 那么把数组拆开, 里面每一项追加到原数组后面
          -> 如果参数数数据, 那么直接追加
        => 返回值: 追加好得数组
        => 不改变原始数组

      9. slice()

        => 语法:
          1. 数组.slice(开始索引, 结束索引) - 包前不包后
            -> 第一个参数可以不写, 表示从头
            -> 第二个参数可以不写, 表示到尾
          2. 数组.slice(开始索引, 结束索引) - 包前不包后
            -> 参数可以写一个负整数
            -> 当你书写了一个负整数以后, 表示 length + 负整数
        => 作用: 获取数组里面得某些数据
        => 返回值: 一个数组
          -> 如果你获取多个数据, 数组里面有多个
          -> 如果你获取一个数据, 那么数组里面有一个
          -> 如果你一个都不获取, 那么是个空数组
        => 不改变原始数组

      10. join()

        => 语法: 数组.join('连接符号')
          -> 不传递, 是按照 逗号(,) 连接
          -> 你传递什么, 按照什么连接
        => 作用: 把数组里面得每一个数据使用连接符号连接在一起
        => 返回值: 是一个连接好得内容, 是一个 String 类型

     11. indexOf()

        => 语法:
          1. 数组.indexOf(数据)
          2. 数组.indexOf(数据, 开始索引)
            -> 从哪个索引开始向后查找
        => 作用: 正向查看数组里面指定这个数据得索引
        => 返回值:
          -> 如果有这个数据, 是第一个满足条件得数据得索引
          -> 如果没有这个数据, 那么是 -1

      12. lastIndexOf()

        => 语法:
          1. 数组.lastIndexOf(数据)
          2. 数组.lastIndexOf(数据, 开始索引)
            -> 从哪一个索引开始向前查找
        => 作用: 反向查看数组里面指定这个数据得索引
        => 返回值:
          -> 如果有, 就是找到得第一个数据得索引
          -> 如果没有就是 -1
          -> 注意: 虽然是从后向前查找, 但是索引还是正常索引

      13. forEach()

        => 语法: 数组.forEach(function (item, index, arr) {})
          -> item: 数组得每一项
          -> index: 数组每一项得索引
          -> arr: 原始数组
        => 作用: 取代 for 循环得作用, 遍历数组
        => 没有返回值

      14. map()

        => 语法: 数组.map(function (item, index, arr) {})
          -> item: 数组得每一项
          -> index: 数组每一项得索引
          -> arr: 原始数组
        => 作用: 映射数组
        => 返回值: 需要return才能返回,是一个新的数组
          -> 里面是对原始数组每一个数据得操作
          -> 返回值数组, 一定和原始数组长度一样
        => 不改变原始数组

      15. filter()

        => 语法: 数组.filter(function (item, index, arr) {})
          -> item: 数组得每一项
          -> index: 数组每一项得索引
          -> arr: 原始数组
        => 作用: 过滤原始数组中得数据, 把满足条件得放在新数组里面
        => 返回值: 新数组, 里面是所有原始数组中满足条件得项
        => 不改变原始数组

      16. every()

        => 语法: 数组.every(function (item, index, arr) {})
          -> item: 数组得每一项
          -> index: 数组每一项得索引
          -> arr: 原始数组
        => 作用: 判断原始数组里面是不是每一个都满足条件
        => 返回值: 是一个布尔值
          -> 如果原始数组中每一个都满足条件, 那么返回 true
          -> 只要原始数组中有任意一个不满足条件, 那么就返回 false

      17. some()

        => 语法: 数组.some(function (item, index, arr) {})
          -> item: 数组得每一项
          -> index: 数组每一项得索引
          -> arr: 原始数组
        => 作用: 判断数组中是不是有某一个满足条件
        => 返回值: 一个布尔值
          -> 如果数组中有任意一个数据满足条件, 那么返回 true
          -> 如果数组中所有数据都不满足条件, 那么返回 false

     18. copyWithin()

        => 语法: 数组.copyWithin(目标位置, 开始索引, 结束索引)
          -> 目标位置: 当你替换内容得时候, 从哪一个索引位置开始替换
          -> 开始索引: 数组哪一个索引位置开始当作替换内容, 默认值是 0
          -> 结束索引: 数组哪一个索引位置结束当作替换内容, 默认是末尾
          -> 包前不包后
        => 作用: 使用数组里面得内容替换数组里面得内容(用数组自己的内容替换自己的内容)
        => 返回值: 是一个新的数组
          -> 替换后得数组

      19. fill()

        => 语法: 数组.fill(要填充得数据, 开始索引, 结束索引)
          -> 要填充得数据: 你想用什么数据填充数组里面每一位
          -> 开始索引: 从哪一个索引开始填充, 默认值是 0
          -> 结束索引: 填充到哪一个索引位置, 默认值是 末尾
          -> 前提: 数组要有 length
          -> 包前不包后
        => 作用: 使用指定数据区填充数组
        => 返回值: 填充好得数组

      20. includes()

        => 语法: 数组.includes(数据)
        => 作用: 查看数组中是不是有某一个数据
        => 返回值: 一个布尔值
          -> 有这个数据, 就是 true
          -> 没有这个数据, 就是 false

      21. flat()

        => 语法: 数组.flat(数字)
          -> 数字: 表示扁平化多少层, 默认是 1
          -> 数字这个参数还可以填写 Infinity
        => 作用: 拍平数组
        => 返回值: 拍平以后得数组

      22. flatMap()

        => 语法: 数组.flatMap(function (item, index, arr) {})
        => 作用: 拍平数组, 但是只能拍一层
        => 返回值: 是一个新的数组
          -> 一边拍平, 一边映射

      23. find()

        => 语法: 数组.find(function (item) {})
        => 作用: 根据条件找到数组里面满足条件得数据
        => 返回值: 找到得那个 **数据**(只返回满足条件的第一个数据)

      24. findIndex()

        => 语法: 数组.findIndex(function (item) {})
        => 作用: 根据条件找到数组里面满足条件得数据
        => 返回值: 找到得那个 **数据得索引**(只返回满足条件的第一个数据的索引)

版权声明

1、本文地址:https://www.09606.com/167.html
2、转载请保留本文地址及链接,本站保留追究法律责任的权力。
3、部分文章来源于网络,仅作为学习展示之用,版权归原作者所有。
4、因部分文章网络流转次数较多,已无法追溯至原作者,若遗漏导致侵犯了您的权益,请您 留言给我

THE END
分享
二维码
打赏
< <上一篇
下一篇>>
文章目录
关闭
目 录