JavaScript原型及原型链

javascript原型及原型链

隐式原型与显式原型

• 显式原型：每一个函数对象都有一个prototype属性，即显示原型

• 隐式原型：每一个实例对象都有一个__proto__属性，即隐式原型

• 对象的隐式原型的值是其构造函数的显式原型的值

  var o = {};
  console.log(o.__proto__ === Object.prototype);// true
  

• 原型对象的constructor属性值是构造函数对象

  var o = {};
  console.log(o.__proto__.constructor === Object);// true
  

• prototype属性：在创建函数对象的时候自动添加，其属性值是一个Object实例对象

• __proto__属性：在创建对象的时候自动添加，其属性值等于他构造函数的prototype属性值

Function

• 所有的函数对象都是Function的实例

• Function函数对象也是Function的一个实例

  console.log(Function.__proto__ === Function.prototype);// true
  

读取与设置对象属性

• 读取对象属性时，如果对象中没有，会自动到原型链中查找
• 设置/修改属性时，如果当前对象中没有该属性，会直接给对象设置/修改属性，它不会操作原型链

通过原型实现继承

// 父类
function Person(name, age){
    this.name = name;
    this.age = age;
}
Person.prototype.setName = function(name){
    this.name = name;
} 

// 子类
function Student(name, age, stuId){
    // 通过父类设置属性
    Person.call(this, name, age);
    this.stuId = stuId;
}
// 通过原型实现继承
Student.prototype = new Person();
// 修正子类原型中的constructor属性
Student.prototype.constructor = Student;
Student.prototype.setAge = function(age){
    this.age = age;
}

var s = new Student('Tom', 22, 2333);
console.log(s);
s.setAge(24);
s.setName('Bob');
console.log(s);