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 方法

返回每次函数调用执行结果组成的数组

注意： map() 不会对空数组进行检测。arr是长度为5的空数组，map方法不执行。arr为【】空数组也不执行。

            var arr = new Array(5)
            arr.map(function(){
                console.log(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";
        })

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]

js数组方法（二）

猜你喜欢