/*
        方法的作用和含義
        方法的實參(類型和含義)
        方法的返回值
        原來的數組是否會發生改變
        */
        // 一.數組的增刪改查方法
        // 以下方法都會修改原有的數組
        // 1.push
        /* push: 向數組末尾增加內容
         @params: 多個任意類型
         @return：返回新增后的數組長度
        */
        let arr = [1, 2];
        let res = arr.push(3, 'qq')
        console.log(res) // => 4
        console.log(arr) // => [1, 2, 3, "qq"]
        // 也可以向數組末尾追加內容，這是基于原生JS操作鍵值對的方法
        arr[arr.length] = 4
        // 2. unshift
        /* unshift: 向數組開始位置增加內容
         @params: 多個任意類型
         @return：返回新增后的數組長度
        */
        let arr1 = [1, 2];
        let res1 = arr1.unshift(3, 'qq')
        console.log(res1) // => 4
        console.log(arr1) // => [3, "qq", 1, 2]
        // 基于原生ES6展開運算符，把原生的arr1克隆一份，
        // 在新的數組中創建第一項，其余的內容使用原生arr1中的內容
        // 實現了向數組第一位增加內容，
        // 其實這是根據數組創建了一個新數組
        arr1 = [5, ...arr1]
        console.log(arr1) // => [5, 3, "qq", 1, 2]

        // 3.shift
        /* shift: 刪除數組的第一項
         @params
         @return：刪除的那一項
        */
        let arr2 = [12, 13, 14, 15];
        let res2 = arr2.shift()
        console.log(res2) // => 12
        console.log(arr2) // => [13,14,15]

        // 基于原生JS中的delete，把數組當做普通的對象
        // 確實可以刪除掉某一項內容
        // 但是不會影響數組本身的結構特點（length長度不變）
        // 在項目中嚴禁這樣使用
        delete arr2[0]
        console.log(arr2) //[empty, 14, 15]  
        //     1: 14
        //     2: 15
        //     length: 3

        //4. pop
        /* pop: 刪除數組的最后一項
         @params
         @return：刪除的那一項
        */
        let arr3 = [12, 13, 14, 15];
        let res3 = arr3.pop()
        console.log(res3) // => 15
        console.log(arr3) // => [12，13,14]
        // 基于原生JS讓數組長度減1，默認刪除數組中最后一位
        arr3.length--
        console.log(arr3) // => [12，13]

        //5. splice
        /* splice: 實現數組的增刪改
         @params: (參數都是數字)
            n: 從索引n開始刪除到末尾
            n,m: 從索引n開始刪除m個元素
            n,m,x: 從索引n開始刪除m個元素，用x占用刪除的部分（修改）
            n,0,x: 從索引n開始，一個也不刪,把x放到索引n的前面（增加）
         @return：把刪除的部分作為一個新數組返回
        */
        //  (1)刪除
        let arr4 = [10, 11, 12, 13, 14, 15, 16, 17, 18, 19];
        let res4 = arr4.splice(2, 4)
        console.log(res4) // => [12,13,14,15]
        console.log(arr4) // => [10, 11, 16, 17, 18, 19]
        console.log(arr4.splice(0)) // => []  清空數組
        // 刪除第一項
        arr4.splice(0, 1)
        // 刪除數組的最后一項
        arr4.splice(arr4.length - 1)
        // 刪除第2項至倒數第二項的值
        arr4 = arr4.splice(1, arr4.length - 2)
        console.log(arr4)
        //  (2)增加和修改
        let arr5 = [10, 11, 12, 13, 14, 15];
        let res5 = arr5.splice(1, 2, 'AA', 'BB')
        console.log(res5) // => [11, 12]
        console.log(arr5) // => [10, "AA",'BB', 13, 14, 15]
        arr5.splice(3, 0, 'CCC')
        console.log(arr5) // => [10, "AA", "BB", "CCC", 13, 14, 15] 
        // 向數組末尾追加
        arr5.splice(arr5.length, 0, '16')
        console.log(arr5) // => [10, "AA", "BB", "CCC", 13, 14, 15, "16"]
        // 向數組中首位添加
        arr5.splice(0, 0, 9)
        console.log(arr5) // => [9, 10, "AA", "BB", "CCC", 13, 14, 15, "16"]

        // 二、數組的查詢和拼接
        // 以下方法，原數組不會改變
        //1. slice  查詢
        /* slice: 實現數組的查詢 查找到內容組成新數組返回
         @params: n,m 從索引n開始，找到索引m（不包含m）的地方
         只傳n：從n開始找到末尾
         @return：把找到的部分作為一個新數組返回 原數組不變
        */
        let arr6 = [10, 11, 12, 13, 14, 15, 16];
        let res6 = arr6.slice(1, 3)
        console.log(res6) // => [11,12]
        /* 注意：(1)當n,m為負數 / n>m / n,m都為小數/都為非有效數字/ n大于數組長度,返回 []
                (2)當n為正，m為負數，則向左查找
                (3)當n為小數/非有效數字，m為正數，從0開始向右查找
                (4)當n小于數組長度，m大于數組長度，則返回從n開始到數組末尾
    
        */
        // 2.concat 數組拼接
        /* concat: 實現數組的拼接 
          @params: 傳多個任意類型值，
          @return：返回拼接后的新數組，原數組不變
         */
        let ary1 = [10, 11, 12, 13];
        let ary2 = [14, 15, 16];
        let res = ary1.concat(ary2, 'AAA', 'BBB', [20, 30])
        console.log(res) // => [10, 11, 12, 13, 14, 15, 16, "AAA", "BBB", 20, 30]

        // 三、把數組轉成字符串
        // 原有數組不變
        // 1.toString
        /* toString: 把數組轉成字符串
         @params: 
         @return：返回轉換后的字符串，每一項用逗號分隔。 (原數組不變)
        */
        let ary3 = [10, 11, 12, 13]
        let res = ary3.toString()
        console.log(res) // => '10,11,12,13'
        // 2.join 
        /* join: 把數組轉成字符串
         @params: 指定的分隔符(字符串格式) 默認是逗號
         @return：返回轉換后的字符串，每一項用指定分隔符分隔。 (原數組不變)
        */
        let ary3 = [10, 11, 12, 13]
        let res = ary3.join('-')
        console.log(res) // => '10-11-12-13'
        console.log(ary3.join('')) // => '10111213'
        console.log(ary3.join('+')) // => '10+11+12+13'
        // 數組求和
        console.log(eval(ary3.join('+'))) // => 46 eval把字符串變為js表達式執行

        // 四、檢測數組中是否包含某一項
        // 1.indexOf / lastIndexOf  (在IE6~8不兼容)
        /* indexOf / lastIndexOf: 檢測當前項在數組中第一次 / 最后一次出現位置的索引值
         @params: 要檢索的內容
         @return：該項出現位置的索引值，如果索引中沒有該項返回結果-1  (原數組不變)
        */
        let ary4 = [10, 11, 12, 13, 19, 12]
        console.log(ary4.indexOf(12)) // => 2
        console.log(ary4.lastIndexOf(12)) // => 5
        // 驗證是否包含某個值
        if (ary4.indexOf('AA') === -1) {
            console.log('不包含')
        }
        /*****  ES6新提供的 includes: 如果包含，返回true  ******/
        console.log(ary4.includes(10)) // => true

        // 五、數組的排序
        //1.reverse
        /* reverse: 數組倒過來
        @params:
        @return：返回新數組  (原數組改變)
       */
        let array = [10, 11, 12, 13, 19, 12]
        console.log(array.reverse()) // => [12, 19, 13, 12, 11, 10]

        //1.sort
        /* sort: 數組排序 默認按照每一項對應位比較大小排序的
        @params: 可以沒有，也可以是個函數 
        @return：返回排序后的新數組  (原數組改變)
       */
        let array1 = [10, 21, 12, 23, 19, 12, 31, 8]
        console.log(array1.sort()) // => [10, 12, 12, 19, 21, 23, 31, 8]
        // 傳個函數 
        console.log(array1.sort((m, n) => m - n)) //升序 => [8, 10, 12, 12, 19, 21, 23, 31]
        console.log(array1.sort((m, n) => n - m)) //降序 => [31, 23, 21, 19, 12, 12, 10, 8]


        // 六、遍歷數組中每一項
        // forEach,map,filter,find,reduce,some,every ...
        // 1.forEach
        /* forEach: 遍歷數組中的每一項內容
           @params: 回調函數 
           @return：(原數組不變)
        */
        let array2 = [10, 21, 12, 23, 19, 31, 8]
        array2.forEach((item, index) => {
            // index:索引值 0，1，2...
            // item:當前索引對應的值
            console.log('index:' + index, 'item:' + item)
        })

        // 七、數組去重

        let array2 = [1, 2, 1, 3, 2, 3, 5]
        // 方法一：循環數組中的每一項，每拿到一項添加到一個新數組里，
        //添加之前驗證該項在新數組中是否存在，若不存在則添加，存在則跳過
        let newArr = []
        for (let index = 0; index < array2.length; index++) {
            const element = array2[index];
            if (!newArr.includes(element)) {
                newArr.push(element)
            }
        }
        console.log(newArr) // => [1, 2, 3, 5]
        //forEach
        let newArr1 = []
        array2.forEach(item => {
            if (!newArr1.includes(item)) {
                newArr1.push(item)
            }
        })
        console.log(newArr1) // => [1, 2, 3, 5]

        //方案二：分別拿出數組中的每一項和他后面的每一項依次做比較，如果相等，則刪除
        // 數組塌陷問題
        for (var i = 0; i < array2.length; i++) {
            var item = array2[i];
            // 當前項后面的內容組成一個新數組
            // var itemBack = array2.slice(i+1)
            for (var j = i+1; j < array2.length; j++) {
                var itemBack = array2[j];
                // 如果item等于itemBack 刪除itemBack
                if (itemBack === item) {
                    array2.splice(j,1)
                    j-- // 解決數組塌陷問題。刪除后j后面的每一項索引都提前了一位
                }
            }
        }
        console.log(array2) // => [1, 2, 3, 5]

        // 方案三：
        // 1.創建一個新對象
        let obj = {}
        // 2.循環數組中的每一項，把每一項的值作為對象的key和value進行存儲
        for (let i = 0; i < array2.length; i++) {
            let item = array2[i];
            if (obj[item] !== undefined) {
                // 基于splice實現刪除性能不好，當前項被刪除后，
                // 后面每一項的索引都會向前移動一位，如果后面數據量大，會影響性能
                // array2.splice(i,1)
                array2[i] = array2[array2.length-1]
                array2.length--
                i--
                continue
            }  
            obj[item] = item
        }
        console.log(array2) // => [1, 2, 3, 5]

        // 3.數組倒著取值，解決數組塌陷問題
        let obj = {}
        let array2 = [1, 2, 1, 3, 2, 3, 5]
        for (let i = array2.length - 1; i >= 0; i--) {
            let item = array2[i];
            if (obj[item] !== undefined) {
                array2.splice(i,1)
                continue
            }  
            obj[item] = item
        }
        console.log(array2) // => [1, 2, 3, 5]

        // 4.正則去重
        let array3 = [1,2,3,4,2,3,1,4]
        // 先排序（從小到大）
        array3.sort((m,n) => m-n)
        let str = array3.join('@') + '@'
        let reg = /(\d+@)\1*/g
        array3 = []
        str.replace(reg,(n,m) => {
            m = Number(m.slice(0,m.length - 1))
            array3.push(m)
        })
        console.log(array3) // => [1, 2, 3, 4]
        // 5.基于ES6的Set去重
        let array4 = [1,2,3,4,2,3,1,4]
        array4 = [...new Set(array4)]
        console.log(array4) // => [1, 2, 3, 4]