js數組方法(二)

11、indexOf方法和lastINdexOf方法 -- ES5方法

正向查找和反向查找數組中的值,返回找到的第一個值的索引,如果沒有返回-1

        var arr = ["a","c","b","ac","bc","b"];
        console.log(arr.indexOf("b"));//2
        console.log(arr.lastIndexOf("b"));//5

12、迭代方法 -- ES5方法

對數組的每一項指定一個運行函數

參數:item,index

        arr.map((item,index) => {
            console.log(item,index)
        })

(1)map 方法 

返回每次函數調用執行結果組成的數組

(2)filter方法

返回執行結果true的項組成的數組

(3)forEach方法 

沒有 返回值

(4)every方法

若每一項的執行結果爲true,則返回true

(5)some方法 

若任意一項的執行結果爲true,則返回true

13、歸併方法 -- ES5方法

(1)reduce方法

重點是reduce 方法執行函數的參數 

第一個參數是該執行函數的返回值,默認返回值爲undefined。

第二個參數是當前執行的項

第三個參數是當前執行的index

第四個參數是arr數組本身。

注意第一次執行的prev是arr[0],cur是arr[1],index是1。

        var arr = [10,20,30,40];
        arr.reduce(function(prev,cur,index,arr){
            console.log(prev,cur,index);
            return "a";
        })
結果
10 20 1
a 30 2
a 40 3

reduce除了在接收一個函數外,還可以接收一個參數,作爲 prev的初始值 

可以這麼理解:

第二個參數作爲prev的初始值,每次循環的return返回值,會重新賦值給第二個參數,作爲下一次循環的初始值。且reduce的執行結果(方法返回值)就是第二個參數的最終值。

        var arr = [10, 20, 30, 40,40];
        var newArr = arr.reduce(function (prev, cur,index) {
            // prev.indexOf(cur) === -1 && prev.push(cur);
            console.log(prev,cur,index);
            return prev+1;
        }, 1);
        console.log(newArr);

結果:

(2)reduceRight方法

該方法從數組末尾開始執行,其他的和reduce沒有區別。

14、Array.of方法 -- ES6

創建數組的方式:解決Array(7)創建length爲7的undefined值的問題。

Array.of() 方法創建一個具有可變數量參數的新數組實例,而不考慮參數的數量或類型。

 Array.of() 和 Array 構造函數之間的區別在於處理整數參數:Array.of(7) 創建一個具有單個元素 7 的數組,而 Array(7) 創建一個長度爲7的空數組(注意:這是指一個有7個空位(empty)的數組,而不是由7個undefined組成的數組)。

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

Array(7);          // [ , , , , , , ]
Array(1, 2, 3);    // [1, 2, 3]

示例

Array.of(1);         // [1]
Array.of(1, 2, 3);   // [1, 2, 3]
Array.of(undefined); // [undefined]

兼容舊環境

如果原生不支持的話,在其他代碼之前執行以下代碼會創建 Array.of() 。

if (!Array.of) {
  Array.of = function() {
    return Array.prototype.slice.call(arguments);
  };
}

15、Array.from方法 -- ES6

Array.from() 方法從一個類似數組或可迭代對象創建一個新的,淺拷貝的數組實例。

Array.from() 可以通過以下方式來創建數組對象:

  • 僞數組對象(擁有一個 length 屬性和若干索引屬性的任意對象)
  • 可迭代對象(可以獲取對象中的元素,如 Map和 Set 等)

Array.from() 方法有一個可選參數 mapFn,讓你可以在最後生成的數組上再執行一次 map 方法後再返回。也就是說 Array.from(obj, mapFn, thisArg) 就相當於Array.from(obj).map(mapFn, thisArg)。

比如:

從 String 生成數組

Array.from('foo'); 
// [ "f", "o", "o" ]

從 Set 生成數組

const set = new Set(['foo', 'bar', 'baz', 'foo']);
Array.from(set);
// [ "foo", "bar", "baz" ]

從 Map 生成數組

const map = new Map([[1, 2], [2, 4], [4, 8]]);
Array.from(map);
// [[1, 2], [2, 4], [4, 8]]

const mapper = new Map([['1', 'a'], ['2', 'b']]);
Array.from(mapper.values());
// ['a', 'b'];

Array.from(mapper.keys());
// ['1', '2'];

從類數組對象(arguments)生成數組

function f() {
  return Array.from(arguments);
}

f(1, 2, 3);

// [ 1, 2, 3 ]

在 Array.from 中使用箭頭函數

// Using an arrow function as the map function to
// manipulate the elements
Array.from([1, 2, 3], x => x + x);
// [2, 4, 6]


// Generate a sequence of numbers
// Since the array is initialized with `undefined` on each position,
// the value of `v` below will be `undefined`
Array.from({length: 5}, (v, i) => i);
// [0, 1, 2, 3, 4]

 

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