先来看下面的例子:

    1. name='aaa';
    2. let obj={
    3.     name:'bbb',
    4.     getName1(){
    5.         console.log(this.name);
    6.     },
    7.     getName2:()=>{
    8.         console.log(this.name);
    9.     }
    10. }
    11. obj.getName1();
    12. obj.getName2.apply({name:'ccc'});

    题目也比较简单,大家可先猜猜结果是什么,下面会讲一些es6箭头中的注意点。

    es6箭头函数的this

    es6箭头函数的this还是比较容易搞混,上面的题目中getName2为什么this绑定了{name:'ccc'}还是无法输出'ccc'呢?因为箭头函数是无法用apply,call绑定this的,但是apply,call仍然是可以使用的,只不过会忽略第一个参数而已:

    1. let obj={
    2.     getName2:(firstName,lastName)=>{
    3.         console.log(firstName,lastName);
    4.     }
    5. }
    6. obj.getName2.call('','zhang','san');//忽略第一个参数

    一般我们看到的对箭头函数有效的绑定this都是绑定它上层的方法,而不是直接绑定在箭头函数身上:

    1. let obj={
    2.     name:'bbb',
    3.     getName2(){
    4.         (()=>{
    5.             console.log(this.name);
    6.         })();
    7.     }
    8. }
    9. obj.getName2.call({name:'ccc'});

    箭头函数的自执行

    普通函数的自执行方法比较多,一般有以下几种:

    1. //方法一
    2. (function(name){console.log(name);}('baby'))
    3. //方法二
    4. (function(name){console.log(name);})('baby')
    5. //方法三系列
    6. +function(name){console.log(name);}('baby')
    7. -function(name){console.log(name);}('baby')
    8. !function(name){console.log(name);}('baby')
    9. void function(name){console.log(name);}('baby')

    箭头函数的自执行方法就好像就只有一种(目前只看到这种):

    1. ((name)=>{console.log(name);})('baby')

    箭头函数和Generator函数

    我们都知道箭头函数不能new的,因为它没有[[Construct]]内部方法;同时,它也无法作为Generator函数,因为Generator函数返回的遍历器继承了Generator函数的prototype对象上的方法,而箭头函数没有prototype内部方法,同样,箭头函数里面还不能有yield关键字,因为yield是属于Generator函数的。

    但是Generator函数里面是可以用箭头函数的:

    1. function* gen(){
    2.     yield new Promise((resolve,reject)=>{
    3.         resolve('ok');
    4.     });
    5. }
    6. let g=gen();
    回到顶部
    我要评论

    所有评论

      相关文章