转载

如何优化JavaScript的构造函数

首先看一个构造函数User，我们在调用User创建一个实例的的时候，一般都是要写上new操作符的。在这里说明一下，如果使用new关键字调用构造函数，那么构造函数里面的this总是是指向一个全新的对象（即User的实例），如果不是使用new的话，那么this就指向global对象。User构造函数的定义如下：

function User(name, passwordHash) {     this.name = name;     this.passwordHash = passwordHash; }

User构造函数的正确的调用方法应该如下：

var u = new User("baravelli", "d8b74df393528d51cd19980ae0aa028e");

但是，假如调用者因为粗心，忘记了加上new关键字来调用，那结果会怎样呢？我们一起来测试一下：

var u = User("baravelli", "d8b74df393528d51cd19980ae0aa028e"); u; // undefined this.name; // "baravelli" this.passwordHash; // "d8b74df393528d51cd19980ae0aa028e"

结果构造函数竟然返回了undefined！！这也很正常的，因为不用new关键字，直接调用他的话，那就跟调用普通函数没有任何区别了，而User里面又没有return语句，所以返回值当然是undefined了。更加糟糕的是，如果不加new调用，User的里面的this就会指向全局对象了，那么它就会破坏全局对象，试想一下，假如全局对象本身就存在了name和passwordHash这两个变量，那么他们的值就会被修改了，这个危害是很大的。

如果，构造函数User里面开启了ES5的严格模式，那么不使用new操作符就会因为this绑定失败而抛出错误（注意：严格模式下是不允许this指向全局对象的），如下：

function User(name, passwordHash) {  "use strict";  this.name = name;  this.passwordHash = passwordHash; } var u = User("baravelli", "d8b74df393528d51cd19980ae0aa028e"); // error: this is undefined

这样的话，会抛出一个类型错误 // error: this is undefined 。但是，这个构造函数依然是很脆弱的，因为它只有在加new操作符的时候才可以正常工作。假如我们实现了一个构造函数，加不加new关键字都可以正常工作那就健壮多了！其实，实现起来也并不太难，我们只要在User构造函数里面判断this是否指向User的实例就行了，如果不是就创建一个User实例，如下：

function User(name, passwordHash) {     if (!(this instanceof User)) {         return new User(name, passwordHash);     }     this.name = name;     this.passwordHash = passwordHash; }

现在，不管你用不用new关键字来调用构造函数，他都可以正常工作了，测试一下：

var x = User("baravelli", "d8b74df393528d51cd19980ae0aa028e"); var y = new User("baravelli", "d8b74df393528d51cd19980ae0aa028e"); x instanceof User; // true y instanceof User; // true

但是上述实现方法还具有一个缺点，因为它两次调用了User构造函数（在不使用new关键字的时候），所以，降低了性能！而且，还有一个问题，就是对于可变参数的构造函数，它实现起来就会很困难的了。一种较优的办法就是借助于ES5的Object.create方法：

function User(name, passwordHash) {     var self = this instanceof User ? this : Object.create(User.prototype);     self.name = name;     self.passwordHash = passwordHash;     return self; }

这种方法，借助了Object.create方法，把User.prototype作为参数，创建了一个继承了User的新对象。但是，这种方法也是有缺陷的，我们前面已经说过了，Object.create是ES5的新标准，在一些旧的环境下可能无法工作。所以，我们还要判断Object.create是否存在。，如果不存在，则手动的去实现它：

if (typeof Object.create === "undefined") {     Object.create = function(prototype) {         function C() { }         C.prototype = prototype;         return new C();     }; }

最后，需要提醒的是，如果你的构造函数一定要使用new关键字的，那么必须要写文档说明，以免别人调用的时候没有用new操作符，产生意想不到的结果！

正文到此结束