2012-08-26 108 views
5

我无法找到一个恰当的例子,说明如何做到这一点,甚至是否可能。基于我从零散的片段中得到的理解,我想出了以下结构JavaScript中的深层嵌套功能

  var t = function() 
     { 
      this.nestedOne = function() 
      { 
       this.nest = function() 
       { 
        alert("here"); 
       } 
      } 
     } 
     t.nestedOne.nest(); 

但是,这不起作用(很明显)。如果有人能指出我正确的方向,我将不胜感激!

+2

你想实现什么? – NicoSantangelo

+0

我想模仿通常在编程语言中看到的嵌套类。它使得OOP非常有组织,图书馆更有条理。我知道JavaScript并不是真正为复杂的OOP构建的,但不管它有什么用处。 JavaScript对函数有一种非正统的方法,但我可以完全明白它为什么如此强大。 –

回答

3

即简单地做:

var t = { 
    nestedOne: { 
     nest: function() { 
      alert('here'); 
     } 
    } 
}; 

您的代码,否则就没有意义了。内函数不涉及函数本身,它指的是函数被调用的对象上下文,而且你甚至不会调用代码中的函数。

如果我说obj.func()然后this里面func将为obj为那个电话。因此,分配this.asd = true将为该对象的"asd"属性分配true

如果你想做一个嵌套类,它看起来非常不同:

ClassA = (function() { 
    function ClassA() { 

    } 

    ClassA.prototype.method1 = function() { 

    }; 

    function ClassB() { 

    } 

    ClassB.prototype.method1 = function() { 

    }; 

    return ClassA; 
}()) 

只有ClassA的现在可以ClassB的实例。这应该实现与java中的嵌套类相同的目标。

+0

你已经提供了一个答案,表明他是一种更干净的方式去做人们通常想要的东西,但是他看起来总是困惑于函数的工作方式(里面的代码还没有运行)你是否想要包含一个关于它? – Incognito

+0

@Incognito sure – Esailija

+1

@Incognito tbh,他的理解是如此搞砸,我不知道该怎么办。 – Esailija

2

http://jsfiddle.net/CstUH/

function t(){ 
    function f(){ 
     this.nest = function() 
     { 
      alert("here"); 
     } 
    } 
    this.nestedOne = new f(); 
} 
var myt=new t(); 
myt.nestedOne.nest() 

编辑1:

您还可以使用的

new t().nestedOne.nest() 

代替

var myt=new t(); 
myt.nestedOne.nest() 

http://jsfiddle.net/CstUH/1/

编辑2:

甚至更​​紧凑:

function t(){ 
    this.nestedOne = new function(){ 
     this.nest = function(){ 
      alert("here"); 
     } 
    } 
} 
new t().nestedOne.nest() 

http://jsfiddle.net/CstUH/2/

1

在JS功能素类对象,您可以直接访问它们在代码[即没有使用反射或所以]。

你把里面将执行t体实际执行t当代码:

t(); 

你写t.nestedOne,nest(),但t没有nestedOne财产 - 你应该这样做:

var t = { 

    nestedOne : { 

     nest : function() 
     { 

      alert("here"); 

     }   

    } 

}; 

t.nestedOne.nest();    ​ 

我建议你在John Resig's Learning Advanced JavaScript教程上进行一次旅行,这对我来说非常有启发性。

0

我今天写了一个简单的回调处理程序,作为我如何进行深层嵌套的示例。我很抱歉,如果不是代码风格的蜜蜂跪下,它会让我的概念更清晰一些。

function test() { 
     this.that = this; 
     this.root = this; 

     this.jCallback = new Array(new Array()); // 2d 
     this.jCallbackCount = -1; 
     this.str = "hello"; 


     // Callback handler... 
     this.command = { 
     that : this, // let's keep a reference to who's above us on the food chain 
     root : this.root, // takes us back to the main object 

     // add : function() { var that = this; console.log(that.that.str); }, 
     add : function(targetFnc, newFunc) { 
      var that = this; 
      var home = that.that; // pretty much root but left in as an example of chain traversal. 
      var root = this.root; // useful for climbing back up the function chain 

      // console.log(that.that.str); 
      home.jCallbackCount++; 
      // target, addon, active 
      home.jCallback[home.jCallback.length] = { 'targetFunc' : targetFnc, 'newFunc' : newFunc, 'active' : true, 'id': home.jCallbackCount}; 

      console.log('cbacklength: ' + home.jCallback.length); 
      console.log('added callback targetFunction:[' + targetFnc + ']'); 

      return home.jCallbackCount; // if we want to delete this later...  
     }, 

     run : function(targetFnc) { 
      var that = this; 
      var home = that.that; 
      console.log('running callback check for: ' + targetFnc + ' There is : ' + (home.jCallbackCount + 1) + 'in queue.'); 
      console.log('length of callbacks is ' + home.jCallback.length); 

      for(i=0;i < home.jCallback.length - 1;i++) 
      { 
       console.log('checking array for a matching callback [' + targetFnc + ']...'); 
       console.log('current item: ' + home.jCallback[i]['targetFunc']); 
       if(home.jCallback[i]['targetFunc'] == targetFnc) 
       { 
       // matched! 
       home.jCallback[i]['newFunc'](); 
       } 

       // console.log(that.that.jCallback[i].targetFunction); 
      } 
     } 
     }; 

    } 

    test.prototype = { 
     say : function() { 
     var that = this; 
     console.log('inside'); 
     // that.command('doSay'); 
     that.command.run('doSay'); 
     console.log(that.str); 
     } 


    } // end proto 



    // BEGIN TESTING ************************************************************************** 
    // BEGIN TESTING ************************************************************************** 
    // BEGIN TESTING ************************************************************************** 
    var testing = new test(); 


    testing.command.add('doSay', function() { console.log('213123123'); }); 
    testing.command.add('doSay', function() { console.log('12sad31'); }); 
    testing.command.add('doSay', function() { console.log('asdascccc'); }); 


    testing.say(); 

直播: http://jsfiddle.net/Ps5Uf/

  • 注意:要查看控制台输出,只需打开检查中铬,然后单击 “控制台” 选项卡上。