简化原型访问

该文章由 leevare 发布于 ,归类于 Javascript

在es5中,如果想重写对象实例的方法,但是又需要调用与它重名的原型方法,该如何实现呢?

可以借助于Object.getPrototypeOf来实现。

例如如下两个对象

const person = {
    name: 'Jason',
    greeting() {
        return this.name
    }
}

const friend = {
    name: 'Leevare',
    greeting() {
        return Object.getPrototypeOf(this).greeting.call(this) + ', hi!'
    }
}

friend的原型设置为person

Object.setPrototypeOf(friend, person)

此时调用friend.greeting()方法则会同时调用其原型上的方法。

但是,如果是多重继承的情况,这样写将会有很大的问题。

const relative = Object.create(friend)
console.log(relative.greeting());

relative继承于friend,此时,如果调用relative.greeting()则会导致堆栈溢出。究其原因,在调用greeting时,friend中的this指向的是relative实例,所以Object.getPrototypeOf(this)friend对象,然后friend调用自身导致无限递归,从而堆栈溢出。

在es6中,引入了super关键字,使用super关键字可以完美地解决这个问题。

const friend = {
    name: 'Leevare',
    greeting() {
        return super.greeting() + ', hi!';
    }
}

在这里,使用super它总是能够指向正确的对象,它能够简化原型的访问。

需要注意的是,super只能用于简写的函数中,如下书写方式是错误的。

//错误的书写方式
const friend = {
    name: 'Leevare',
    greeting: function () {
        return super.greeting() + ', hi!';
    }
}

如果觉得我的文章对您有用,请您随意打赏。您的支持将鼓励我更加努力创作!

相关文章:

说点什么

avatar
300
  Subscribe  
提醒