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

2017-12-18  本文已影响0人  Janicerant

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

  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>
上一篇下一篇

猜你喜欢

热点阅读