继承

在 js 中继承较为庞杂,比其它言语的继承要庞杂.在大多数面向对象言语中,继承一个类只需运用一个关键字即可,而 js 要传承公有成员的话须要运用天真玄妙的原型继承,或许范例的类继承.

本文第一部份将议论 js 中竖立子类的种种手艺以及它们的运用场所.

为何须要继承

先看看继承能带来的优点.设想类的时刻,希望能削减重复性的代码,只管弱化对象间的耦合.运用继承相符前一个准绳.可以在现有类的基础上举行设想并充分利用他们已具有的种种要领.
让一个类继承另一个类可以会致使二者发生强耦合,一个类依赖于另一个类的内部完成.接下来会讲到怎样防止.比方用掺元类为其他类供应要领…等等.

类继承

经由历程用函数来声明类,用关键字 new 来竖立实例,下面是一个简朴的类声明:

// Class Person
function Person(name) {
    this.name = name;
}

Person.prototype.getName = function() {
    return this.name;
}

起首要做的事竖立构造函数,名字就是类名,首字母大写.在构造函数中,竖立实例属性要运用关键字 this.类的要领则被增加到其 prototype 对象中.要竖立该类的实例,只需连系关键字 new 挪用这个构造函数:

var reader = new Person('John Smith');
reader.getName();

然后你可以接见统统的实例属性,也可以挪用统统的实例要领.

原型链

竖立继承 Person 的类要庞杂一些:

// Class Author
function Author(name, books) {
    Person.call(this, name); // Call the superclass's constructor in the scope of this.
    this.books = books; // Add an attribute to Author.
}

Author.prototype = new Person(); // Set up the person chain.
Author.prototype.constructor = Author; // Set the constructor attribute to Author.
Author.prototype.getBooks = function () { // Add to method to Author.
    return this.books;
}

让一个类继承另一个类须要用到很多行代码(不像其他面向对象言语只需一个关键字 extend 即可),起首要做的是竖立一个构造函数,在构造函数中,挪用超类的构造函数.并将 name 参数传给他,在运用 new 运算符时,系统会为你做一些事,会竖立一个空对象,然后挪用构造函数,在此历程当中这个空对象处于作用域链的最前端.
下一步是设置原型链,js 没有 extend 关键字,然则每一个 js 对象中都有一个名为 prototype 的属性,要么指向另一个对象,要么 Null.在接见对象的某个成员时(比方reader.getName),假如这个成员未见于当前对象,那末 js 会在prototype属性所指的对象中查找他,没找到js就会沿着原型链向上一一接见每一个原型对象,直到找到他(或许已查找过原型链最顶端的 Object.prototype 对象).
所以说为了让一个类继承另一个类,只需将子类的 prototype 设置为指向超类的一个实例即可.
为了让Author 继承 Person,必需手动地将 Author 的 prototype 设置为 Person 的一个实例,末了一步是将 prototype 的 constructor 属性重设为 Author(因为把 prototype 属性设置为 Person 的实例时,其 constructor 属性被抹掉了).
只管本例中为完成继承须要分外运用三行代码,然则竖立这个新的子类的的实例与竖立 Person 的实例没有什么差别:

var author = [];
author[0] = new Author('Dustin Diaz', ['Javascript Design Patterns']);
author[0] = new Author('Ross Harmes', ['Javascript Design Patterns']);

author[1].getName();
author[1].getBooks();

所以说,类式继承的庞杂性只局限于类的声明,竖立新实例的历程依旧很简朴.

extend 函数

为了简化类的声明,可以把派生子类的全部历程包装在一个名为 extend 的函数中,他的作用和其他言语的 extend 关键字类似,即基于一个给定的类构造竖立一个新类:

// Extend Function.

function extend(subClass, superClass) {
    var F = function () {};
    F.prototype = superClass.prototype;
    subClass.prototype = new F();
    subClass.prototype.constructot = subClass;
}

这个 extend 函数和先前我们做的一样,它设置了 prototype.然后再从新设置其 constructor 为其本身.有一项革新,他增加了空函数 F,并将用它竖立的一个对象实例插进去原型链中(如许可以防止竖立超类的新实例).
运用了 extend 函数后:

// Class Person.
function Person(name) {
    this.name = name;
}

Person.prototype.getName = function () {
    return this.name;
}

// Class Author.
function Author(name, books) {
    Person.call(this.name);
    this.books = books;
}

extend(Author, Person);

Author.prototype.getBooks = getBooks() {
    return this.books;
}

上面的代码不像之前那样手动地设置prototype 和 constructor 属性,而是经由历程在类声明以后(在向 prototype 增加任何要领之前)马上挪用 extend 函数.唯一的题目是超类(Person)的称号被固化在 Author 类的声明当中,更好的做法是下面那样:

// Extend function, improved.

function extend(subClass, superClass) {
    var F = function() {};
    subClass.prototype = new F();
    subClass.superclass = superclass.prototype;
    if (superClass.prototype.constructor == Object.prototype.constructor) {
        superClass.prototype.constructor = superClass;
    }
}

说到这个 革新版的extend函数,我想起了之前的一个东东,说要完成一个js类继承东西要领:

1. 继承

2. 多态
   如今想一想,此处的 extend 函数已完成了第一步,还差第二步,暂不议论.

该版本要长一点,然则供应了superclass 属性,这个属性用来弱化 Author 和 Person 之间的耦合.该函数的末了3行代码用来确保超类的 constructor 属性已被正确设置(立即超类就是 Object 类本身),在用这个新的superclass 属性挪用超类的构造函数时这个题目很重要:

// Class Author.
function Author(name, books) {
    Author.superclass.constructor.call(this, name);
    this.books = books;
}
extend(Author, Person);

Author.prototype.getBooks = function () {
    return this.books;
};

有了 superclass 属性,就可以直接挪用超类的要领,这在既要重定义超类的某个要领又想接见其在超类的完成时可以派上用场.比方,为了用一个新的 getName 要领重定义 Person 类中的同名要领,你可以先用Author.superclass.getName 取得作者名字,然后在此基础上增加其他信息:

Author.prototype.getName = function () {
    var name = Author.superclass.getName.call(this);
    return name + ',Author of' + this.getBooks(0.join(', ');
}

原型式继承

它与类式继承判然差别,现在最好忘记类和实例的统统学问,只从对象的角度来思索.用基于类的方法来竖立对象包括两个步骤:起首,用一个类的声明定义对象构造;第二,实例化该类以竖立一个新对象.用这类体式格局竖立的对象都有一套该类的统统实例属性的副本.每一个实例要领都只存在一份,然则每一个对象都有一个指向他的链接.
运用原型式继承并不须要用类来定义对象的构造,只需直接竖立一个对象即可.这个对象随后可以被新的对象重用,这个得益于原型链查找的事情机制.该对象被称为原型对象.取原型式继承这个称号是因为他为其他对象应有的情势供应了一个原型.
下面我们运用原型式继承从新设想 Person 和 Author:

// Person Prototype Object.
var Person = {
    name: 'default name',
    getName: function () {
        return this.name;
    }
};

这里没有运用一个名为 Person 的构造函数来定义类的构造,Person如今是一个对象字面量.他是所要竖立的其他种品种 Person 对象的原型对象.个中定义了统统类 Person 对象都要具有的属性和要领,而且有默认值.要领的默认值平常不会转变,然则属性与此相反.

var reader = clone(Person);
alert(reader.getName()); // This will output 'default name'.
reader.name ='John Smith';
alert(reader.getName()); // This will output 'John Smith'.

clone 函数可以用来竖立新的类 Person 对象.他会竖立一个空对象,二该对象的原型对象被设置成 Person.也就是说假如在这个新对象中查找不刀某个要领或许属性时,那末接下来会在其原型对象中继承查找.
没必要为竖立A Author 而定义一个一个 Person 的子类,只需实行一次克隆即可.

// Author Prototype Object.
var Author = clone(Person);
Author.books = []; // Default value.
Author.getBooks = function () {
    return this.books;
}

然后你可以重定义该克隆中的要领和属性.可以修正在 Person 中供应的默认值.也可以增加新的属性和要领.如许一来就竖立了一个新的原型对象.可以将其用于竖立新的类 Author 对象:

var author = [];

author[0] = clone(Author);
author[0].name = 'Dustin Diaz';
author[0].books = ['Javascript Design Patterns'];

author[1] = clone(Author);
author[1].name = 'Ross Harmes';
author[1].books = ['Javascript Design Patterns'];

author[1].getName();
author[1].getBooks();

对继承而来的成员的读写不对等性

在类式继承中,Author 的每一个实例都有一份本身的 books 数组副本,可以用代码 author[1].books.push('New Book Title')为其增加元素.然则关于运用原型式继承体式格局竖立的类 Author 对象来讲,因为原型链的事情体式格局,这类做法行不通.一个克隆并不是其原型对象的一份完整自力的副本,只是一个以谁人对象为其原型对象的空对象罢了.克隆刚被竖立时,author[1].name 现实上是一个指向最初的Person.name 的链接,关于从原型对象继承而来的成员,其读和写具有内涵的不对等性.在读取 author[1].name 的值时,假如还没有直接为 author[1]实例定义 name 属性的话,那末所获得的事其原型对象的同名属性值.而在写入 author[1].name 的值时,你是在直接为 author[1]对象定义一个新属性.下面这个实例显现了这类不对等性:

var authorClone = clone(Author);
console.log(authorClone.name); // Linked to the primative Person.name, which is the string 'default name'.
authorClone.name = 'new name';// A new primative is created and added to the authorClone object itself.
console.log(authorClone.name); // Now linked to the primative authorClone.name, which is the string 'new name'.

authorClone.books.push('new book'); // authorClone.books is linked to the arrayAuthor.books. We just modifiedthe prototype object's default value, and all other objects that link to it will now have a new default value there.
authorClone.books = []; // A new array is created andadded to the authorClone object itself.
authorClone.books.push('new book'); // We are now modifying that new array.

上面的例子说清晰明了为何必需经由历程援用通报的数据范例的属性竖立新副本.向 authorClone.books 数组增加新元素现实上是把这个元素增加到Author.books 数组中,如许的话值的修正会同时影响到Author 和统统继承了 Author 但还未改写谁人属性的默认值的对象.这类毛病必需只管防止,调试起来会异常费时.在这类场所,可以运用 hasOwnProperty 要领来辨别对象的现实成员和继承而来的成员.
偶然原型对象本身也含有子对象.假如想掩盖其子对象中的一个属性值,不得不从新竖立全部子对象.这可以经由历程将该子对象设置为一个空对象字面.然后对其重塑.但这意味着克隆出来的对象必需晓得其原型对象的每一个子对象的确实构造.和默认值.为了只管弱化对象之间的耦合,任何庞杂的子对象都应当运用要领来竖立:

var ComponoudObject = {
    string1: 'default value',
    childObject: {
        bool: true,
        num: 10
    }
}

var CompoundObject = {
    string1: 'default value',
    childObject: {
        bool: true,
        num: 10
    }
}
var compoundObjectClone = clone(CompoundObject);

// Bad! Changes the value of CompoundObject.childObject.num.
compoundObjectClone.childObject.num = 5;
// Better. Creates a new object, but compoundObject must know the structure of that object, and the defaults. This makes CompoundObject and compoundObjectClone tightly coupled.
compoundObjectClone.childObject = {
    bool: true,
    num: 5
};

在这个例子中,为 compoundObjectClone 必需晓得 childObject 具有两个默认值离别为 true 和10的属性.这里有一个更好的方法: 用工场方法来竖立 childObject:

// Best approach. Uses a method to create a new object, with the same structure and defaults as the original.

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;

clone 函数

之前的例子用来竖立克隆对象的 clone 函数究竟是什么样呢:

// Clone function.

function clone(object) {
    function F() {}
    F.prototype = object;
    return new F;
}

clone 函数起首竖立了一个新的空函数 F,然后将 F 的 prototype 属性设置作为参数 object 传入的原型对象.prototype 属性就是用来指向原型对象的,经由历程原型链机制,它供应了到统统继承而来的成员的链接.该函数末了经由历程把 new 运算符作用于 F 竖立出一个新对象.然后把这个新对象作为返回值返回.函数所返回的这个克隆效果是一个一给定对象为原型对象的空对象.

类式继承和原型式继承的对照

类式继承和原型式继承是天差地别的两种继承范型,他们天生的对象也有差别的行动体式格局.须要对二者的优瑕玷和特定运用场所举行相识.
假如你设想的是一个世人运用的 API,或许可以会有不熟悉原型式继承的其他程序员基于你的代码举行革新.那末最好运用类式继承.

原型式继承更能勤俭内存.原型链读取成员的体式格局使得统统克隆出来的对象都同享每一个属性和要领的唯一一份实例,只要在直接设置了某个克隆出来的对象的属性和要领时,状况才会变化.

类式继承体式格局中竖立的每一个对象在内存中都有本身的一套属性(和私有要领)德芙笨.所以说原型式继承更勤俭内存,而且只运用一个 clone 函数也越发精练,不须要像后者那样须要为每一个想继承的类写上好几行如许的艰涩代码:
`SuperClass.call(this, arg)和 SubClass.prototype = new SuperClass…`
不过也可以写到 extend 要领内里去,所以说末了究竟运用哪一种继承体式格局除了斟酌现实状况以外还取决于你的口胃.

继承和封装

如今来谈谈封装对继承的影响.
从现有的类派生出一个子类时,只要公有和特权成员会被继承下来,然则私有成员没法继承下来.
因为这个缘由,流派大开型类是最合适派生子类的,它们的统统成员都是公然的,可以被遗传给子类,假如某个成员须要略加隐蔽,可以运用下划线范例.
在派生具有真正的私有成员的类时,特权要领是公有的,所以会被遗传下来.所以可以在子类中心接接见父类的私有属性.然则子类的实例要领都不能直接接见这些私有属性.父类的私有成员只能经由历程这些既有的特权要领接见到,在子类中增加新特权要领也接见不到.

掺元类

这是一种没有严厉继承,重用代码的要领.是如许,假如想把一个函数用到多个类中,可以经由历程扩大的体式格局让这些类同享该函数.

先竖立一个包括种种通用要领的类,然后再用它扩大其他类,这类类叫做掺元类(mixin class),一般不会被实例化或许直接挪用,只是向其他类供应本身的要领(说实话这个 mixin 在种种场所是不是是很熟悉呢…种种 js 框架,css 预处理,是不是是都跟这个有关呢…):

// Mixin class.
var Mixin = function () {};
Mixin.prototype = {
    serialize: function () {
        var output = [];
        for (key in this) {
            output.push(key + ';' + this[key]);
        }
        retyurn output.join(', ');
    }
};

这个 Mixin 类只要一个名为 serialize 的要领,遍历 this 对象的统统成员并输出一个字符串.这类要领可以在很多差别范例的类中都邑用到,然则没有必要让这些类都继承 Mixin,最好是用一个函数 augment 把这个要领增加到每一个须要他的类中:

augment(Author, Mixin);

var author = new Author('Ross Harmes', ['Javascript Design Patterns']);
var serializaedString = author.serialize();

在此我们用 Mixin 类中的统统要领扩大了 Author 类,Author 类的实比方今就可以挪用 serialize 要领了,称为为多亲继承 multiple inheritance.只管在 js 中一个对象只能用有一个原型对象,不允许子类继承多个超类,然则一个类可以用多个掺元类扩大,现实上也就完成了多继承.
augment 函数很简朴,现实上是用一个 for…in 轮回遍历 第二个参数(Mixin 类,予类 giving class)的 prototype 中的每一个成员,并将其增加到第一个参数(受类 receiving class)的 prototype 中,假如受类中已存在同名成员,那末跳过它,如许受类中的成员就不会被改写.假如你想到达这么一个目标: 只复制掺元类当中的一两个要领,那末就可以给 augment 函数加上第三个及更多的可选参数:

// Augment function, improved.
function augment(receivingClass, givingClass) {
    if (arguments[2]) { // Only give certain methods.
        for (var i = 2, len = arguments.length; i < len; i++) {
            receivingClass.prototype[arguments[i]] = givingClass.prototype[arguments[i]];
        }
    }
    else { // Give all methods.
        for (methodName in givingClass.prototype) {
            if (!receivingClass.prototype[methodName]) {
                receivingClass.prototype[methodName] = givingClass.prototype[methodName];
            }
        }
    }
}

如今运用 augment(Author, Mixin, ‘serialize’);z可以只为 Author 类增加一个 serialize 要领的目标了.
从条理性的角度来看,严厉的继承计划比扩大计划越发清晰.掺元类异常合适于构造那些相互判然差别的类所同享的要领.

小结

继承的优点重要表如今代码的重用方面.经由历程竖立类或许对象之间的继承关联,有些要领我们只需定义一次即可.假如须要修正这些要领或许排查个中毛病,那末因为其定义只出如今一个位置,所以异常节约时间.

种种继承范型各有优瑕玷.

原型式继承事情机制: 先竖立一些对象然后再对其举行克隆,从而获得竖立子类和实例的等效效果.用这类方法竖立的对象有很高的内存效力,因为它们会同享那些未被改写的属性和要领.

在内存效力重要的场所原型式继承(clone 函数)是最好挑选,假如你更轻易接受其他面向对象言语中的继承机制,那末关于 js 继承照样选用类式继承(extend 函数)比较好.这两种要领都合适于类间差别较小的类条理系统(hierarchy).
假如类之间的差别较大,那末用掺元类来扩大这些类会更合理.

———— 分割线 ———-

单体

也叫单例情势singleton,js 中最基础也最有用.将代码构造为一个逻辑单位,可以经由历程单一的变量举行接见.单体对象只存在一份实例,统统代码运用的都是一样的全局资本.
单体类在 js 中有很多用处,可以用来离别定名空间,削减网页中全局变量的数量.它们还可以在一种名为分支的手艺中用来封装浏览器之间的差别(在运用种种经常使用的东西函数时就没必要再费心浏览器嗅探的事).
最重要的是,可以把代码构造的越发一致,可保护性进步.
在网页上运用全局变量有很大的风险,而用单体对象竖立的定名空间是消灭这些全局变量的最好手腕之一.

基础构造

这里先议论最基础最简朴的范例,一个对象字面量,把一批有肯定关联的要领和属性构造在一同:

// Basic Singleton.
var Singleton = {
    attribute1: true,
    attribute2, 10,

    method1: function () {

    },
    method2: function (arg) {

    }
};

示例中,统统成员都可以经由历程变量 Singleton 接见.可以运用圆点运算符.
这个单体对象可以被修正.可以为其增加新成员,也可以用 delete 运算符删除其现有成员.现实上违犯了面向对象设想的一条准绳:类可以被扩大,但不应当被修正(原理有点像 css classes 的增减).区分于其他面向对象言语js 中的统统对象都易变,假如某些变量须要庇护,那末可以将其定义在闭包当中.
你可以注重到了,方才的示例并不是单体,因为依据定义,单体是一个只能被实例化一次而且可以经由历程一个接见点接见的类,而这个例子不是一个可实例化的类.我们可以把单体定义地更广义一些:
单体是一个可以用来离别定名空间并将一批相干要领和属性构造到一同的对象,假如可以被实例化,那末它只能被实例化一次.
并不是统统对象字面量都是单体,假如只是用来模拟关联数组或许包容数据的话,那就不是单体;然则假如是用来构造一批相干要领和属性的话就有多是单体.

离别定名空间

单体对象有两部份: 包括着要领和属性成员的对象本身,另有用于接见它的变量.这个变量一般是全局性的,这个变量一般是全局性的,一遍在网页上任何地方都能直接接见到它所指向的单体对象.

虽然定义单体没必要是全局性的,然则它应当在各个地方都能被接见,因为单体对象的统统内部成员都被包装在这个对象中,所以它们不是全局性的.

因为这些成员只能经由历程这个单体对象变量举行接见,所以可以说它们被单对对象圈在了一个定名空间中.

// using a namespace.
var MyNameSpace = {
    findProduct: function(id) {
        ...
    },
    // Other methods can go there as well.
}

...

// Later in your page, another programmer adds...
var resetProduct = $('reset-product-button');
var findProduct = $('reset-product-button'); // NOthing was overwritten.

如今 findProduct 函数是MyNameSpace中的一个方法,他不会被全局定名空间中声明的任何新变量改写.该要领依旧可以从各个地方接见,然则如今挪用体式格局不是 findProduct(id),而是 MyNameSpace.findProduct(id).

用作特定网页专用代码的包装器的单体

已晓得怎样把单体作为定名空间运用,如今我们在引见单体的一个特别用处.

有些 js 代码是一个网站中统统网页都要用到的,一般被存放在自力的文件中;有些代码则是某个网页专用的,不会被用到其他地方,可以把这两种代码离别包装到本身的单体对象中.

具有私有成员的单体

之前我们议论过竖立类的私有成员的做法,运用真正私有要领一个瑕玷在于它们比较斲丧内存,因为每一个实例都具有要领的一份新副本,不过因为单体对象只会被实例化一次,所以定义真正的私有要领时不必斟酌内存.不过我们先谈谈更简朴的竖立伪私有成员的做法.

运用下划线

// DataParser singleton, coverts character delimited strings into arrays.

GaintCorp.DAtaParser = {
    // private methods.
    _stripWhitespace: function (str) {
        return str.replace(/\s+/, '');
    },
    _stringSplit: function(str, delimiter) {
        return str.splist(delimiter);
    },

    // Public method.
    stringToArray: function(str, delimiter, stripWS) {
        if (stripWS) {
            str = this._stripWhitespace(str);
        }
        var outputArray = this._stringSplit(str, delimiter);
        return outputArray;
    }
};

运用闭包

在单体对象中竖立私有成员的第二种方法须要借助闭包.与之前竖立真正私有成员的做法异常类似.
但也有重要区分.先前的做法是把变量和函数定义在构造函数体内(不运用 this 关键字),另外还在构造函数内定义了统统的特权要领并用 this 关键字使其可被外界接见.每天生一个该类的实例时,统统声明在构造函数内的要领和属性都邑再次竖立一份,可以会异常低效.
因为单体只会被实例化一次,所以构造函数内成员个数不是重点.每一个要领和属性都只会被竖立一次,所以可以把它们都声明在构造函数内(位于同一个闭包内)

// Singleton as an Object Literal.
MyNamespace.Singleton = {};

// Singleton with Private Members, step 1.
MyNamespace.Singleton = function () {
    return {};
}();

上面两个 MyNamespace.Singleton 完整雷同.关于第二个,并没有把一个匿名函数赋给 MyNamespce.Singleton而是返回一个对象再赋值.函数定义后的大括号是为了马上实行该函数.还可以像下面那样再套上一对圆括号.

如今也许可以晓得,谈到单体,有两个关键词:闭包+大括号
再回忆一下,可以把公有成员增加到单体所返回的谁人对象字面量:

//Singleton with Private Members, step 2.

MyNamespace.Singleton = (function () {
    return { // Public members.
        publicAttribute0: true,
        publicAttribute2: 99,

        publicMethod1: function () {
            ...
        }
    };
})();

运用闭包和运用一个对象字面量的区分在于:
关于前者,任何声明在匿名函数中(但不是在谁人对象字面量中)的变量或许函数都只能被在同一个闭包中声明的其他函数接见.这个闭包在匿名函数完毕实行后依旧存在,所以在个中声明的函数和变量总能从匿名函数所返回的对象内部接见.

单体情势跟js模块化有肯定关联,所以又称模块情势,意指他可以把一批相干要领和属性构造为模块并起到离别定名空间.

比较

如今我们不再为每一个私有要领称号的开首增加一个下划线,而是把这些要领定义在闭包中:

// DataParser singleton, converts character delimited strings into arrays.
// Now using true private methods.

CiantCorp.DataPraser = (function () {
    // Private attributes.
    var whitespaceRegex =/\s+/;

    // Private methods.
    function stripWhitespace(str) {
        return str.repalce(whitespaceRegex, '');
    }
    function stringSplit(str, delimiter) {
        return str.split(delimiter);
    }

    // Everything returned in the object literal is public, but can access the members in the closure created above.

    return {
        // Public method.
        stringToArray: function(str, delimiter, stringWS) {
        if (stringWS) {
            str = stripWhitespace(str);
        }
        var outputArray = stringSplit(str, delimiter);
        return outputArray;
        }
    };
})();
// Invoke the functio nand assign the returned object literal to GiantCorp.DataParser.

如今这些私有要领和属性可以直接用其称号接见,没必要在其前面加上 this.或许GaintCorp.DataParser,这些前缀只用于接见单体对象的公有成员.
单体比拟于下划线示意法有几点上风:

• 把私有成员放到闭包中可以确保其不会在单体对象以外被运用.

• 可以恣意转变对象完成细节,不损坏其他代码.

• 还可以对数据举行庇护和封装.

运用单体时,可以享用真正的私有成员带来的优点,单体类只会被实例化一次,可以节约内存.这是单体情势成为受欢迎,运用普遍的情势之一的缘由.

注重事项:公有成员和私有成员的声明语法不一样,前者被声明在对象字面量内部而后者并不是如许.私有属性必需用 var 声明,不然它将成为全局性的,私有要领是按 `function funcName (args) {...}` 如许的情势声明,在末了一个大括号以后不须要运用分号,公有属性和要领离别依据 attributeName: attributeValue 和 `methodName: function (args) {...}`如许的情势声明.假如背面还要声明别的成员的话,那末该声明的背面应当加上一个逗号.

惰性实例化

之前的单体情势的种种完成体式格局有一个共同点:单体对象都是在剧本加载时被加载出来,假如单体资本麋集或许设置开支大,那末更合理的做法是将其实例化推晚到须要运用它的时刻.被称为惰性加载,最经常使用于那些必需加载大批数据的单体.那些被用做定名空间,特定网页专用代码包装器,构造相干有用要领的东西的单体最好照样马上实例化.
惰性加载单体的特别之处在于对他们的接见必需借助于一个静态要领.如许挪用: Singleton.getInstance().methodName(),而不是如许挪用: Singleton.methodName().getInstance()要领荟兼差单体是不是已被实例化,假如还没有,那末将竖立而且返回实例.假如实例化过,那末它将返回现有实例.下面我们从前面谁人具有真正私有成员的单体动身将一般单体转化为惰性加载单体(转化事情第一步是把单体的统统代码移到一个叫做 constructor 的要领中:

// General skeleton for a lazy loading singleton, step 1.

MyNamespace.Singleton = (function() {

    function constructor () { // All of the normal singleton code goes here.
        // Private members.
        var privateAttribute1 = false;
        var privateAttribute2 = [1, 2, 3];

        function privateMethod1 () {
            ...
        }
        function privateMethod2 () {
            ...
        }

        return  { // Public members.
            publicAttribute1: true,
            publicAttribute2: 2,

            publicMethod1: function () {
                ...
            }
        }
    }
})();

这个要领不能从闭包外部接见这是件功德,因为我们想控制挪用机遇.公有要领 getInstance 就是要这么做,为了使其成为公有要领,只须要将其放到一个对象字面量中而且返回该对象即可:

// General skeleton for a lazy loading singleton, step 2.

MyNamespace.Singleton = (fucntion () {
    function constructor() { // All of the normal singleton code goes here.
        ...
    }

    return  {
        getInstance: function () {
            // Control code goes here.
        }
    }
})();

如今议论怎样编写控制实例化机遇的代码.起首,必需晓得该类是不是被实例化过;其次,假如该类被实例化过,那末他须要控制其实例的状况,以便能返回这个示例;要做到这两点,须要用到一个私有属性和已有的私有要领constructor:

// General skeleton for a lazy loading singleton, step 3.
MyNamespace.Singleton = (function () {
    var uniqueInstance; // Private attribute that holds the single instance.

    function constructor () { // All of the normal singleton code goes here.
        ...
    }

    return {
        getInstance: function () {
            if (!uniqueInstance) { // Intantiate only if the instance doesn't exist.
                uniqueInstance = constructor();
            }
            return uniqueInstance;
        }
    }
})();

惰性加载单体瑕玷在于庞杂性,用于竖立这类范例的单体代码并不直观,不轻易明白.假如你须要竖立一个耽误加载实例化的单体,那末最好为其写解释,以避免他人把其简化为一般单体.

分支

一种用来将浏览器间的差别封装到在运转时期举行设置的动态要领中的手艺.假定我们须要竖立一个返回 XHR 对象的要领,这个XHR对象在大多数浏览器中是 XMLHttpRequest 类的实例,而在 IE 初期版本中则是某种 ActiveX 类的实例.我们要竖立的要领一般会举行某种浏览器嗅探或许对象检测.假如不必分支手艺,那末每次挪用时,统统那些浏览器嗅探代码都要再次运转.假如挪用频仍,那末会很低效.
更有用的做法是只在剧本加载时一次性地肯定针对特定浏览器的代码,遮盖的话,在初始化后,每种浏览器都邑只实行针对他的 js 完成而设想的代码.可以在运转时动态肯定函数代码的才能,是 js 的高度天真性和壮大表现才能的一种表现,进步了挪用这些函数的效力.
在之前,单体对象的统统代码都是在运转时肯定的,这在鄙薄竖立私有成员的情势中很轻易看出来:

MyNamespace.Singleton = (function () {
    return {};
})();

这个匿名函数在运转时实行,返回的对象字面量赋值给 MyNamespace.Singleton 变量.

示例: 竖立 XHR 对象

如今我们要竖立一个单体,他有一个用来天生 XHR 对象实例的要领.
起首推断分支数量,因为统统实例化的对象只要3种差别范例,所以须要3个分支,离别依据其返回的XHR 对象范例定名:

// SimpleXhrFactory singleton.
var SimpleXhrFactory = (function () {

    // Three branches.
    var standard = {
        createXhrObject: function () {
            return new XMLHttpRequest();
        }
    };
    var activeXNew = {
        createXhrObject: function () {
            return new ActiveXObject('Msxml2.XMLHTTP');
        }
    };
    var activeXOld = {
        createXhrObject: function () {
            return new ActiveXObject('Microsoft.XMLHTTP');
        }
    };

    // To assign the branch, try each method,
    var testObject;
    try {
        testObject = standard.createXhrObject();
        return standard; // Return this if no error was thrown.
    }
    catch(e) {
        try {
            testObject = activeXNew.createObject();
            return activeNew;
        }
        catch(e) {
            try {
                testObject = activeXOld.createXhrObject();
                return activeXOld;
            }
            catch(e) {
                throw new Error('No XHR object found in the environment.');
            }
        }
    }

})();

上面的示例代码竖立了三个对象字面量,它们有雷同一个要领 createXhrObject(),它是用来返回一个可以实行异步要求的新对象,很明显名字虽然一样,要领内部代码不一样,分支之间作出挑选的推断前提值是在运转时肯定.这类前提一般是某种才能检测的效果,目标在于确保运转代码的 js 环境正确地完成了所须要的前提特征.
本例中,详细的前提推断步骤是如许的: 运用 try{...} catch{...} 来一一尝试每种 XHR 对象,直到碰到一个当前 js 环境所支撑的对象为止.

运用该 API,只需挪用SimpleXhtFacyory.createXhtObject();就可以获得合适特定的运转时环境的 XHR 对象.用了分支手艺,统统那些特征嗅探代码只会实行一次,不是每天生一个对象就要实行一次.

单体的运用场所

运用单体,一则,供应定名空间,二则,加强其模块性.
单体情势险些适用于统统大大小小的项目,在简朴快开辟的项目中,可以只把单体用作定名空间,将本身的统统代码构造在一个全局变量名下;在稍大稍庞杂的项目中,把单体用来把相干代码构造在一同以便往后保护;在大型项目中:那些开支较大却很少运用的组件可以被包装到惰性加载单体中,而针对特定环境的代码可以被包装到分支型单体中.
险些统统项目都邑用到某种情势的单体,js 的天真性使得单体可以被用于多种差别使命,它在 js 当中的重要性大大凌驾他在其他言语中的重要性.因为它可以用来竖立定名空间以削减全局变量的数量.因为全局变量在 js 中很轻易被其他人重写,所以相称风险,单体情势可以很好的处理这类题目.

利

重要优点在于对代码的构造.
把相干要领和属性构造在一个不会被屡次实例化的单体中,可以使得代码的调试和保护更轻松.单体可以把你的代码和第三方库代码,广告代码哥脱离,进步网页的稳定性.
单体的一些高等变体可以在开辟周期的后期用于对剧本举行优化,提拔机能.
惰性实例化,可以直到须要一个对象的时刻才竖立它,从而削减哪些不须要他的用户蒙受的没必要要的内存斲丧.
分支手艺可以依据运转时前提肯定赋给单体变量的对象字面量,竖立出为特定环境量身定制的要领,不会在每次挪用时都频频浪费时间去搜检运转环境.

弊

重要的客观瑕玷:
单体供应的是一种单点接见,所以可以致使模块间强耦合,不利于单位测试.没法零丁测试一个挪用了来自单体的要领的类,只能把她与谁人单体作为一个单位一同测试.
而关于离别定名空间,完成分支型要领这些用处,耦合不是什么题目.
偶然刻某些其他更高等的情势比单体高等变体更相符使命须要.
假造代办与惰性加载单体,可以赋予你对类实例化体式格局更多的控制;还可所以用一个对象工场来庖代分支型单体.

小结

作为 js 中最基础的情势,它不仅可以零丁运用,还能和大多数其他情势合营运用.
比方,对象工场可以被设想为单体,组合对象的统统子对象也可以被封装进一个单体定名空间中.
本书讲的是怎样竖立可重用的模块化代码,单体对全局变量的削减具有重要作用.