数组常用方法

• push; pop; unshift; shift;
  • push
    • 语法: 数组名.push(数据)
    • 作用: 向数组末尾添加数据
    • 返回值: 追加数据后, 数组最新的长度

    function push(push_arr, data) {
        /**
         *  一个暂时没讲到的知识点:
         *      在 函数传参的过程中, 如果实参的值是一个引用数据类型
         *      然后在函数内部 对这个形参 做了一些修改
         *      那么会影响到 函数外边的 原数据
         * 
         *  在当前案例中
         *      在 函数传参的过程中, 传递了一个 引用数据类型 arr 和一个基本数据类型 100
         *      然后在函数内部 对形参 push_arr 做了一些修改
         *      然后此时的修改会影响 函数外部的原数据 也就是 会影响到 数组 arr
         * 
         *  内部牵扯到一个 引用数据类型和基本数据类型 的区别, 后续会详细讲解
        */
        push_arr[push_arr.length] = data
        return push_arr.length
    }
    push(arr, true)
    push(arr, 100)
    push(arr, 'QF001')
    console.log(arr)
    

  • pop
    • 语法: 数组名.pop()
    • 作用: 删除数组最后一条数据
    • 返回值: 被删除的数据

    var arr = [1, 2, 3]
    function pop(pop_arr) {
        // 0. 先将数组末尾的数据保存, 用于删除后返回出去
        var len = pop_arr[pop_arr.length - 1]
    
        // 1. 删除 数组末尾最后一个数据
        // 删除后 位置还在, 也就是说, 数组最后一位的值没有了, 但是 length 不变  (人出去了, 桌子还在)
        // delete pop_arr[pop_arr.length - 1]
    
        // 删除后 位置也没了, 也就是说, 数组最后一位的值和位置都被删除了,  (人和桌子都没了)
        // pop_arr.length = pop_arr.length - 1
        pop_arr.length -= 1
    
        // 2. 返回被删除的数据
        // console.log('函数内: ', len)
        return len
    }
    
    var res = pop(arr)
    console.log('函数执行完毕后的数组: ', arr)
    console.log('函数执行完毕后的返回值: ', res)
    
    

  • unshift
    • 语法: 数组名.unshift(数据)
    • 作用: 向数组开头添加数据
    • 返回值: 添加数据后, 数组最新的长度

    var arr = [1, 2, 3]
    console.log('原数组: ', arr)
    
    function unshift(unshift_arr, data) {
        /**
         *  逻辑:
         *      1. 创建一个新的数组, 然后将这个数组开头放上我们执行要添加的数据
         *      2. 在将原本数组后续的内容, 放在新数组的后边
        */
    
        // 1. 创建一个新的数组, 然后将这个数组开头放上我们执行要添加的数据
        var newArr = [data]
        // var newArr = []
        // newArr[0] = data
    
        // 2. 在将原本数组后续的内容, 放在新数组的后边
        for (var i = 0; i < unshift_arr.length; i++) {
            // console.log(unshift_arr[i])
            newArr[i + 1] = unshift_arr[i]
        }
    
        // return newArr
        // return newArr.length
    
        return {
            arr: newArr,
            len: newArr.length
        }
    }
    var res = unshift(arr, 'newData')
    
    // console.log(res)
    // console.log(res.len)
    console.log('函数执行完毕后的新数组: ', res.arr)
    console.log('函数执行完毕后的原数组: ', arr)
    
    console.log('======================================================')
    
    
    
    var arr1 = [1, 2, 3]
    console.log('原数组: ', arr1)
    // arr1.unshift('新的数据')
    var len = arr1.unshift('新的数据')
    
    console.log('方法执行完毕后的原数组: ', arr1)
    

  • shift
    • 语法: 数组名.shift()
    • 作用: 删除数组第一条数据
    • 返回值: 被删除的数据

    var arr = [1, 2, 3, 4, 5, 6]
     6 5 4 3 2 1  
    console.log(arr.shift());  
    
    函数
    function shift(a) {
        // 1. 暂存数组首位的内容, 将来要返回出去
        var temp = a[0];
    
        /**
         *  2. 遍历数组找到数组所有的内容, 删除首位的内容
         * 
         *      第 1 次循环
         *          i === 0
         *          a[i] = a[i + 1]     =>      a[0] = a[1]     =>      a[0] = 2
         * 
         *      第 2 次循环
         *          i === 1
         *          a[i] = a[i + 1]     =>      a[1] = a[2]     =>      a[0] = 3
         * 
         * 
         *          .......
         * 
         *      第 6 次循环
         *          i === 5
         *          a[i] = a[i + 1]     =>      a[5] = a[6]     =>      a[0] = undefined
        */
        for (var i = 0; i < a.length; i++) {
            a[i] = a[i + 1]
        }
        // 经过上述循环之后, 数组中 [0] 原本的值已经被替换了
        // 但是最后一个位置多了一个 undefined, 那么此时只需要删除数组末尾的值就可以了
        a.length -= 1
    
        // 3. 返回之前暂存的首位内容
        return temp
    }
    var res = shift(arr)
    console.log(arr);
    
    

• reverse; sort; splice; indexOf;
  • reverse
    • 语法: 数组名.reverse()
    • 作用: 反转数组
    • 返回值: 反转后的数组

            var arr = [1, 2, 3, 4, 5, 6]
    // console.log('原数组: ', arr)
    // console.log('调用方法后的返回值: ', arr.reverse())
    // console.log('调用方法后数组: ', arr)
    
    // 自定义函数
    function reverse(a) {
        /**
         *  1. 交换数组内部元素的位置, 第一个和最后一个交换, 第二个和倒数第二个交换
         * 
         *      第 1 轮循环     i === 0
         *          var temp = a[i]         var temp = a[0]         temp === 1
         *          a[i] = a[a.length - 1 - i]          a[0] = a[a.length - 1 - 0]      a[0] = 6
         *          a[a.length - 1 - i] = temp          a[a.length - 1 - i] = 0         a[5] = 0
         * 
         *          所以第一轮循环 是将 第一个位置的值  和  数组最后一个位置的值 位置上进行了一个交换
         * 
         *      第 2 轮循环     i === 1
         *              ......
         * 
         *      第 3 轮循环     i === 2
         *              ......
         * 
         *      第 4 轮循环     i === 3
         *              ......
        */
        for (var i = 0; i < a.length / 2; i++) {
            var temp = a[i];
            a[i] = a[a.length - 1 - i]
            a[a.length - 1 - i] = temp
        }
    
    
        // 2. 将反转完毕的数组, 返回出去
        return a
    }
    
    var res = reverse(arr)
    console.log(res);
    

  • sort
    • 语法: 数组名.sort(); 数组名.sort((a, b) => a - b); 数组名.sort((a, b) => b - a)
      • 不传参数: 会将数据转换为字符串后, 一位一位的对比
      • 回调函数内进行 a - b, 那么会按照数字大小升序排序
      • 回调函数内进行 b - a, 那么会按照数字大小降序排序
    • 作用: 根据参数对数组数据实现排序
    • 返回值: 排序后的数组
  • splice
    • 语法: 数组名.splice(开始索引, 多少个); 数组名.splice(开始索引, 多少个, 插入数据1, 插入数据2, ...)
    • 作用: 截取数组部分内容, 并选择性插入内容
    • 返回值: 截取出来的部分内容组成的新数组

     /**
     *  数组塌陷
    */
    
    var arr = [1, 2, 3, 4, 5]
    //         0  1  2  3  4
    
    for (var i = 0; i < arr.length; i++) {
        arr.splice(i, 1)
        //解决数组塌陷问题
        i--
    }
    
    console.log(arr)    // []
    
    /**
     *  第 1 轮循环 i === 0     arr === [1, 2, 3, 4, 5]
     *      arr.splice(i, 1)    其实相当于 把数组 [0] 的内容删掉        [2, 3, 4, 5]
     *      i--                     i === -1
     *      第 1 轮循环结束
     * 
     * 
     *  第 2 轮循环 i === 0     arr === [2, 3, 4, 5]
     *      arr.splice(i, 1)    其实相当于 把数组 [0] 的内容删掉        [3, 4, 5]
     *      i--                     i === -1
     *      第 2 轮循环结束
     * 
     *  ........
    */
    
    // for (var i = 0; i < arr.length; i++) {
    //     arr.splice(i, 1)
    // }
    
    // console.log(arr)    // [2, 4]
    
    /**
     *  第 1 轮循环 i === 0     arr === [1, 2, 3, 4, 5]
     *      arr.splice(i, 1)    其实相当于 把数组 [0] 的内容删掉        [2, 3, 4, 5]
     *      第 1 轮循环结束
     * 
     * 
     *  第 2 轮循环 i === 1     arr === [2, 3, 4, 5]
     *      arr.splice(i, 1)    其实相当于 把数组 [1] 的内容删掉        [2, 4, 5]
     *      第 2 轮循环结束
     * 
     *  第 3 轮循环 i === 2     arr === [2, 4, 5]
     *      arr.splice(i, 1)    其实相当于 把数组 [2] 的内容删掉        [2, 4]
     *      第 3 轮循环结束
     * 
     *  第 4 轮循环 i === 3
     *      循环执行的条件为 i < arr.length         i < 2
     *      条件不成立, 循环到此结束
    */
    

  • indexOf
    • 语法: 数组名.indexOf(要检查的数据); 数组名.indexOf(要检查的数据, 开始索引)
    • 作用: 从前到后检查该数据第一次在该数组内出现的索引位置
    • 返回值: 如果在数组内找到了该数据, 那么会返回该数据第一次出现的索引位置, 没找到返回 -1