继承和原型链

基于原型链的继承示例

// 继承方法

    const parent = {

      value: 2,

      method() {

        console.log(this);

        return this.value + 1

      }

    }

    console.log(parent.method());//3 不难理解

    const child = {

      __proto__: parent,

    }

    console.log(child.method());//3  this 指向child  但是属性中没有value 在原型链上查找 最后找到原型的value

    child.value = 4

    console.log(child.method());//child有value属性了 发生属性遮蔽

 构造函数结合原型示例

const boxes = [

      { value: 1, getValue() { return this.value; } },

      { value: 2, getValue() { return this.value; } },

      { value: 3, getValue() { return this.value; } },

    ];

 这个数组中 每个对象实例都有自己的做相同事情的函数属性 会占用多余内存 

可以使用构造函数 将getValue移动到原型链上

function Box(value) {

      this.value = value;

    }

    Box.prototype.getValue = function () {

      return this.value;

    };

    const box1 = new Box(1);

    const box2 = new Box(2);

    const box3 = new Box(3);

    const boxes = [box1, box2, box3]

 

你可能感兴趣的:(javascript,前端,开发语言)