数组常用方法总结

    01_数组常用方法
      => 数组基础方法
      => push() 在尾部追加
      => pop()  删除最后一个数据
      => unshift() 最前面插入数据
      => shift()  删除最前面的数据
    02_数组常用方法
      => ES3.0, IE 6 7 8 可以是使用
      => reverse()  反转数组
      => sort()     数组排序
      => splice()   1.截取数组,2.替换新内容
      => join()        把每一个数据用连接符连接起来
      => slice()    获取数组中的某些数据
      => concat()   如果参数是数组, 那么把数组拆开, 里面每一项追加到原数组后面
                      如果参数数数据, 那么直接追加

    03_数组常用方法
      ES5.0, IE 6 7 8 不好使了
      => indexOf()      正向查看数组里面指定这个数据的索引
      => lastIndexOf()  反向查看数组里面指定这个数据得索引
      => forEach()        取代 for 循环得作用, 遍历数组
      => map()            映射数组
      => fliter()        过滤原始数组中得数据, 把满足条件得放在新数组里面
      => every()        判断原始数组里面是不是每一个都满足条件(true/false)
      => some()            判断数组中是不是有某一个满足条件(true/false)
    04_数组常用方法
      ES2015(ES6) 以后, 标准浏览器, IE 10 以上
      => fill()            使用指定数据区填充数组
      => copyWithin()    使用数组里面得内容替换数组里面得内容
      => includes()        查看数组中是不是有某一个数据
      => flat()            拍平数组
      => flatMap()        拍平数组, 但是只能拍一层
      => find()            根据条件找到数组里面满足条件得数据
      => findIndex()    根据条件找到数组里面满足条件得数据

数组常用方法

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

1. push()

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

var arr = ['hello', 'world', '你好', '世界']
var res = arr.push('新来的', '新来的2', [10, 20])
console.log(res)
console.log(arr)

2. pop()

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

var arr = ['hello', 'world', '你好', '世界']
var res = arr.pop()
console.log(res)
console.log(arr)

3. unshift()

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

var arr = ['hello', 'world', '你好', '世界']
var res = arr.unshift('新来的', '新来的2')
console.log(res)
console.log(arr)

4. shift()

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

var arr = ['hello', 'world', '你好', '世界']
var res = arr.shift()
console.log(res)
console.log(arr)

5. reverse()

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

var arr = ['hello', 'world', '你好', '世界']
var res = arr.reverse()
console.log(res)
console.log(arr)

6. sort()

    => 语法:

      1. arr.sort()

         -> 按照每一个数据中得每一位数据得 ASCII 码进行排列

      2. arr.sort(function (a, b) { return a - b })

         -> 升序排列

      3. arr.sort(function (a, b) { return b - a })

         -> 降序排列

    => 作用: 数组排序
    => 返回值: 排序后得数组
    => 直接操作原始数组

   var arr = [1, 11, 33, 26, 51, 19, 32, 27, 15, 100]
       var res = arr.sort()
       console.log(res)
       console.log(arr)

   var res = arr.sort(function (a, b) { return a - b })
       console.log(res)
       console.log(arr)

   var res = arr.sort(function (a, b) { return b - a })
       console.log(res)
       console.log(arr)

7. splice()

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

8. concat()

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

    
var arr = ['hello', 'world', '你好', '世界']
var res = arr.concat([10, 20], [30, 40], 100)
console.log(res)
console.log(arr)

9. slice()

    => 语法:

      1. 数组.slice(开始索引, 结束索引) - 包前不包后

         -> 第一个参数可以不写, 表示从头
         -> 第二个参数可以不写, 表示到尾

      2. 数组.slice(开始索引, 结束索引) - 包前不包后

         -> 参数可以写一个负整数
         -> 当你书写了一个负整数以后, 表示 length + 负整数

         => 作用: 获取数组里面得某些数据
         => 返回值: 一个数组
           -> 如果你获取多个数据, 数组里面有多个
           -> 如果你获取一个数据, 那么数组里面有一个
           -> 如果你一个都不获取, 那么是个空数组
         => 不改变原始数组

   
var arr = ['hello', 'world', '你好', '世界']
var res = arr.slice(1, 3)
console.log('res : ', res)
console.log('arr : ', arr)

// 因为 length 是 4, -2 得位置实际上相当于 4 + -2, 2
var res2 = arr.slice(1, -1)
console.log('res2 : ', res2)
console.log('arr : ', arr)

10. join()

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

   
var arr = ['hello', 'world', '你好', '世界']
var res = arr.join('abcd')
console.log(res)
console.log(arr)

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: 原始数组
    => 作用: 映射数组
    => 返回值: 是一个新的数组
      -> 里面是对原始数组每一个数据得操作
      -> 返回值数组, 一定和原始数组长度一样
    => 不改变原始数组

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) {})
    => 作用: 根据条件找到数组里面满足条件得数据
    => 返回值: 找到得那个 **数据得索引**