分享

es6—— 继承 ——类的 prototype 属性和__proto__属性(原型链)

 ZhouAndrew 2023-01-23 发布于江苏

   大多数浏览器的 ES5 实现之中,每一个对象都有__proto__属性,指向对应的构造函数的prototype属性。Class 作为构造函数的语法糖,同时有prototype属性和__proto__属性,因此同时存在两条继承链。

(1)子类的__proto__属性,表示构造函数的继承,总是指向父类。

(2)子类prototype属性的__proto__属性,表示方法的继承,总是指向父类的prototype属性。

class A {}class B extends A {}B.__proto__ === A // trueB.prototype.__proto__ === A.prototype // true

 上面代码中,子类B__proto__属性指向父类A,子类Bprototype属性的__proto__属性指向父类Aprototype属性。

类相当于实例的原型, 所有在类中定义的方法, 都会被实例继承。 如果在一个方法前, 加上static关键字, 就表示该方法不会被实例继承, 而是直接通过类来调用, 这就称为“ 静态方法”。

class Animal {constructor(name, age) {//实例的私有属性this.name = namethis.age = agereturn console.log('实例属性')}test=['hello']  //实例私有属性,即使写在constructor外面,也是实例属性。animalFun() {console.log('Animal实例方法');}static animalAttr = 'Animal静态属性'static animalStaFun() {console.log('Animal静态方法');}}class Dog extends Animal {constructor(name, age, color, weight) {super(name, age)this.color = colorthis.weight = weight}}// 继承了Animal类的实例属性和实例方法let dog = new Dog('二狗', 1, 'black', '10kg')console.log(dog);dog.animalFun()// 继承Animal类的静态属性和静态方法console.log(Dog.animalAttr);Dog.animalStaFun()console.log(Dog.prototype.__proto__ === Animal.prototype);console.log(dog.__proto__.__proto__ === Animal.prototype);console.log(Dog.__proto__ === Animal);// 实例方法和实例属性写在哪//   实例可以调用的方法和属性// 静态方法和静态属性写在哪//   类本身调用的方法和属性输出为:实例属性Dog { name: '二狗', age: 1, color: 'black', weight: '10kg' }Animal实例方法Animal静态属性Animal静态方法truetruetrue

注意:静态属性与静态方法由类构造函数调用,即上文中的Dog,

实例属性与实例方法由实例对象调用,即上文中的dog。

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多