1、原型
1.prototype屬性
function Fruit(){ }
function Apple(){ }
console.log(Fruit.prototype);// Fruit {}
console.log(Fruit.prototype.__proto__);//Object
console.log(Apple.prototype);// Apple {}
console.log(Apple.prototype.__proto__);// //Object
console.log(Fruit.prototype==Apple.prototype);//false
//由上測試可知,每個構(gòu)造函數(shù)都有一個系統(tǒng)自帶的prototype屬性,
//該屬性指向構(gòu)造函數(shù)的原型對象。
//擴(kuò)展原型方法 公有的
Fruit.prototype.show = function(){
console.log("green");
}
//原型方法可以直接調(diào)用
Fruit.prototype.show();
//Fruit.show();//undefined is not a function
//報錯,構(gòu)造函數(shù)中沒有show方法
console.log("修改原型之前");
var banner = new Fruit();
banner.show();//green
var obj = new Object();
obj.show = function(){
console.log("orange");
}
console.log("修改原型之后");
Fruit.prototype = obj;//原型指向另一個對象了。
var banner1 = new Fruit();
banner1.show();//orange
banner.show();//green
每個構(gòu)造函數(shù)都有一個系統(tǒng)自帶的prototype屬性,該屬性指向構(gòu)造函數(shù)的原型對象。
2.construction屬性、proto屬性
function Fruit(){
//對象私有 內(nèi)部var 定義
}
//原型公有的屬性
Fruit.prototype.water = true;
Fruit.prototype.name = "水果";
Fruit.prototype.eated = function(){
console.log(this.name+"可以吃哦");
}
console.log(Fruit);
//function Fruit(){}
console.log(Fruit.prototype);
//Fruit {water: true, name: "水果", eated: function}
console.log(Fruit.prototype.__proto__);
//Object {}
constructor屬性:每個原型對象都有一個constructor屬性,
constructor屬性指向的是該原型對象所在的構(gòu)造函數(shù)。
console.log(Fruit.prototype.constructor);
// function Fruit(){//對象私有 內(nèi)部var 定義}
console.log(Fruit.prototype.constructor==Fruit);//true
var a = new Fruit();
console.log(a);
//Fruit {water: true, name: "水果", eated: function}
console.log(a.__proto__);
//Fruit {water: true, name: "水果", eated: function}
console.log(Fruit.prototype);
//Fruit {water: true, name: "水果", eated: function}
console.log(a.__proto__ == Fruit.prototype);//true
console.log(a.__proto__.constructor);
//function Fruit(){//對象私有 內(nèi)部var 定義}
var obj = new Object();//等價于var obj = { };
obj.show = function(){
console.log("new Prototype");
}
console.log(obj);//Object {show: function}
console.log(obj.__proto__);// Object {}
console.log(obj.show);
//function (){console.log("new Prototype");}
console.log(obj.show.prototype);// obj.show {}
Fruit.prototype = obj;
var b = new Fruit();
console.log(b.__proto__);//Object {show: function}
console.log(b.__proto__.__proto__);//Object {}
console.log(b.__proto__ == obj);//true
b.show();// new Prototype
Fruit.prototype.constructor = Fruit;
var c = new Fruit();
console.log(c.__proto__);
//Fruit {show: function, constructor: function}
console.log(c.__proto__.constructor);
//function Fruit(){//對象私有 內(nèi)部var 定義}
console.log(c.__proto__.__proto__);// Object {}
c.show();//new Prototype
由上可知:
萬物皆對象!所以任何函數(shù)都是一個對象,每個對象都會包含一個prototype屬性,該屬性指向構(gòu)建函數(shù)的原型對象。而且每個原型對象都有一個constructor屬性,constructor屬性指向該函數(shù)的構(gòu)造函數(shù)。
每個對象里面都有一個包含創(chuàng)建該對象的時候指向原型對象的proto屬性
2、原型鏈
訪問對象里面的屬性的規(guī)則(原型鏈):
先在對象自身尋找,找不到去原型找,原型找不到去原型的原型上去找,直到找到Object.prototype為止。如果Object.prototype也沒有則報錯。
實(shí)例1)
function Animal(){ }
Animal.prototype.say = function(){
console.log("我是動物");
}
function MaoKe(){ }
MaoKe.prototype.say = function(){
console.log("我是貓科動物");
}
function Lion(){ }
Lion.prototype.say = function(){
console.log("我是獅子");
}
var shiziwang = new Lion();
console.log(Lion.prototype);//Lion
console.log(shiziwang.__proto__);//Lion
console.log(shiziwang.__proto__ == Lion.prototype);//true
Lion.prototype = MaoKe.prototype;
console.log(shiziwang);
//shiziwang是在更換原型對象之前定義的,所以這里的還是原來的
console.log(shiziwang.__proto__);//Lion {say: function}
//對象里面都有一個包含創(chuàng)建對象的時候指向原型對象的屬性__proto__
shiziwang.say();//我是獅子
console.log(Lion.prototype);//Maoke
shiziwang = new Lion();
console.log(shiziwang);//Lion {say: function}
console.log(shiziwang.__proto__);//MaoKe {say: function}
shiziwang.say();//我是貓科動物
實(shí)例2)
function Animal(){}
function MaoKe(){}
function Lion(){}
Animal.prototype.say = function(){
console.log("我是動物");
}
MaoKe.prototype.say = function(){
console.log("我是貓科動物");
}
Lion.prototype = new MaoKe();
//創(chuàng)建一個貓科對象賦值給獅子的原型
Lion.prototype.say = function(){
//這里L(fēng)ion.prototype.say實(shí)際上是覆蓋了MaoKe.prototype.say
console.log("我是獅子");
}
console.log(Lion.prototype);//MaoKe {say: function}
var shizi = new Lion();
console.log(shizi.__proto__);//MaoKe {say: function}
console.log(shizi.__proto__ == Lion.prototype);//true
console.log(shizi.__proto__.say);
//function (){console.log("我是獅子");}
console.log(shizi.__proto__.say.prototype);//Lion.say
shizi.say();// 我是獅子
實(shí)例3)
function Animal(){}
function MaoKe(){}
function Lion(){}
Animal.prototype.say = function(){
console.log("我是動物");
}
MaoKe.prototype = new Animal();
MaoKe.prototype.say = function(){
console.log("我是貓科動物");
}
Lion.prototype = new MaoKe();
Lion.prototype.say = function(){
console.log("我是獅子");
}
console.log(Lion.prototype);//MaoKe
console.log(MaoKe.prototype);//Animal
console.log(Animal.prototype);//Animal
var shizi = new Lion();
console.log(shizi.__proto__);//MaoKe
shizi.say();//我是獅子
delete Lion.prototype.say;
shizi.say();// 我是貓科動物
delete MaoKe.prototype.say;
shizi.say();// 我是動物
delete Animal.prototype.say;
shizi.say();// undefined is not a function