美文网首页
第八小节:箭头函数不适用的场景

第八小节:箭头函数不适用的场景

作者: Janicerant | 来源:发表于2017-12-18 20:44 被阅读0次

以下三种情况是不能使用箭头函数的:

  1. 作为构造函数,一个方法需要绑定到对象
<script>
    const Person = function(name, points) {
        this.name = name;
        this.points = points;
    }
    const Lucy = new Person('Lucy',5);
    Person.prototype.updatePoints = function() {
        this.points++;
        console.log(this.points)
    }

</script>

当我们用new生成一个Person的实例的时候其实要进行四个步骤:
1.生成一个新的对象
2.把构造函数里this的值指向新生成的对象
3.把这个对象绑定到它的原型对象
4.返回这个新生成的对象
但是我们通过这个箭头函数并没有实现把这个this值绑定到我们新生成的Lucy对象上去,所以并不会得到我们想要的效果,那么这个时候我们只能使用我们原始的函数。

  1. 当你真的需要this的时候
<script>

const button = document.querySelector('.zoom');
    button.addEventListener('click',function() {
        this.classList.add('in');
        setTimeout(() => {
            this.classList.remove('in');
        },2000)
    })
</script>
  1. 需要使用arguments对象
<script>

const sum = function() {
        return Array.from(arguments)
            .reduce((prevSum,value) => prevSum + value,0)
}
//在箭头函数当中是没有arguments这个对象的
</script>

相关文章

  • 第八小节:箭头函数不适用的场景

    以下三种情况是不能使用箭头函数的: 作为构造函数,一个方法需要绑定到对象 当我们用new生成一个Person的实例...

  • ES6-箭头函数

    箭头函数中的this ES6函数参数默认值 箭头函数不适用的场景

  • js学习笔记4(函数)

    1.箭头函数 ES6新增属性。箭头函数特别适合嵌入函数的场景。 箭头函数虽然语法简介,但是很多场合不适用。箭头函数...

  • 箭头函数

    紧接上一文,this详解es6定义的箭头函数是不适用以上规则的。那么我们来了解一下箭头函数吧箭头函数的形式: =>...

  • ES6-箭头函数

    ES6允许使用箭头(=>)定义函数,箭头函数的语法多变,根据实际的使用场景有多种形式,但需要由函数参数、箭头和函数...

  • es6

    箭头函数与普通函数的区别 箭头函数是匿名函数,不能作为构造函数,不能使用new 箭头函数不绑定arguments,...

  • 箭头函数和普通函数的区别

    箭头函数其实就是匿名函数,不可作为构造函数,不可被new; 箭头函数没有原型属性prototype; 箭头函数不绑...

  • ES6箭头函数与普通函数区别

    箭头函数作为匿名函数,是不能作为构造函数的,不能使用new 箭头函数没有原型属性 箭头函数不绑定arguments...

  • 解析 ES6 新增语法:奇妙的箭头函数

    什么是箭头函数?看下面的语法。 为什么要用箭头函数?一个字:短。 1 箭头函数最大的优点就是简短。 2 箭头函数不...

  • 前端面试必会面试题

    1、箭头函数和普通函数的区别 1.箭头函数是匿名函数,不能作为构造函数,不能使用new 2.箭头函数不绑定argu...

网友评论

      本文标题:第八小节:箭头函数不适用的场景

      本文链接:https://www.haomeiwen.com/subject/aginixtx.html