ES6知识盲点整理
- 箭头函数
- JS数组的map()方法
- 关于严格模式普通函数和箭头函数中this的指向问题
- call、apply和bind的区别
- 深入理解ES6箭头函数里的this
- ES6(...)展开运算符
箭头函数
箭头函数
JS数组的map()方法
map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
语法:
代码语言：javascript复制var new_array = arr.map
(
function callback(currentValue,index,array)
{
...
return ...
}
,thisArg)参数:
callback 生成新数组元素的函数，使用三个参数：
currentValue callback 数组中正在处理的当前元素。
index可选 callback 数组中正在处理的当前元素的索引。
array可选 map 方法调用的数组。
thisArg可选 执行 callback 函数时值被用作this。
返回值:
一个由原数组每个元素执行回调函数的结果组成的新数组。
Array.prototype.map()
关于严格模式普通函数和箭头函数中this的指向问题
1.在ES5,ES6中，全局作用域下无论是否为严格模式this都指向window
2.全局作用域中函数中的this：es5，非严格模式this指向window，严格模式下的this指向undefined；es6箭头函数的this都指向window。
关于严格模式普通函数和箭头函数中this的指向问题
call、apply和bind的区别
call调用 将方法中的this指向call中第一个参数，当第一个参数为null、undefined时，默认指向window; call中第一个参数之后是要传递给方法的参数列表。
apply与call相似，不同之处在于传递给方法的参数形式不一致。apply传递给方法的参数是数组的形式。
call和apply在改变方法的this指向时，会同时执行方法；而bind不会执行方法，而是返回改变this指向后的新方法。
深入理解ES6箭头函数里的this
深入理解ES6箭头函数里的this，看这篇就够了
关于箭头函数中的this的指向
ES6(…)展开运算符
在ES6中用…来表示展开运算符，它可以将数组方法或者对象进行展开。先来看一个例子它是如何使用的。
代码语言：javascript复制const arr1 = [1, 2, 3];
const arr2 = [...arr1, 10, 20, 30];
这样，arr2 就变成了[1, 2, 3, 10, 20, 30];arr1中的值完全克隆到了arr2中（arr1改变arr2中还是最初的值）。当然，展开对象数据也是可以得到类似的结果
代码语言：javascript复制const obj1 = {
a: 1,
b: 2,
c: 3
}
const obj2 = {
...obj1,
d: 4,
e: 5,
f: 6
}
结果类似于 const obj2 = Object.assign({}, obj1, {d: 4})展开运算符还常常运用在解析结构之中，例如我们在Raect封装组件的时候常常不确定props到底还有多少数据会传进来，就会利用展开运算符来处理剩余的数据。
代码语言：javascript复制这种方式在react中十分常用
const props = {
size: 1,
src: 'xxxx',
mode: 'si'
}
props 设置了基础数据，后续数据根据展开运算符植入
const { size, ...others } = props;
console.log(others)
然后再利用暂开运算符传递给下一个元素，再以后封装react组件时会大量使用到这种方式，正在学习react的同学一定要搞懂这种使用方式
<button {...others} size={size} />展开运算符还用在函数的参数中，来表示函数的不定参。只有放在最后才能作为函数的不定参，否则会报错。
代码语言：javascript复制// 所有参数之和
const add = (a, b, ...more) => {
return more.reduce((m, n) => m n) a b
}
console.log(add(1, 23, 1, 2, 3, 4, 5)) // 39ES6(…)展开运算符
es6展开运算符 …
