糊糊的前端学习笔记——JavaScript（上）【Day07】

1.Map

Map是一组键值对的结构，具有极快的查找速度。

Map的回调函数参数依次为value、key和map本身

var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);

m.get('Michael'); // 95

/*此外还有has/set/delete等方法*/

2.Set

Set和Map类似，也是一组key的集合，但不存储value。由于key不能重复，所以，在Set中，没有重复的key。

var s = new Set([1, 2, 3, 3, '3']);

s; // Set {1, 2, 3, "3"}

>>> s.add(4)

>>> s

{1, 2, 3, 4}

/*此外还有delete方法*/

3.iterable

Array、Map和Set都属于iterable类型。

具有iterable类型的集合可以通过新的for ... of循环来遍历。 它只循环集合本身的元素。 更好的方式是直接使用iterable内置的forEach方法，它接收一个函数，每次迭代就自动回调该函数。

var a = ['A', 'B', 'C'];

a.forEach(function (element, index, array) {

    // element: 指向当前元素的值

    // index: 指向当前索引

    // array: 指向Array对象本身

    alert(element);

});

4. arguments

它只在函数内部起作用，并且永远指向当前函数的调用者传入的所有参数。 即使函数不定义任何参数，还是可以拿到参数的值。

5.rest

rest参数只能写在最后，前面用...标识

6. apply

要指定函数的this指向哪个对象，可以用函数本身的apply方法，它接收两个参数，第一个参数就是需要绑定的this变量，第二个参数是Array，表示函数本身的参数。

function getAge() {

    var y = new Date().getFullYear();

    return y - this.birth;

}

var xiaoming = {

    name: '小明',

    birth: 1990,

    age: getAge

};

xiaoming.age(); // 25

getAge.apply(xiaoming, []); // 25, this指向xiaoming, 参数为空

另一个与apply()类似的方法是call()，唯一区别是：

- apply()把参数打包成Array再传入；

- call()把参数按顺序传入。

比如调用Math.max(3, 5, 4)，分别用apply()和call()实现如下：

Math.max.apply(null, [3, 5, 4]); // 5

Math.max.call(null, 3, 5, 4); // 5

7.map

由于map()方法定义在JavaScript的Array中，我们调用Array的map()方法，传入我们自己的函数，就得到了一个新的Array作为结果

8.reduce

Array的reduce()把一个函数作用在这个Array的[x1, x2, x3...]上，这个函数必须接收两个参数，reduce()把结果继续和序列的下一个元素做累积计算

[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)

9.filter

和map()类似，Array的filter()也接收一个函数。和map()不同的是，filter()把传入的函数依次作用于每个元素，然后根据返回值是true还是false决定保留还是丢弃该元素。

var arr = ['A', 'B', 'C'];

var r = arr.filter(function (element, index, self) {

    console.log(element); // 依次打印'A', 'B', 'C'

    console.log(index); // 依次打印0, 1, 2

    console.log(self); // self就是变量arr

    return true;

});

10.sort

字符串根据ASCII码进行排序， Array的sort()方法默认把所有元素先转换为String再排序

11.闭包

高阶函数把函数作为结果值返回。

返回闭包时牢记的一点就是：返回函数不要引用任何循环变量，或者后续会发生变化的变量。

12.箭头函数

相当于匿名函数， 如果参数不是一个，就需要用括号()括起来：

// 两个参数:

(x, y) => x * x + y * y

// 无参数:

() => 3.14

// 可变参数:

(x, y, ...rest) => {

    var i, sum = x + y;

    for (i=0; i

        sum += rest[i];

    }

    return sum;

}

13.generator

generator由function*定义，并且，除了return语句，还可以用yield返回多次。

直接调用时：

fib(5); // fib {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window}

调用generator对象有两个方法，一是不断地调用generator对象的next()方法；第二个方法是直接用for ... of循环迭代generator对象，这种方式不需要我们自己判断done。