JavaScript基礎之內置對象——Array數組

內置對象Array數組對象,爲我們提供了一些常用的方法,可以對數組進行一些常規操作。

數組中的常用方法

檢測是否爲數組

a.  instanceof  :標識符

arr instanceof Array   

              返回fales  arr不是數組對象

              返回true   arr是數組對象

b. Array.isArray(參數) 方法

              返回fales  arr不是數組對象

              返回true   arr是數組對象

        var obj = {};
        console.log(obj instanceof Array);
        console.log(Array.isArray(obj));

 

追加數組元素

push(要添加的元素) :在數組的末尾進行追加,可以添加一個或多個元素   返回值是增加元素後的新數組

unshift(要添加的元素):在數組的開頭添加元素,可以添加一個或多個元素   返回值是增加元素後的新數組

刪除數組元素

pop():刪除數組末尾的元素,一次只刪除一個元素,沒有參數,直接刪除  返回值是刪除後的新數組

shift():刪除數組開頭的元素,一次只刪除一個元素,沒有參數,直接刪除  返回值是刪除後的新數組

        var arr = [2, 4, 5, 22, 33, 10, 23];

        console.log(arr);
        // 對象:長度爲2  但是數組元素爲空
        // 使用對象創建數組,一個參數代表數組長度,多個參數代表數組中的元素
        var arr1 = new Array(2);
        // 長度爲2,但是數組元素爲2,3
        var arr2 = new Array(2, 3);


        // 2.添加、刪除數組元素
        // 添加:push(要添加的數組元素)  在元素的末尾添加一個或多個元素 返回值是:變化後的數組
        arr.push('pink', 10);
        console.log(arr);
        // unshift(要添加的數組元素)  在元素的開頭添加添加一個或多個元素 返回值是:變化後的數組
        arr.unshift('red', 25);
        console.log(arr);

        // 刪除:pop() 刪除數組中末尾的一個元素,一次只能刪除一個 沒有參數 返回值是:變化後的數組
        arr.pop();
        console.log(arr);
        // shift() 刪除數組中開頭的一個元素 無參數  返回值是:變化後的數組
        arr.shift();
        console.log(arr);

輸出結果:

判斷數組中是否含有該元素

arr.indexOf(ele)     

           返回值 : -1   表示arr中沒有ele元素

                             num   ele元素的索引號

           參數:ele 要查詢的元素

    var arr = [2, 6, 7, 9, 2, 3, 10, 25, 15, 3, 7];
    console.log(arr.indexOf(11));

此方法可以用作數組去重

             思路:新數組用來放置 去重後的元素

             遍歷舊數組,用舊數組中的元素去查找新數組的元素,如果新數組中沒有,把當前元素追加到新數組中

             如果已經存在則不追加。

             元素是否存在於數組中 用indexOf() 判斷  返回 -1 說明沒有該元素

             核心算法:新數組的indexOf() = -1 就一直往新數組中追加元素

數組去重: 

        var arr = [2, 6, 7, 9, 2, 3, 10, 25, 15, 3, 7];
        var newArr = [];
        for (var i = 0; i < arr.length; i++) {
            // 判斷舊數組元素是否存在新數組中,== -1 不存在時 ,則追加到新數組中
            if (newArr.indexOf(arr[i]) == -1) {
                newArr.push(arr[i]); // 追加
            }
        }
        console.log(arr);

        console.log(newArr);

輸出的結果是這樣的:

數組分隔符

就是數組元素輸出時,以什麼符合分隔。

// join(['符號']) 方法是數組轉字符串,默認以,分隔  [] 代表可選部分 可有也可沒有
        var arr = [2, 6, 7, 9, 2, 3, 10];
        console.log(arr.join());
        console.log(arr.join('-'));
        console.log(arr.join(' & '));

更新數組splice方法

         splice(start[,deleteCount[,items[,items1[,items2........]]) 方法通過刪除或替換現有元素或者原地添加新的元素來修改數組,

         並以數組形式返回被修改的內容。此方法會改變原數組

 

         參數:

         start: 指定修改的位置(從0開始)  可以爲負值  從數組的倒數第幾位

         deleteCount = 0: 原地添加新的元素來修改數組,並以數組形式返回被修改的內容。

         deleteCount:整數 表示要移除元素的個數  可選的

         items........: 要添加進數組的元素, 從start 位置開始。 如果不指定, 則 splice() 將只刪除數組元素

         方法的返回值:

         返回的是被刪除元素的數組

 

splice方法主要就是更新數組。刪除、替換或添加數組元素

var months = ['Jan', 'March', 'April', 'June'];
        // 添加元素
        // months.splice(0, 0, 'Feb'); // Jane(索引爲0 = start) 被替換成Feb 因爲 deleteCount是0 沒有要刪除的元素 添加元素Feb
        months.splice(1, 0, 'Feb'); // March(索引爲1 =  start) 被替換成Feb 因爲 deleteCount是0 沒有要刪除的元素
        console.log(months);
        // 刪除並替換元素  此時moths = ["Feb", "Jan", "March", "April", "June"];
        months.splice(4, 1, 'May'); // 把June刪除,換成May
        console.log(months); // 輸出:["Jan", "Feb", "March", "April", "May"];
        // 刪除不替換  此時 months = ["Jan", "Feb", "March", "April", "May"];

        // console.log(months.splice(1, 1)); // 輸出 含Feb 長度爲1的數組
        months.splice(1, 1);
        console.log(months); // 輸出:["Jan", "March", "April", "May"];

        months.splice(2); // 從第2位開始刪除所有元素
        console.log(months);

輸出結果:

slice方法

          arr.slice([begin[, end]])   slice 不會修改原數組,只會返回一個淺複製了原數組中的元素的一個新數組。

        // 參數   取區間【begin,end)  就是取不到end的值,可以取到begin的值

        // begin 可選

        // 提取起始處的索引( 從 0 開始), 從該索引開始提取原數組元素。

        // 如果該參數爲負數, 則表示從原數組中的倒數第幾個元素開始提取, slice(-2) 表示提取原數組中的倒數第二個元素到最後一個元素( 包含最後一個元素)。

        // 如果省略 begin, 則 slice 從索引 0 開始。

        // 如果 begin 大於原數組的長度, 則會返回空數組。

        // end 可選

        // 提取終止處的索引( 從 0 開始), 在該索引處結束提取原數組元素。 slice 會提取原數組中索引從 begin 到 end 的所有元素( 包含 begin, 但不包含 end)。

        // slice(1, 4) 會提取原數組中從第二個元素開始一直到第四個元素的所有元素( 索引爲 1, 2, 3 的元素)。

        // 如果該參數爲負數, 則它表示在原數組中的倒數第幾個元素結束抽取。 slice(-2, -1) 表示抽取了原數組中的倒數第二個元素到最後一個元素( 不包含最後一個元素, 也就是隻有倒數第二個元素)。

        // 如果 end 被省略, 則 slice 會一直提取到原數組末尾。

        // 如果 end 大於數組的長度, slice 也會一直提取到原數組末尾。

舉例: 

        var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'];
        var citrus = fruits.slice(1, 3);
        // 輸出 ['Orange', 'Lemon']
        console.log(citrus);
        var citrus2 = fruits.slice();
        console.log(citrus2);

結果:

 

總結

對於方法的學習

總結三部曲:

a.  方法是做什麼的——功能

b. 方法參數是什麼——傳參

c. 方法的返回值是什麼——返回值

 

還有很多方法需要學習,主要是先學習一些常用方法,其他的方法在需要的時候,去MDN查文檔、API,講的很仔細,對着文檔看看,練練例子,最後再自己實現一個小例子,方法基本就掌握的差不多了。

最重要的是要有自學的能力和自覺性,要會用各種資源。

加油加油!!!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章