super关键字可以使用于对象,也可在类中使用,下面分别来说
- 对象
let parent = {name: 'lili',getName(){console.log(this.name)}
}
let son = {name: 'mike',getName(){super.getName()}
}
Object.setPrototypeOf(son, parent)
son.getName() // 'mike'
可以看到对象中“方法”通过super关键字调用原型上的方法,this指向了对象本身
我们再来改造一下上面的对象
let son = {name: 'mike',getName(){console.log(super.name)}
}
Object.setPrototypeOf(son, parent)
son.getName() // 'lili'
我们发现,在对象的方法通过super关键字调用原型上的属性时,返回了原型的属性值(此时,没有用到this哈)
从上面我们有了结论:
super.name
等同于
Object.getPrototypeOf(this).name【属性】
等同于
Object.getPrototypeOf(this).name.call(this)【方法】
字面意思:
super.name指向的是原型对象上的name,但是绑定的this还是当前的son对象,
只要在对象的方法上通过super调用原型的方法,this指向当前的子类实例。
- 类
class Parent {constructor(name){this.name = name;}getName(){console.log(this.name)}
}
class Son extends Parent{constructor(name,age){this.age = agesuper(name)}getName(){super.getName()}
}
let son = new Son('mike', 18). // Uncaught ReferenceError: Must call super constructor in derived class before accessing 'this' or returning from derived constructor
在上面利用extends实现了类的继承,但是我们实例化子类的时候报错了,看报错信息,我们可以知道:子类没有自己的this对象,而是继承父亲的this对象，然后进行加工。如果不调用super，子类就得不到this对象
所以上面的代码,要先调用super,然后在对this进行操作.我们修改一下代码
class Parent {constructor(name){this.name = name;}getName(){console.log(this.name)}
}
class Son extends Parent{constructor(name,age){super(name)this.age = age}getName(){super.getName()}
}
let son = new Son('mike', 18)
son.getName() //mike
将super调用置于this之前,可以正常运行,上看是再有constructor方法的时候,那么,如果没有constructor那有如何呢?
class Parent {constructor(name){this.name = name;}getName(){console.log(this.name)}
}
class Son extends Parent{}
let son = new Son('mike')
son.getName() //'mike'
发现在类的继承中,子类如果没有constructor方法,那么super调用会默认被添加到子类中,使得子类可以正常被初始化
上面的super对方法的调用时普通方法,那如果super调用的是静态方法呢?来试试添加一下静态方法吧
class Parent {constructor(name){this.name = name;}static sayHello(){console.log('hello')}getName(){console.log(this.name)}
}
class Son extends Parent{static testStatic(){super.sayHello()}
}
Son.testStatic(). // 'hello'
我们发现,在静态方法中使用super,那么这个super将指向父类本身,在普通方法中调用super,此时super将指向父类的原型对象
