javascript 總結(Array篇)

  • 1.toString: 返回以數組中的每一個值的字符串形式拼接而成的一個以逗號分割的字符串javascript

    toStringArr = [1, 2, 3, 4, 5, 6]
    console.log(toStringArr.toString())
    // -> 1,2,3,4,5,6

  • 2.valueOf: 返回數組對象的原始值。返回的仍是數組java

    valueOfArr = [1, 2, 3, 4, 5, 6]
    console.log(valueOfArr.valueOf())
    // -> [1, 2, 3, 4, 5, 6]

  • 3.join: 經過指定的分隔符進行分隔並返回一個字符串git

    var arr = [1, 2, 3, 4, 5, 6]
    var joinArr = arr.join('&')
    console.log('join:' + joinArr)
    // -> join:1&2&3&4&5&6

  • 4.push: 向數組的末尾添加一個或更多元素,並返回新的長度github

    var pushArr = [1, 2, 3, 4, 5, 6]
    pushArr.push(7)
    console.log(pushArr)
    // -> [1, 2, 3, 4, 5, 6, 7]

  • 5.pop: 刪除數組的最後一個元素並返回刪除的元素, 若是數組爲空就返回undefined數組

    var popArr = [1, 2, 3, 4, 5, 6]
    var popEle = popArr.pop()
    console.log(popEle, popArr)
    // -> 6,  [1, 2, 3, 4, 5]

  • 6.shift: 刪除並返回數組的第一個元素, 若是數組爲空,則shift() 方法不進行任何操做,返回undefineddom

    var shiftArr = [1, 2, 3, 4, 5, 6]
    var shiftEle = shiftArr.shift()
    console.log(shiftEle, shiftArr)
    // -> 1,  [2, 3, 4, 5, 6]

  • 7.unshift: 向數組的開頭添加一個或更多元素,並返回新的長度函數

    var unshiftArr = [1, 2, 3, 4, 5, 6]
    unshiftArr.unshift(0)
    console.log(unshiftArr)
    // -> [0, 1, 2, 3, 4, 5, 6]

  • 8.reverse: 反轉數組的元素順序測試

    var reverseArr = [1, 2, 3, 4, 5, 6]
    reverseArr.reverse()
    console.log(reverseArr)
    // -> [6, 5, 4, 3, 2, 1]

  • 9.sort: 對數組的元素進行排序this

    // a. 
        var sortArr1 = [1, 3, 5, 2, 7, 6]
        sortArr1.sort()
        console.log(sortArr1)
        // -> [1, 2, 3, 5, 6, 7]
    // b.  由於sort排序是從左至右比較,只要其中一個比較出告終果,就直接返
        var sortArr2 = [1, 3, 19, 5, 17, 6]
        sortArr2.sort()
        console.log(sortArr2)
        // -> [1, 17, 19, 3, 5, 6]
    // c: 封裝sort
        function sort(arr, type) {
            type = type || 1
            return arr.sort( (a, b) => {
                switch(type) {
                    case 1: // 從小到大
                        return a - b
                    case 2: // 從大到小
                        return b - a
                    case 3: // 隨機排序
                        return Math.random() - 0.5
                    default:
                        return arr
                }
            })
        }
        var sortArr3 = [1, 3, 19, 5, 17, 6]
        sort(sortArr3)
        console.log(sortArr3)

  • 10.concat:鏈接兩個或更多的數組,並返回結果code

    var concat1 = [1, 2, 3],
    concat2 = [4, 5, 6]
    concatArr = concat1.concat(concat2)
    console.log(concatArr)
    // -> [1, 2, 3, 4, 5, 6]

  • 11.slice(start, end): 選取數組的的一部分,並返回一個新數組, start必須,end可選

    var sliceArr = [1, 2, 3, 4, 5, 6]
    var sliceNewArr = sliceArr.slice(1, -1) // 截取第二個 到 倒數第二個
    console.log(sliceNewArr)
    // -> [2, 3, 4, 5]

  • 12.splice(index, howmany, item1,.....,itemX): 從數組中添加或刪除元素

    /*
        index:  必需。規定從何處添加/刪除元素。 該參數是開始插入和(或)刪除的數組元素的下標,必須是數字
        howmany: 必需。規定應該刪除多少元素。必須是數字,但能夠是 "0"。 若是未規定此參數,則刪除從 index 開始到原數組結尾的全部元素。
        item1,.....,itemX: 可選。要添加到數組的新元素
    */
    var spliceArr1 = [1, 2, 3, 4, 5, 6]
    spliceArr1.splice(2, 2, 10, 12) // 從下標爲2 的地方開始刪除 後面的兩個元素, 並在這個地方插入 10,12兩個元素 
    console.log(spliceArr1)
    // -> [1, 2, 10, 12, 5, 6]
    
    var spliceArr = [1, 2, 3, 4, 5, 6]
    spliceArr.splice(2, 0, 10, 12) // 當須要刪除的元素爲0, 至關於在這個位置插入元素
    console.log(spliceArr)
    // -> [1, 2, 10, 12, 3, 4, 5, 6]

  • 13.copyWithin(target, start, end): 從數組的指定位置拷貝元素到數組的另外一個指定位置中

    /*
        target: 必需。複製到指定目標索引位置。
        start: 必需。元素複製的起始位置。
        end: 可選。中止複製的索引位置 (默認爲 array.length)
    */
    var copyWithinArr = [1, 2, 3, 4, 5, 6]
    copyWithinArr.copyWithin(1, 2, 4)
    console.log(copyWithinArr)
    // -> [1, 3, 4, 4, 5, 6]

  • 14.fill(value, start, end): 用於將一個固定值替換數組的元素

    /*
        value: 必需。填充的值。
        start: 可選。開始填充位置。
        end: 可選。中止填充位置 (默認爲 array.length)
    */
    var fillArr = [1, 2, 3, 4, 5, 6]
    fillArr.fill(9, 2, 4)
    console.log(fillArr)
    // -> [1, 2, 9, 9, 5, 6]

  • 15.includes(searchElement, fromIndex):用來判斷一個數組是否包含一個指定的值,若是是返回 true,不然false

    var includesArr = [1, 2, 3, 4, 5, 6]
    var includes1 = includesArr.includes(3)
    var includes2 = includesArr.includes(10)
    console.log(includes1, includes2)
    // -> true, false

  • 16.indexOf(item,start):可返回某個指定的字符串值在字符串中首次出現的位置

    var indexOfArr = [1, 2, 3, 4, 3, 6]
    var indexOfEle = indexOfArr.indexOf(3)
    console.log(indexOfEle)
    // -> 2

  • 17.lastIndexOf(item,start):返回一個指定的字符串值最後出現的位置,在一個字符串中的指定位置從後向前搜索

    var lastIndexOfArr = [1, 2, 3, 4, 3, 6]
    var lastIndexOfEle = lastIndexOfArr.lastIndexOf(3)
    console.log(lastIndexOfEle)
    // -> 4

  • 18.find(function(currentValue, index, arr),thisValue): 返回傳入一個測試條件(函數)符合條件的數組第一個元素

    // function(currentValue, index, arr):
    //     a. currentValue: 必需。當前元素
    //     b. index: 可選。當前元素的索引值
    //     c. arr: 可選。當前元素所屬的數組對象
    // thisValue: 可選。 傳遞給函數的值通常用 "this" 值。 若是這個參數爲空, "undefined" 會傳遞給 "this" 值
    
    var findArr = [1, 2, 3, 4, 5, 6]
    var findEle = findArr.find( function(currentValue, index, arr) {
        return currentValue >= 4
    })
    console.log(findEle)

  • 19.findIndex(function(currentValue, index, arr),thisValue): 返回符合測試條件的第一個數組元素索引,若是沒有符合條件的則返回 -1

    // function(currentValue, index, arr):
    //     a. currentValue: 必需。當前元素
    //     b. index: 可選。當前元素的索引值
    //     c. arr: 可選。當前元素所屬的數組對象
    // thisValue: 可選。 傳遞給函數的值通常用 "this" 值。 若是這個參數爲空, "undefined" 會傳遞給 "this" 值
    
    var findIndexArr = [1, 2, 3, 4, 5, 6]
    var findIndexEle = findIndexArr.findIndex( function(currentValue, index, arr) {
        return currentValue >= 4
    })
    console.log(findIndexEle)

  • 20.forEach(function(currentValue, index, arr), thisValue): 用於調用數組的每一個元素,並將元素傳遞給回調函數。沒有返回值

    // function(currentValue, index, arr):
    //     a. currentValue: 必需。當前元素
    //     b. index: 可選。當前元素的索引值
    //     c. arr: 可選。當前元素所屬的數組對象
    // thisValue: 可選。 傳遞給函數的值通常用 "this" 值。 若是這個參數爲空, "undefined" 會傳遞給 "this" 值
    
    
    var forEachArr = [1, 2, 3, 4, 5, 6]
    forEachArr.forEach( function(currentValue, index, arr){
        console.log(currentValue)
    })
    // -> 依次打印 1 2 3 4 5 6, 沒有返回值

  • 21.map(function(currentValue, index, arr), thisValue): 返回一個新數組,數組中的元素爲原始數組元素調用函數處理後的值

    // function(currentValue, index, arr):
    //     a. currentValue: 必需。當前元素
    //     b. index: 可選。當前元素的索引值
    //     c. arr: 可選。當前元素所屬的數組對象
    // thisValue: 可選。 傳遞給函數的值通常用 "this" 值。 若是這個參數爲空, "undefined" 會傳遞給 "this" 值
    
    
    var mapArr = [1, 2, 3, 4, 5, 6]
    var mapNewArr = mapArr.map( function(currentValue, index, arr){
        // console.log(currentValue)
        return currentValue*2
    })
    console.log(mapNewArr)
    // -> [2, 4, 6, 8, 10, 12]

  • 22.reduce(function(total, currentValue, index, arr), thisValue): 接收一個函數做爲累加器,數組中的每一個值(從左到右)開始縮減,最終計算爲一個值

    // function(currentValue, index, arr):
    //     a. currentValue: 必需。當前元素
    //     b. index: 可選。當前元素的索引值
    //     c. arr: 可選。當前元素所屬的數組對象
    //     d: total:   必需。初始值, 或者計算結束後的返回值。
    // thisValue: 可選。 傳遞給函數的值通常用 "this" 值。 若是這個參數爲空, "undefined" 會傳遞給 "this" 值
    
    
    var reduceArr = [1, 2, 3, 4, 5, 6]
    var reduceNewArr = reduceArr.reduce( function(total, currentValue, index, arr){
        return total - currentValue
    })
    console.log(reduceNewArr)
    // -> 19

  • 23.reduceRight(function(total, currentValue, index, arr), thisValue): 接收一個函數做爲累加器,數組中的每一個值(從右到左)開始縮減,最終計算爲一個值

    // function(currentValue, index, arr):
    //     a. currentValue: 必需。當前元素
    //     b. index: 可選。當前元素的索引值
    //     c. arr: 可選。當前元素所屬的數組對象
    //     d: total:   必需。初始值, 或者計算結束後的返回值。
    // thisValue: 可選。 傳遞給函數的值通常用 "this" 值。 若是這個參數爲空, "undefined" 會傳遞給 "this" 值
    
    
    var reduceRightArr = [1, 2, 3, 4, 5, 6]
    var reduceRightNewArr = reduceRightArr.reduceRight( function(total, currentValue, index, arr){
        return total - currentValue
    })
    console.log(reduceRightNewArr)
    // -> -9

  • 24.some(function(currentValue, index, arr), thisValue): 若是有一個元素知足條件,則表達式返回true , 剩餘的元素不會再執行檢測。若是沒有知足條件的元素,則返回false

    // function(currentValue, index, arr):
    //     a. currentValue: 必需。當前元素
    //     b. index: 可選。當前元素的索引值
    //     c. arr: 可選。當前元素所屬的數組對象
    // thisValue: 可選。 傳遞給函數的值通常用 "this" 值。 若是這個參數爲空, "undefined" 會傳遞給 "this" 值
    
    
    var someArr = [1, 2, 3, 4, 5, 6]
    var someEle1 = someArr.some( function(currentValue, index, arr){
        return currentValue > 4
    })
    var someEle2 = someArr.some( function(currentValue, index, arr){
        return currentValue > 6
    })
    console.log(someEle1, someEle2)
    // -> true, false

  • 25.every(function(currentValue, index, arr), thisValue): 若是數組中檢測到有一個元素不知足,則整個表達式返回 false ,且剩餘的元素不會再進行檢測。若是全部元素都知足條件,則返回 true

    // function(currentValue, index, arr):
    //     a. currentValue: 必需。當前元素
    //     b. index: 可選。當前元素的索引值
    //     c. arr: 可選。當前元素所屬的數組對象
    // thisValue: 可選。 傳遞給函數的值通常用 "this" 值。 若是這個參數爲空, "undefined" 會傳遞給 "this" 值
    
    
    var everyArr = [1, 2, 3, 4, 5, 6]
    var everyEle1 = everyArr.every( function(currentValue, index, arr){
        return currentValue > 0
    })
    var everyEle2 = everyArr.every( function(currentValue, index, arr){
        return currentValue > 1
    })
    console.log(everyEle1, everyEle2)
    // -> true, false

  • 26.filter(function(currentValue, index, arr), thisValue):建立一個新的數組,新數組中的元素是經過檢查指定數組中符合條件的全部元素

    // function(currentValue, index, arr):
    //     a. currentValue: 必需。當前元素
    //     b. index: 可選。當前元素的索引值
    //     c. arr: 可選。當前元素所屬的數組對象
    // thisValue: 可選。 傳遞給函數的值通常用 "this" 值。 若是這個參數爲空, "undefined" 會傳遞給 "this" 值
    
    
    var filterArr = [1, 2, 3, 4, 5, 6]
    var filterNewArr = filterArr.filter( function(currentValue, index, arr){
        return currentValue > 2
    })
    console.log(filterNewArr)
    // -> [3, 4, 5, 6]

  • 27.from: 將類數組對象和可遍歷對象轉化爲數組

    fromObj = {
      0: '0',
      1: '1',
      3: '3',
      length:4
    }
    arrayArr = Array.from(fromObj)
    console.log(arrayArr)
    // -> ["0", "1", undefined, "3"]

  • 28.of: 建立一個具備可變數量參數的新數組實例,而不考慮參數的數量或類型

    Array.of(7);       // -> [7] 
        Array.of(1, 2, 3); // -> [1, 2, 3]
    
        Array(7);          // -> [ , , , , , , ]
        Array(1, 2, 3);    // -> [1, 2, 3]

博客地址:javascript 總結(Array篇)
github: javascript 總結(Array篇)
相關文章
相關標籤/搜索