设置对象的prototype以及super的使用

Object.getPrototypeOf/Object.setPrototypeOf()

let book1 = {
	getbook(){
		return "javascript";
	}
};
let book2 = {
	getbook(){
		return "html5";
	}
}
let book = Object.create(book1);
console.log(book.getbook());//javascript
console.log(Object.getPrototypeOf(book) === book1);//true

Object.setPrototypeOf(book,book2);
console.log(book.getbook());//html5
console.log(Object.getPrototypeOf(book) === book2);//true

我们定义了2个对象book1和book2,都有getbook()这个方法。
我们使用Object.create(obj,propertiesObject)创建一个新的对象book,参数obj为对象的原型,第二个为可选参数是对象的属性对象,这样我们就设置了一个原型为book1的对象。使用Object.getPrototypeOf(book)去获取对象的原型,发现就是book1,所以返回的是true,在调用book.getbook()方法就会调用原型链book1的getbook()方法,当我们用Object.setPrototypeOf(book,book2);设置book对象的原型为book2,我们再次调用getbook()方法,此时已经重新设置了book对象的原型,所以会调用book2中的getbook()方法。

proto

let book1 = {
	getbook(){
		return "javascript";
	}
};
let book2 = {
	getbook(){
		return "html5";
	}
};
let book = {
	__proto__:book1
}
console.log(book.getbook());//javascript
book.__proto__ = book2;
console.log(book.getbook());//html5

之前我们通过Object.setPrototypeOf去设置对象的原型,es6中可以直接使用__proto__属性设置对象原型

super

let book1 = {
	getbook(){
		return "javascript";
	}
};
let book = {
	__proto__:book1,
	getbook(){
		return super.getbook() + 'css3';
	}
}
console.log(book.getbook());//javascript

我们可以使用super.访问原型链中的方法

猜你喜欢

转载自blog.csdn.net/wadedt/article/details/88419469