zoukankan      html  css  js  c++  java
  • 【经验总结】构造函数的强制调用

    兴致勃勃地定义了下面这么个构造函数:

    var Coder = function( nick ){
        this.nick = nick;
    };

    定义构造函数结束后呢?没错,赶紧实例化:

    var coder = Coder( 'casper' );

    这个coder兄弟叫什么名字?赶紧打印下:

    console.log( coder.nick );    //undefined

    = =b 竟然是undefined!!再回过头看看实例化的那个语句,不难发现问题出在哪里:少了个new

    var coder = Coder( 'casper' );   //当作普通的函数来调用,故内部的this指针其实指向window对象
    console.log( window.nick);    //输出:casper
    
    var coder = new Coder( 'casper' );    //加上new,一切皆不同,this正确地指向了当前创建的实例
    console.log( coder.nick );    //输出:casper

    关于this指针的指向问题不是本文讨论的内容,可以参考下犀牛书相关章节

    这样的错误貌似挺低级的,但出现的概率挺高的,肿么去避免或减少这种情况的发生呢?

    可以在内部实现里面动下手脚:

    var Coder = function( nick ){
        if( !(this instanceof Coder) ){
            return new Coder( nick );
        }   
        this.nick = nick;
    };

    其实很简单,实例化的时候,内部判断下,当前this指向的对象的类型即可,如果非当前构造函数的类型,强制重新调用一遍构造函数。

    突然觉得Coder这名字不够洋气?想用Hacker,好吧,我改。。。数了下,一共有三处要改,这不科学,有没有办法只把构造函数的名字改了就行?

    当然有:

    var Coder = function( nick ){
        if( !(this instanceof arguments.callee) ){
            return new arguments.callee( nick );
        }   
        this.nick = nick;
    };

    关于arguments.callee,可参见:https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Functions_and_function_scope/arguments/callee

    tips:据说在ES 5的严格模式下面arguments.callee会被禁用,不过仅当ES 5普及同时你指定了要使用严格模式,否则还是可以用的

    发散下思维:在JQ里面包打天下所向披靡的$,大家都知道它会返回一个jquery对象,如下:

    var jObject = $('#node_id');

    有没有发现,这里同样没有new!应该猜到怎么回事了吧。原理是差不多的,不过里面的实现要复杂得多,有空再把JQ里面的实现拔下写下总结

    over

  • 相关阅读:
    知识付费时代:屌丝程序员如何用技术实现
    过完年了,要不要辞职?
    程序猿不得不知道的业内“黑话”
    Go 2 Draft Designs
    11 Go 1.11 Release Notes
    10 Go 1.10 Release Notes
    09 Go 1.9 Release Notes
    win10系统电脑无法识别u盘的解决办法
    IDEA导入Git项目后右键项目找不到Git选项的解决方法
    Redis在windows下安装与配置
  • 原文地址:https://www.cnblogs.com/chyingp/p/2690486.html
Copyright © 2011-2022 走看看