原型鏈模式擴展
批量設(shè)置原型上的公有屬性
function Fn(){
this.x = 100;
}
Fn.prototype.getX = function(){
};
Fn.prototype.getY = function(){
};
Fn.prototype.getZ = function(){
};
var f1 = new Fn;
- 起一個別名
function Fn(){
this.x = 100;
}
var pro = Fn.prototype;
// 把原來原型指向的地址賦值給pro,現(xiàn)在它們操作的是同一個內(nèi)存空間
pro.getX = function(){
};
pro.getY = function(){
};
pro.getZ = function(){
};
var f1 = new Fn;
- 重構(gòu)原型對象的方式 -> 自己新開辟一個堆內(nèi)存,存儲我們共有的屬性和方法,把瀏覽器原來給Fn.prototype開辟的那個替換掉
function Fn(){
this.x = 100;
}
Fn.prototype = {
constructor: Fn, // 手動添加constructor
x: function(){
},
y: function(){
}
};
var f1 = new Fn;
f.a();
f.b();
//1. 只有瀏覽器天生給Fn.prototype 開辟的堆內(nèi)存里面才有constructor,
// 而我們自己開辟的這個堆內(nèi)存沒有這個屬性,這樣constructor指向就不再是Fn而是Object了
// 為了和原來的保持一致, 我們需要手動的增加constructor的指向
console.log(f.constructor) // -> (沒做任何處理之前) Object
a. 只有瀏覽器天生給Fn.prototype 開辟的堆內(nèi)存里面才有constructor, 而我們自己開辟的這個堆內(nèi)存沒有這個屬性,這樣constructor指向就不再是Fn而是Object了
為了和原來的保持一致, 我們需要手動的增加constructor的指向
function Fn(){
this.x = 100;
}
Fn.prototype = {
constructor: Fn, // 手動添加constructor
y: function(){
},
z: function(){
}
};
var f1 = new Fn;
f1.y();
f1.z();
console.log(f1.constructor) // ->Fn(){ this.x = 100; }
b. 用這種方式給內(nèi)置類增加公有的屬性
給內(nèi)置類Array增加數(shù)組去重的方法
Array.prototype = {
constructor: Array,
unique: function(){
}
}
這種方式會把之前已經(jīng)存在于原型上的屬性和方法給替換掉, 所以用這種凡是修改內(nèi)置類的話,瀏覽器是會屏蔽掉的
var ary = [1,2,2,1,2,3,4,2,1,3];
ary.sort();
console.log(ary); // -> [1, 1, 1, 2, 2, 2, 2, 3, 3, 4]
但是可以一個個的修改內(nèi)置的方法,當我們通過下述方式在數(shù)組的原型上增加方法,如果方法名和原來內(nèi)置的重復(fù)了,會把人家內(nèi)置的修改掉 -> 以后在內(nèi)置類的原型上增加方法,命名都需要加特殊的前綴;
Array.prototype.sort = function(){
console.log(this) // this -> ary 當前要操作的這個數(shù)組
// [1,2,2,1,2,3,4,2,1,3]
}
var ary = [1,2,2,1,2,3,4,2,1,3];
ary.sort();
console.log(ary); // -> [1,2,2,1,2,3,4,2,1,3]