首先看一个构造函数User,我们在调用User创建一个实例的的时候,一般都是要写上new操作符的。在这里说明一下,如果使用new关键字调用构造函数,那么构造函数里面的this总是是指向一个全新的对象(即User的实例),如果不是使用new的话,那么this就指向global对象。User构造函数的定义如下:
  1. function User(name, passwordHash) {
  2. this.name = name;
  3. this.passwordHash = passwordHash;
  4. }
 User构造函数的正确的调用方法应该如下:
  1. var u = new User("baravelli", "d8b74df393528d51cd19980ae0aa028e");
但是,假如调用者因为粗心,忘记了加上new关键字来调用,那结果会怎样呢?我们一起来测试一下:
  1. var u = User("baravelli", "d8b74df393528d51cd19980ae0aa028e");
  2. u; // undefined
  3. this.name; // "baravelli"
  4. this.passwordHash; // "d8b74df393528d51cd19980ae0aa028e"
 
结果构造函数竟然返回了undefined!!这也很正常的,因为不用new关键字,直接调用他的话,那就跟调用普通函数没有任何区别了,而User里面又没有return语句,所以返回值当然是undefined了。更加糟糕的是,如果不加new调用,User的里面的this就会指向全局对象了,那么它就会破坏全局对象,试想一下,假如全局对象本身就存在了name和passwordHash这两个变量,那么他们的值就会被修改了,这个危害是很大的。
 
如果,构造函数User里面开启了ES5的严格模式,那么不使用new操作符就会因为this绑定失败而抛出错误(注意:严格模式下是不允许this指向全局对象的),如下:
  1. function User(name, passwordHash) {
  2. "use strict";
  3. this.name = name;
  4. this.passwordHash = passwordHash;
  5. }
  6.  
  7. var u = User("baravelli", "d8b74df393528d51cd19980ae0aa028e");
  8. // error: this is undefined
这样的话,会抛出一个类型错误// error: this is undefined。但是,这个构造函数依然是很脆弱的,因为它只有在加new操作符的时候才可以正常工作。假如我们实现了一个构造函数,加不加new关键字都可以正常工作那就健壮多了!其实,实现起来也并不太难,我们只要在User构造函数里面判断this是否指向User的实例就行了,如果不是就创建一个User实例,如下:
  1. function User(name, passwordHash) {
  2. if (!(this instanceof User)) {
  3. return new User(name, passwordHash);
  4. }
  5. this.name = name;
  6. this.passwordHash = passwordHash;
  7. }
 
现在,不管你用不用new关键字来调用构造函数,他都可以正常工作了,测试一下:
  1. var x = User("baravelli", "d8b74df393528d51cd19980ae0aa028e");
  2. var y = new User("baravelli",
  3. "d8b74df393528d51cd19980ae0aa028e");
  4. x instanceof User; // true
  5. y instanceof User; // true
 
  但是上述实现方法还具有一个缺点,因为它两次调用了User构造函数(在不使用new关键字的时候),所以,降低了性能!而且,还有一个问题,就是对于可变参数的构造函数,它实现起来就会很困难的了。一种较优的办法就是借助于ES5的Object.create方法:
  1. function User(name, passwordHash) {
  2. var self = this instanceof User ? this : Object.create(User.prototype);
  3. self.name = name;
  4. self.passwordHash = passwordHash;
  5. return self;
  6. }
 这种方法,借助了Object.create方法,把User.prototype作为参数,创建了一个继承了User的新对象。但是,这种方法也是有缺陷的,我们前面已经说过 了,Object.create是ES5的新标准,在一些旧的环境下可能无法工作。所以,我们还要判断Object.create是否存在。,如果不存在,则手动的去实现它:
  1. if (typeof Object.create === "undefined") {
  2. Object.create = function(prototype) {
  3. function C() { }
  4. C.prototype = prototype;
  5. return new C();
  6. };
  7. }
最后,需要提醒的是,如果你的构造函数一定要使用new关键字的,那么必须要写文档说明,以免别人调用的时候没有用new操作符,产生意想不到的结果!

如何优化JavaScript的构造函数的更多相关文章

  1. 优化javaScript代码,提高执行效率

    今天看完书,总结了一下可以如何优化 JavaScript . 1.合并js文件 为优化性能,可以把多个js文件(css文件也可以)合并成极少数大文件.跟十个5k的js文件相比,合并成一个50k的文件更 ...

  2. 深入理解Javascript中构造函数和原型对象的区别

    在 Javascript中prototype属性的详解 这篇文章中,详细介绍了构造函数的缺点以及原型(prototype),原型链(prototype chain),构造函数(constructor) ...

  3. Javascript中构造函数的返回值问题和new对象的过程

    首先明确一点:javascript中构造函数是不需要有返回值的,这一点跟java很类似.可以认为构造函数和普通函数的最大差别就是:构造函数中没有return语句,普通函数可以有return语句:构造函 ...

  4. 解决JavaScript中构造函数浪费内存的问题!

    解决JavaScript中构造函数浪费内存的问题! 把构造函数中的公共的方法放到构造函数的原型对象上! // 构造函数的问题! function Gouzaohanshu(name, age, gen ...

  5. Javascript正则构造函数与正则表达字面量&&常用正则表达式

    本文不讨论正则表达式入门,即如何使用正则匹配.讨论的是两种创建正则表达式的优劣和一些细节,最后给出一些常用正则匹配表达式. Javascript中的正则表达式也是对象,我们可以使用两种方法创建正则表达 ...

  6. JavaScript使用构造函数获取变量的类型名

    在JavaScript中,如何准确获取变量的类型名是一个经常使用的问题. 但是常常不能获取到变量的精确名称,或者必须使用jQuery 中的方法,这里 我通过 typeof ,jQuery.type 和 ...

  7. Javascript中构造函数与new命令

    典型的面向对象编程语言(比如C++和Java),存在“类”(class)这个概念.所谓“类”就是对象的模板,对象就是“类”的实例.但是,在JavaScript语言的对象体系,不是基于“类”的,而是基于 ...

  8. Javascript中构造函数与new命令2

    典型的面向对象编程语言(比如C++和Java),存在"类"(class)这个概念.所谓"类"就是对象的模板,对象就是"类"的实例.但是,在J ...

  9. Javascript将构造函数扩展为简单工厂

    一般而言,在Javascript中创建对象时需要使用关键字new(按构造函数去调用),但是某些时候,开发者希望无论new关键字有没有被显式使用,构造函数都可以被正常调用,即构造函数同时还具备简单工厂的 ...

随机推荐

  1. DevExpress v18.1新版亮点——Data Access篇

    用户界面套包DevExpress v18.1日前正式发布,本站将以连载的形式为大家介绍各版本新增内容.本文将介绍了DevExpress Data Access v18.1 的新功能,快来下载试用新版本 ...

  2. perl代码调试

    perl调试教程 一.DESCRIPTIONA (very) lightweight introduction in the use of the perl debugger, and a point ...

  3. JAVA基本类型和包装类

    JAVA的包装类 Java语言是一个面向对象的语言,但是Java中的基本数据类型却是不面向对象的,这在实际使用时存在很多的不便,为了解决这个不足,在设计类时为每个基本数据类型设计了一个对应的类进行代表 ...

  4. excel的操作

    python可以对excel进行写的操作,读的操作和修改的操作,做不同的功能需要导入不同的模块 1.对 excel进行写的操作 import xlwt book=xlwt.Workbook() #新建 ...

  5. mysql储存引擎

    Mysql数据库常用存储引擎 数据库存储引擎:是数据库底层软件组织,数据库管理系统(DBMS)使用数据引擎进行创建.查询.更新和删除数据.不同的存储引擎提供不同的存储机制.索引技巧.锁定水平等功能,使 ...

  6. Oracle对象(视图、序列、索引)

    数据库对象:表.视图.序列.索引.同义词创建视图:create view 名 as 子查询描述结构:describe 对象名修改视图:create or replace view 名 as 子查询 视 ...

  7. Python学习笔记第八周

    目录: 一.基础概念 1.动态导入模块 2.断言机制 3.SocketServer 二.作业 FTP服务器 三.单独注明 1.类中装饰器 2.进度条 一.基础概念 1.动态导入模块 有时在编程过程中, ...

  8. pytorch实现style transfer

    说是实现,其实并不是我自己实现的 亮出代码:https://github.com/yunjey/pytorch-tutorial/tree/master/tutorials/03-advanced/n ...

  9. galera cluster,mysql配置wsrep_notify_cmd参数,增加邮件告警

    vi /usr/local/sunlight/wsrep_notify_cmd.sh chown mysql:mysql  /usr/local/sunlight/wsrep_notify_cmd.s ...

  10. numpy unable to find vcvarsall.bat

    出现这种情况,是需要引用vc的编译器,可以安装vs来解决,并且安装numpy前, 设置如下宏 SET VS100COMNTOOLS=%VS110COMNTOOLS% SET VS90COMNTOOLS ...