[学习笔记]javascript中new function()的返回值(并不一定是function的“实例”)

今天看mootools的Element源码时发现,Elenment的initialize有返回值,有点不解,initialize有返回值的话那么var div = new Element('div')的话div究竟是initialize的返回值还是一个Element实例。或许有的人会说,当然是Element实例啦。但是,虽然表面上看上去,div似乎是一个Element实例,然而事实上div不是一个Element实例,它是document.createElemetnt('div'),然后通过复制Element的prototype到div而来的。下面是Element的部分源码

js 代码
  1. var Element = new Class({     
  2.     initialize: function(el){   
  3.         if ($type(el) == 'string') el = document.createElement(el);   
  4.         return $(el);   
  5.     }   
  6.   
  7. });   
  8.   
  9. function $(el){   
  10.     if (!el) return false;   
  11.     if (el._element_extended_ || [window, document].test(el)) return el;   
  12.     if ($type(el) == 'string') el = document.getElementById(el);   
  13.     if ($type(el) != 'element') return false;   
  14.     if (['object', 'embed'].test(el.tagName.toLowerCase()) || el.extend) return el;   
  15.     el._element_extended_ = true;   
  16.     Garbage.collect(el);   
  17.     el.extend = Object.extend;   
  18.     if (!(el.htmlElement)) el.extend(Element.prototype);   
  19.     return el;   
  20. };   

上面的代码似乎说明了,只要new function()的function有返回值的话那么就应该返回function返回值,但是事实上呢?看下边的例子

js 代码
  1. function fn()   
  2. {   
  3.     this.k = 1;   
  4.     return 1;   
  5. }   
  6. fn.prototype = {   
  7.     j: 0   
  8. };   
  9. var f = new fn();  //  f = {}  

结果出乎意料,竟然是fn的实例({k:1, j:0});为什么又是function的实例了?继续看下面的实验,在fn中分别return各种数据类型的值,得出一下结果

js 代码
  1. return 1;                   f = {"j":0,"k":1}    
  2. return false;               f = {"j":0,"k":1}    
  3. return true;                f = {"j":0,"k":1}    
  4. return "string";            f = {"j":0,"k":1}    
  5. return null;                f = {"j":0,"k":1}    
  6. return undefined;           f = {"j":0,"k":1}    
  7.   
  8.   
  9. return new Number(1);           f = 值为1的Number对象   
  10. return new String("string");    f = 值为"string"的String对象   
  11. return new Boolean(true);       f = {}  
  12. return [1];                     f = [1]   
  13. return new Object();            f = {}  

注:Boolean在IE和FIREFOX似乎只要声明而没有定义,不管传入的是true还是false,返回的都是{},而且没有ToString()等方法。而且它的prototype也是{} 。其他浏览器没试过,还不清楚。不过估计也是一样的吧。
[修正]Boolean是有定义的,ToString()应该是toString();

实验的结论很明显,如果function的返回值是对象的话则返回该对象,否则返回function的实例

javascript真是一门神奇的语言,容易入门,但是其中的细节和一些技巧却不是一时半会能掌握,每次回过头学都能学到一些新的东西,好像怎么都学不完,继续加油。

你可能感兴趣的:(JavaScript,prototype,F#,J#,mootools)