令人费解的Javascript构造函数问题

Question

我使用JavaScript时遇到的一个非常令人费解的问题.看下面的代码..

az={
   classes:{
      test:function(){
        this.hello=function(name){
          alert('hello '+name);
        }
      }
   },
   getClass:function(name){
    return az.classes[name];
   }
};
var a=new az.classes['test']();
a.hello('foo');
var b= new az.getClass('test')();
b.hello();// fails !!!

在代码中,如果您注意到我们在对象中定义了一个类az.classes.当尝试用new创建该类的实例时az.classes['test](),它可以正常工作并a.hello()执行.但是当我调用方法时az.getClass('test'),它又返回相同的构造函数,但是当我var b=new az.getClass('test');在这里说它的说法b是undefined!! 并b.hello()失败!我不明白这种行为!是什么样的新的区别az.classes['test']()和新的az.getClass('test').他们不是一回事吗？

Answer 1

在实例化构造函数时,第一个parens指示在构造函数中使用的内容.

因此new az.classes['test']();将执行表达式az.classes['test']并使用结果函数作为构造函数.

或重构,它这样做:

// new az.classes['test']()
//                       ^ expression left of here used as constructor!
var MyConstructor = az.classes['test'];
new MyConstructor();

但是,new az.getClass('test')();执行az.getClass返回类getter函数的表达式,并尝试将其用作构造函数.然后你的实例试图用().执行.

或重构,它这样做:

// new az.getClass('test')();
//                ^ expression left of here used as constructor!
var MyConstructor = az.getClass;
var instance = new MyConstructor('test');
instance(); // obviously not gonna work.

看到不同？

你可以通过在应该返回构造函数的表达式周围包含更多的parens来解决这个问题:

new (az.getClass('test'))();
//                       ^ expression left of here used as constructor!

或者通过将构造函数引用保存到局部变量,然后在下一行使用它.这可能更加理智和可读:

var MyConstructor = az.getClass('test');
new MyConstructor();
//               ^ expression left of here used as constructor!