我创建了两个对象。一个是dog1,另一个是dog2。它们分别是使用构造函数和类创建的。它们都有一个bark
方法,但当我在控制台中查看这两个对象时用类创建的对象没有树皮方法。这是什么原因?但我可以使用dog2.bark()
<html>
<body>
<input type='button' value='bark' id='mydog' />
<input type='button' value='bark2' id='dog2'/>
<script>
var btn=document.getElementById('mydog');
var btn2=document.getElementById('dog2');
var dog1=new Dog1();
function Dog1(){
this.bark=function(){
console.log('wooff');
}
}
console.log(dog1);
btn.addEventListener('click',function(e){
dog1.bark();
});
class Dog2{
constructor(){
this.sound='wooff';
}
bark(){
console.log(this.sound);
}
}
var dog2=new Dog2();
console.log(dog2);
btn2.addEventListener('click',function(){
dog2.bark();
});
</script>
</body>
</html>
答案 0 :(得分:1)
class
语法是围绕旧式写作方式的语法糖:
function Dog2() {
this.sound = 'woof';
}
Dog2.prototype.bark = function () {
console.log(this.sound);
}
那是原型继承;如果在控制台中展开/记录__proto__
属性,您将在对象上找到该方法。 Dog2
的所有实例都通过原型共享相同的bark
方法;如果您为每个bark
附加一个新的this
方法,该方法将“直接”在每个对象上,但也会不必要地使用更多资源,因为您有相同的多个相同的实现。