_proto_ & prototype & constructor

2020/12/02更新

_proto_ 指向实例的构造函数的原型对象

只有函数才有prototype，对象实例只有_proto_

贴图自己体会

 

---

function Father(name){
this.name = name || 'jjjj';
}

Father.prototype.sayName = function(){
console.log(this.name);
}

function Child(name){
Father.call(this,name);
}

Child.prototype = new Father();
var chi = new Child('red');

console.log(chi.name); //red 

chi.sayName(); //red

delete chi.name;
chi.sayName(); //jjjj

console.log(chi.constructor);

console.log(Child.constructor);

//ƒ Father(name){
this.name = name || 'jjjj';
}
//ƒ Function() { [native code] }

解释：

1、Father 是构造函数模式创建的类，且通过prototype给其原型链上加了方法sayName

2、Child的构造函数里调用了Father的构造函数，继承了Father的属性name，但是值不是共享的

3、Child的原型被赋为了Father的一个实例，也就是说，Child此时原型上同时有name属性和sayName方法，而name=‘jjjj’，因为在初始化Father实例时并未传参.如果Child.prototype=new Father('hello'),那么第三个会输出hello而不是jjjj

4、实例方法在遇到一个变量属性时，会优先查看实例中有无该属性，如果实例上无该属性，则会去原型链上找，直至找完所有

5、在delete了chi.name后，chi实例已经不含有name属性，所以sayName会到原型链上找name，而chi的原型链就是Child的原型链此时的name=jjjj，所以最后输出jjjj

6、第二个输出red也是显而易见的，因为函数内的this指向调用它的对象chi，所以this指向的是chi，而chi拥有实例属性name=red