继承
在实现JS继承时需要注意一个类依赖另一个类的内部实现这样的耦合关系。如果设计的是一个供众人使用的API,最好使用类继承方式。原型的方式更简洁也更节省内存。掺元适合即要共享类的方法又不需要结对的情况。
类式继承
//superClass
function Person(name) {
this.name = name;
}
Person.prototype.getName = function() {return this.name;}
//subClass
function Author(name, books) {
Person.call(this, name); //在子类中调用父类的构造.
this.books = books; // Add an attribute to Author.
}
Author.prototype = new Person(); // Set up the prototype chain.
Author.prototype.constructor = Author; // Set the constructor
Author.prototype.getBooks = function() { // Add method to Author.
return this.books;
};
function Person(name){
this.name = name;
}
Person.prototype.getName = function() {
return this.name;
};
function Author(name, books) {
Author.superclass.constructor.call(this, name);
this.books = books;
}
extend(Author, Person);
Author.prototype.getName = function() {
var name = Author.superclass.getName.call(this);
return name + ', Author of ' + this.getBooks().join(', ');
};
/* Extend function, improved.这处可以用JQUERY的EXTEND方法,比这个更好 */
function extend(subClass, superClass) {
var F = function() {};
F.prototype = superClass.prototype;
subClass.prototype = new F();
subClass.prototype.constructor = subClass;
subClass.superclass = superClass.prototype;
if(superClass.prototype.constructor == Object.prototype.constructor) {
superClass.prototype.constructor = superClass;
}
}
原型式继承
采用这种方式时,并不需要用类定义对象的结构,只需直接创建一个对象即可。这个对象随后可以被新的对象重用。这种方式可以看出,不需要定义子类的结构。代码更简洁,但也有优缺点,需要了解原型的实现方式。
function clone(object) {
function F() {}
F.prototype = object;
return new F;
}
var Person = {
name: 'default name',
getName: function() {
return this.name;
}
};
var reader = clone(Person);
如果原型中还有自己的子对象时,需要修改子对象的默认值时,最好采用工厂的创建方法。
var CompoundObject = {};
CompoundObject.string1 = 'default value',
CompoundObject.createChildObject = function() {
return {
bool: true,
num: 10
}
};
CompoundObject.childObject = CompoundObject.createChildObject();
var compoundObjectClone = clone(CompoundObject);
compoundObjectClone.childObject = CompoundObject.createChildObject();
compoundObjectClone.childObject.num = 5;
掺元
/*使receivingClass类具有givingClass类的所有方法*/
function augment(receivingClass, givingClass) {
for(methodName in givingClass.prototype) {
if(!receivingClass.prototype[methodName]) {
receivingClass.prototype[methodName] = givingClass.prototype[methodName];
}
}
}
/* 使receivingClass类具有givingClass类的特定方法. */
function augment(receivingClass, givingClass) {
if(arguments[2]) { // Only give certain methods.
for(var i = 2, len = arguments.length; i
方法的链式调用
定义一个构造函数,把元素作为数组保存在一个实例属性中,并让所有定义在构造函数的prototype属性所指对象中的方法都返回用以调用方法的那个实例的引用,那么就具有了进行链式调用的能力。
(function() {
function _$(els) {
}
_$.prototype = {
each: function(fn) {
for ( var i = 0, len = this.elements.length; i
构建一个简单的JS库框架
Function.prototype.method = function(name, fn) {
this.prototype[name] = fn;
return this;//指向_$
};
(function() {
function _$(els) {
}
_$.prototype = {
each: function(fn) {
for ( var i = 0, len = this.elements.length; i
链式调用很适合赋值操作,有时对于取值器方法,并不希望返回this,而是需要返回需要的数据,但如果不返回this就失去了链式调用的方便,所以这时可以使用callback Function。的方式。
window.API2 = window.API2 ||function(){
var name='ld';
this.setName = function(nn){
name = nn;
return this;
};
this.getName = function(cl){
cl.call(this, name);//此处相当于一个return
return this;
}
};
var o2 = new API2;
o2.getName(a).setName('Meow').getName(a);
function a(a){
console.log(a);
}
服务器托管,北京服务器托管,服务器租用 http://www.fwqtg.net
机房租用,北京机房租用,IDC机房托管, http://www.fwqtg.net
今天,我们有幸访问到这位 美容届大咖——陈琛老师 大家也会亲切的叫他:“阿琛老师” 他是美容师,健康管理师,形象设计师,华创网络科技聘请,伊的家妍诗美妍膳美外聘导师,有自己的工作室。 陈琛老师表示,现代越来越多的人注重美容与健康相结合,希望借助自己站出来,向更…