ES6知识盲点整理
ES6知识盲点整理
箭头函数
JS数组的map()方法
map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
语法:
var new_array = arr.map
(
function callback(currentValue,index,array)
{
...
return ...
}
,thisArg)
参数:
callback 生成新数组元素的函数,使用三个参数:
currentValue callback 数组中正在处理的当前元素。
index可选 callback 数组中正在处理的当前元素的索引。
array可选 map 方法调用的数组。
thisArg可选 执行 callback 函数时值被用作this。
返回值:
一个由原数组每个元素执行回调函数的结果组成的新数组。
关于严格模式普通函数和箭头函数中this的指向问题
1.在ES5,ES6中,全局作用域下无论是否为严格模式this都指向window
2.全局作用域中函数中的this:es5,非严格模式this指向window,严格模式下的this指向undefined;es6箭头函数的this都指向window。
call、apply和bind的区别
call调用 将方法中的this指向call中第一个参数,当第一个参数为null、undefined时,默认指向window; call中第一个参数之后是要传递给方法的参数列表。
apply与call相似,不同之处在于传递给方法的参数形式不一致。apply传递给方法的参数是数组的形式。
call和apply在改变方法的this指向时,会同时执行方法;而bind不会执行方法,而是返回改变this指向后的新方法。
深入理解ES6箭头函数里的this
ES6(…)展开运算符
在ES6中用…来表示展开运算符,它可以将数组方法或者对象进行展开。先来看一个例子它是如何使用的。
const arr1 = [1, 2, 3];
const arr2 = [...arr1, 10, 20, 30];
这样,arr2 就变成了[1, 2, 3, 10, 20, 30];
arr1中的值完全克隆到了arr2中(arr1改变arr2中还是最初的值)。当然,展开对象数据也是可以得到类似的结果
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到底还有多少数据会传进来,就会利用展开运算符来处理剩余的数据。
这种方式在react中十分常用
const props = {
size: 1,
src: 'xxxx',
mode: 'si'
}
props 设置了基础数据,后续数据根据展开运算符植入
const { size, ...others } = props;
console.log(others)
然后再利用暂开运算符传递给下一个元素,再以后封装react组件时会大量使用到这种方式,正在学习react的同学一定要搞懂这种使用方式
<button {...others} size={size} />
展开运算符还用在函数的参数中,来表示函数的不定参。只有放在最后才能作为函数的不定参,否则会报错。
// 所有参数之和
const add = (a, b, ...more) => {
return more.reduce((m, n) => m + n) + a + b
}
console.log(add(1, 23, 1, 2, 3, 4, 5)) // 39
相关文章
- 如何将 Swift 代码添加为自定义 LLDB 命令
- Dubbo中用到了哪些设计模式?
- 我对Go语言的错误处理有哪些不满,以及我是如何处理的
- 23种设计模式,我竟然秒懂了...
- 遗传算法中几种不同选择算子及Python实现
- 聊聊React开发的一些坑(一)
- 一个函数超过1000行,可以不?
- 如何不 Review 每一行代码,同时保持代码不被写乱?
- 自上而下,逐步揭开PHP解析大整数的面纱
- 一篇带给你Spring Cloud Sleuth入门介绍
- 程序员编程生涯中常会犯的7个错误
- 如何用Go语言每分钟处理100万个请求
- 想成为牛逼程序员? 先数数编程语言之父们的头发
- 日常Bug排查-抛异常不回滚
- 程序员如何用一个脚本每天定时给多个女友发微信暖心话
- 线程池的使用场景和代码实现!
- 为什么很多高校将c语言作为编程入门语言
- Python Web框架:Django vs Flask vs Pyramid
- 一个地区问题引发的一些列思考
- 写的代码又被喷?8招让你的代码更Pythonic