javascript中Array常用方法總結

harriszh 發布于2019-08-22 15:42 / 557人閱讀

摘要：函數接受個參數前一個值，當前值，項索引，數組本身。更多數組方法請看

js內置對象之Array

一，會改變原數組 1.移除數組末尾最后一項.pop()

返回刪除的元素

如果你在一個空數組上調用 pop()，它返回 undefined

    let word = ["a", "b", "c", "d"];  
    let newArr = word.pop();  
    console.log(word);      //["a", "b", "c"]  
    console.log(newArr);    //d  
  
    let nullArr = [];  
    console.log(nullArr.pop()); //undefined

2.在數組末尾添加一個或多個元素.push()

返回修改后數組長度

    let word = ["a", "b", "c", "d"];  
    let newArr = word.push("e","f");  
    console.log(word);      //["a", "b", "c", "d", "e", "f"]  
    console.log(newArr);    //6

3.移除數組第一項.shift()

返回移除的元素

    let word = ["a", "b", "c", "d"];  
    let newArr = word.shift();  
    console.log(word);      //["b", "c", "d"]  
    console.log(newArr);    //a

4.在數組頭部添加一個或多個元素.unshift()

返回修改后數組長度

    let word = ["a", "b", "c", "d"];  
    let newArr = word.unshift("11","22");  
    console.log(word);      //["11", "22", "a", "b", "c", "d"]  
    console.log(newArr);    //6

5.對數組元素排序.sort()

返回排序后的數組

默認排序順序是根據字符串Unicode碼點

    let fruit = ["cherries", "apples", "bananas"];  
    console.log(fruit.sort());       // ["apples", "bananas", "cherries"]  
      
    let scores = [1, 10, 21, 2];   
    console.log(scores.sort());  
    // [1, 10, 2, 21]  
    // 注意10在2之前,  
    // 因為在 Unicode 指針順序中"10"在"2"之前  
  
    let things = ["word", "Word", "1 Word", "2 Words"];  
    console.log(things.sort());   
    // ["1 Word", "2 Words", "Word", "word"]  
    // 在Unicode中, 數字在大寫字母之前,  
    // 大寫字母在小寫字母之前.  
  
    function compare(a, b) {  
        if(a < b) {  
            return -1;  
        }else if(a > b) {  
            return 1;  
        }else {  
            return 0;  
        }  
    }  
    let num = [1, 10, 21, 2];  
    console.log(num.sort(compare)); //[1, 2, 10, 21]

6.顛倒數組元素.reverse()

返回顛倒后的數組

    let word = ["a", "b", "c", "d"];  
    let newArr = word.reverse();  
    console.log(word);      //["d", "c", "b", "a"]  
    console.log(newArr);    //["d", "c", "b", "a"]

7.刪除或插入元素.splice()

返回數組刪除的項

沒有刪除的項，返回空數組

    var word = ["a", "b", "c", "d"];  
    //刪除,前閉后開  
    var newArr = word.splice(0,2);  
    console.log(word);      //["c", "d"]  
    console.log(newArr);    //["a", "b"]  
  
    //插入,當前數組索引1處插入hello  
    var newArr = word.splice(1,0,"hello");  
    console.log(word);      //["c", "hello", "d"]  
    console.log(newArr);    //[]  
  
    //替換  
    var newArr = word.splice(1,1,"world");  
    console.log(word);      //["c", "world", "d"]  
    console.log(newArr);    //["hello"]

二，不會改變原數組 1.合并兩個或多個數組.concat()

返回新數組

    let word = ["a", "b", "c", "d"];  
    let word2 = ["hello","world"];  
    let newArr = word.concat(word2);  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr);    //["a", "b", "c", "d", "hello", "world"]

2.將數組所有元素連接成一個字符串.join()

返回連接后的字符串

    let word = ["a", "b", "c", "d"];  
    let newArr = word.join("---");  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr);    //a---b---c---d

3.截取數組元素到新數組中.slice()

返回新數組

    let word = ["a", "b", "c", "d"];  
    //原數組索引為1開始截取后面所有元素  
    let newArr = word.slice(1);  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr);    //["b", "c", "d"]  
      
    //截取原數組索引為1到3之間的元素，前閉后開  
    let newArr2 = word.slice(1,3);  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr2);    //["b", "c"]  
  
    //截取原數組倒數第三個元素與倒數第一個元素之間的元素，前閉后開  
    let newArr3 = word.slice(-3,-1);  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr3);    //[["b", "c"]

4.獲取查詢元素第一次出現的索引.indexOf()

找不到查詢元素，則返回-1

    let word = ["a", "b", "b", "c", "d"];  
    let index = word.indexOf("b");      //1,第一次出現b的索引值  
    let index2 = word.indexOf("hello"); //-1  
    console.log(index);  
    console.log(index2);

5.獲取查詢元素最后一次出現的索引.lastIndexOf()

找不到查詢元素，則返回-1

    let word = ["a", "b", "b", "c", "d"];  
    let index = word.lastIndexOf("b");      //2,最后一個b的索引值為2  
    let index2 = word.lastIndexOf("hello"); //-1  
    console.log(index);  
    console.log(index2);

6.toString()返回由數組每個元素的字符串形式拼接而成的以逗號分隔的字符串

    let word = ["a", "b", "b", "c", "d"];  
    let str = word.toString();      //a,b,b,c,d  
    console.log(str);

7.toLocaleString()返回一個字符串表示數組中的元素，更多了解查看MDN 三，迭代方法

每個方法接受含有三個參數的函數，三個參數為：數組中的項，元素索引，數組本身

1.every()，數組所有元素都滿足要求則返回true，否則返回false
2.some()，只要有滿足要求的就返回true
3.filter()，返回過濾后的結果數組
4.map()，返回在函數中處理過的數組
5.forEach()，遍歷整個數組

    var number = [1,2,3,4,5,6,7,8];  
    var res = number.every(function(item, index, array) {  
        return (item > 2);  
    })  
    console.log(res);   //false  
  
    var res = number.some(function(item, index, array) {  
        return (item > 2);  
    })  
    console.log(res);   //true  
  
    var res = number.filter(function(item, index, array) {  
        return (item > 2);  
    })  
    console.log(res);   //[3, 4, 5, 6, 7, 8]  
  
    var res = number.map(function(item, index, array) {  
        return (item * 2);  
    })  
    console.log(res);   //[2, 4, 6, 8, 10, 12, 14, 16]  
  
    var res = number.forEach(function(item, index, array) {  
        //執行某些操作 
    })

四，歸并方法

迭代數組所有項，構建最終返回值，每個方法接受兩個參數：調用的函數和作為歸并基礎的初始值。函數接受4個參數：前一個值，當前值，項索引，數組本身。函數返回的值都會作為第一個參數自動傳給下一項，第一次迭代從數組第二項開始，當前值為數組第二項

1.reduce()，從數組第一項開始遍歷到最后
2.reduceRight()，從數組最后一項開始遍歷到第一項

     /* 
        開始執行回調函數cur為2，prev為1， 
        第二次執行回調函數，在之前的基礎上加1 
        函數返回的值都會作為一個參數傳給下一項， 
        最后執行函數時就是28+8 
    */  
    var number = [1,2,3,4,5,6,7,8];  
    var res = number.reduce(function(prev, cur, index, array) {  
        return prev + cur;  
    })  
    console.log(res);   //1+2+3+4+5+6+7+8=36  
  
    var res = number.reduceRight(function(prev, cur, index, array) {  
        return prev + cur;  
    })  
    console.log(res);   //8+7+6+5+4+3+2+1=36

五，結束語

數組是除了函數對象之外在js中使用最多的數據類型，掌握一些數組中常用方法在使用js做開發時還是會有幫助的，而且有些面試中也會問到相關問題，比如數組操作方法中哪些會改變原數組，哪些不會。更多數組方法請看MDN

GPU云服務器云服務器 array方法方法總結使用方法總結 javascript學習總結

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/93669.html

（轉）JavaScrit常用數組算法總結

摘要：原文地址不管是在面試中還是在筆試中，我們都會被經常問到關于數組的一些算法，比方說數組去重數組求交集數組擾亂等等。今天抽點時間把中的一些常用的數組算法做一下總結，以方便大家面試筆試或者日常開發過程中用到。原文地址：http://www.cnblogs.com/front-... 不管是在面試中還是在筆試中，我們都會被經常問到關于javascript數組的一些算法，比方說數組去重、數組求...

warnerwu 2019-08-19 17:35 評論0 收藏0
「JavaScript」Array方法的詳細總結及常用數組操作(附完整示例)

摘要：數組索引只是具有整數名稱的枚舉屬性，并且與通用對象屬性相同。利用的解構賦值解構賦值尾遞歸優化遞歸非常耗內存，因為需要同時保存成千上百個調用幀，很容易發生棧溢出。而尾遞歸的實現，往往需要改寫遞歸函數，確保最后一步只調用自身。一.前言因為在工作當中，經常使用到js的數組，而其中對數組方法的使用也是很頻繁的，所以總是會有弄混或者概念不夠清晰的狀況，所以，寫下這篇文章整理一番,本文有對幾乎...

Alfred 2019-08-22 17:22 評論0 收藏0
JavaScript數組——常用數組方法匯總

摘要：本文記錄關于數組的一些常用方法，搜集總結。對于數組中的每個元素，都會調用函數一次。返回值是一個新數組，其中的每個元素均為關聯的原始數組元素的回調函數返回值。本文記錄關于js數組的一些常用方法，搜集總結。主要思路： 1. 方法功能是什么 2. 傳遞的參數是什么 3. 返回值是什么 4. 原來的數組是否改變第一組：關于數組的增加、刪除和修改 1.push 向數組末尾增加新的...

HollisChuang 2019-08-21 10:33 評論0 收藏0
JavaScript：對Object對象的一些常用操作總結

摘要：一可以用作對象的復制可以用作對象的合并注意目標對象自身也會改變。對象四返回一個數組，包括對象自身的不含繼承的所有可枚舉屬性不含屬性的鍵名。該方法返回被凍結的對象。方法判斷一個對象是否被凍結。 JavaScript對Object對象的一些常用操作總結。一、Object.assign() 1.可以用作對象的復制 var obj = { a: 1 }; var copy = Object....

馬龍駒 2019-08-23 12:46 評論0 收藏0
JavaScript-總結常用代碼書寫規范

摘要：函數聲明應該在作用域的頂層。數組和對象字面量用數組和對象字面量來代替數組和對象構造器。數組構造器很容易讓人在它的參數上犯錯。推薦對象構造器不會有類似的問題，但是為了可讀性和統一性，我們應該使用對象字面量。 javascript 代碼規范代碼規范我們應該遵循古老的原則：能做并不意味著應該做。全局命名空間污染總是將代碼包裹在一個立即的函數表達式里面，形成一個獨立的模塊。不推薦 va...

Berwin 2019-08-20 10:48 評論0 收藏0