ES6箭头函数

前言

  • 好久没有写文章了,最近也忙着毕业设计,不过箭头函数一直是心头的一个痛处,始终没有理解好。现在终于算是吧这个东西弄清楚了。

箭头函数

1.在箭头函数中实现代码使用{},大括号表示代码执行

(a)={alert(a)}  ==== function(a){alert(a)}

2.箭头函数返回对象(),小括号表示对象返回

(a)={return a}  ==== (a)=>(a)  ==== function(a){return a}

3.this的操作

var func=(a)={alert(this)}
this是什么?区别在于普通函数this不再是函数调用
p=new Person()
p.func(); //func中的this不再是Person对象
箭头函数中的this是箭头函数声明所在类,或者所在function的对象
箭头函数在哪里声明的this就是谁
优点:节省了绑定this操作
以往在jsx中操作点击事件 要处理当前组件对象数据
需要手动bind(this)这样才可以访问到当前组件
现在只需要用箭头函数 自动绑定

4.链式调用

var func=(a)=>(b)=>{alert(b)}
b是什么?
b是执行一次调用:func()
以后再次执行调用传递的参数
func()('this is b')
即b是用来接受第2次调用的形式参数
在发生调用的时候,第2次调用的参数赋值给b
  • 优点:

使用高阶函数实现柯里化操作 在调用函数时 业务更加清晰
未柯里化:
func(a,b,c){
    分别使用a,b,c处理业务
}
func(1,2,3)
柯里化:
func(a){
    a处理业务
    return func(b){
        b处理业务
        return func(c){
            c处理业务
        }
    }
}
func(1)(2)(3)
就是把以前需要传递多个参数的函数操作
定义成只需要传递一个参数
每次操作结束后再次调用 接受下一个参数
完成以前多个参数的需求
  • 缺点:

自动生成了大量闭包,变量过多被共享到内存方法区里注意内存泄漏

原文地址

https://alfierichou.github.io...

相关文章

原文连接:https://www.cnblogs.com/dupd/p/5951311.htmlES6...
以为Es6,javascript第一次支持了module。ES6的模块化分为导...
视频讲解关于异步处理,ES5的回调使我们陷入地狱,ES6的Prom...
TypeScript什么是TypeScript?TypeScript是由微软开发的一款开...
export class AppComponent { title = 'Tour of heroes...
用 async/await 来处理异步昨天看了一篇vue的教程,作者用as...