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

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

作者: 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>
    

    相关文章

      网友评论

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

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