原型链模式(基础)

原型链模式(基础)

案例一
function creat(name, age){
this.name=name;  
this.age=age;
this.write=function (){
console.log("i can write"+this.name);
};
}
var p1=new creat("xiaobai",13);
p1.write();
var p2=new creat("xiaohei",15);
p2.write();

console.log(p1.writeJs === p2.writeJs);>>false

构造函数模式中拥有了类和实例的概念，并且实例和实例之间是相互独立开的实例识别

案例一拓展
function creat(name, age){
this.name=name;  
this.age=age;
creatjsPerson.prototype.writeJs=function(){
console.log("i can write"+this.name);
};
};
var p1=new creat("xiaobai",13);
p1.write();
var p2=new creat("xiaohei",15);
p2.write();

console.log(p1.writeJs === p2.writeJs);>>true

基于构造函数模式的原型模式，解决了方法或者属性公有的问题

把实例之间相同的属性和方法提取成公有的属性和方法
想让谁公有就把它放在creatjsPerson.prototype里面

1、原理

1）、每一个函数数据类型（普通函数、类）都有一个天生自带的属性：prototype（原型），并且这个属性是一个对象数据类型的值
2）、并且在prototype上，浏览器天生给他加了一个属性constructor（构造函数），属性值是当前函数（类）本身
3）、每一个对象数据类型（普通对象、实例、prototype…）也天生自带一个属性：proto,属性值是当前实例所属类的原型（prototype）

案例二
function Fn(){
this.x=100;
}
Fn.prototype.getX=function (){
console.log(this.x);
};
var f1=new Fn;
var f2=new Fn;
console.log(Fn.prototype.constructor === Fn);
>>true

2、object是js中所有对象数据类型的基类（最顶层的类）

1）、f1 instanceof Object>>true>>因为f1通过__proto__可以向上级查找，不管有多少级，最后总能找到Object
2）、在object.prototype上没有__proto__这个属性

3、原型链模式

f1.hasOwnProperty(“x”);
hasOwnProperty是f1的一个属性

但是我们发现在f1的私有属性上并没有这个方法，那如何处理？

1）通过“ 对象名.属性名 ”的方式获取属性值的时候，首先在对象的私有属性上进行查找，如果私有中存在这个属性，则获取的是私有的属性值

1、如果私有的没有，则通过__proto__找到所属类的原型（类的原型上定义的属性和方法都是当前实例公有的属性和方法），原型上存在的话，获取的是公有的属性值

2、如果原型上也没有，则继续通过原型上的__proto__继续向上查找，一直找到Object.prototype为止
这种查找的机制就是原型链模式

案例三
f1.getX===f2.getX>>true
f1.__proto__.getX===f2.getX
>>true
f1.getX===Fn.prototype.getX
>>true

案例三拓展
function Fn(){
this.x=100;
this.sum=function(){};
}
Fn.prototype.getX=function (){
console.log(this.x);
};
Fn.prototype.sum=function (){
console.log(this.x);
};
var f1=new Fn;
var f2=new Fn;
f1.sum===f2.__proto__.sum
>>false
f1.sum===Fn.prototype.sum;
>>false

2）f1.hasOwnProperty>>f1.proto.proto.hasOwnProperty

在IE浏览器中，我们原型模式也是同样的原理，但是IE浏览器怕你通过__proto__把公共的修改，禁止使用__proto__

案例四
f1.sum=function(){
>>修改自己私有的sum
};
f1.__proto__.sum=function(){
>>修改所属类原型上的sum
};
Fn.prototype.sum=function(){
>>修改公有的sum
}