原型以及原型链的理解

48 阅读1分钟

不多说,上代码(将代码引入到html页面在浏览器控制台看结果比较方便)

let person = {
  name: "xiaohui",
  age: 18,
};

let xiaohui = {};
console.log(person.__proto__ === Object.prototype);   //true   因为person对象的__proto__属性指向王原型链上找,没有继承,那么就默认为Object这个最终父类

xiaohui.__proto__ = person;       //指定它的原型为父亲为person
console.log(person);
console.log(person.name, xiaohui.__proto__);  // xiaohui.__proto__ 将会从原型链上去寻找,即是在链上的prototype上寻找,从而读取了prototype的值。

function Person(name, age) {
  this.name = name;
  this.age = age;
}

let man = new Person("cxk, 22);
console.log(man, man.__proto__);
console.log(man.__proto__ === Person.prototype); //true
//man的__proto__属性指向链上的原型
// 函数的prototype属性是可以直接读取的,她有prototype属性 而对象则不能直接读取prototype
Person.prototype.run = function () {
  console.log(` age is ${this.age}`);
};
man.run();
man.__proto__.add = function () {
  console.log(this.age + "岁");
};
// 通过实例的proto属性往函数上添加方法也成功了;
man.add();
// man 成功的调到了通过函数prototype添加的方法属性
console.log(man.constructor === Person);