如何在Javascript中交叉引用类

有没有一种方法可以从不同的名称空间中交叉引用类或实例变量的实例，并考虑到它在主html中定义的脚本文件的顺序很重要应用。实际上，我想知道是否有可能交叉引用两个不同的类实例，一个指向在另一个名称空间中定义的引用，另一个定义在第二个类中的变量指向第一个。如何在Javascript中交叉引用类

假设我有一个main.js文件，其中我定义它使用在另一个命名空间中定义一些实例变量的一类，让我们在particle.js，在此，同时我定义一个变量指向回Main类公共变量说。

var Main = (function() { 
    var p = new Particle(); 

    this.draw = true; 
    this.width = 800; 
    this.height = 600; 

    function print() { 
     console.log(p.width, ':', p.height); 
    } 

    return { 
     draw : this.draw, 
     width : this.width, 
     height : this.height, 
     print : print 
    } 
})(); 

function Particle() { 

    this.width = Main.width; 
    this.height = Main.height; 
    this.print = function() { 
     console.log(this.width, ':', this.height); 
    }  
} 


var p = new Particle(); 
p.print(); 
Main.print();

...并在*.html JavaScript文件顺序将是：

<script src = 'main.js'></script> 
<script src = 'particle.js'></script>

其实这个代码工作，如果你尝试在萤火例如如预期，但在相同的逻辑在我的真实应用程序中，这非常复杂，我在控制台中遇到了Main is undefined错误。我知道可以使用AMD和Require.js来模拟真实的课程模块，但我现在不想在AMD上进行传递。

来源

2012-07-09 Simo Endre

我没有设法让您的代码在Chrome或Firefox上工作，我总是在Main.width上遇到错误。

问题在于当您Main尚未完全构造时，请参阅主内部粒子。

没有简单的解决方案，我认为最好的方法是在定义了粒子类之后延迟部分主单体的初始化。或者，您也可以重新排列代码以遵守依赖关系。

你必须记住，在JavaScript中，你的代码在你调用它时被评估。

这里是我的两个建议：

解决方案1 ：延迟初始化主要部分

// Main.js --> loaded first 
var Main = new (function() { 
    this.draw = true; 
    this.width = 800; 
    this.height = 600; 

    // delayed initialization method 
    this.init = function() 
    { 
     var p = new Particle(); 
     this.print = function() { 
      console.log(p.width, ':', p.height); 
     } 
    } 
})(); 

//Particle.js --> loaded second 
function Particle() { 
    this.width = Main.width; 
    this.height = Main.height; 
    this.print = function() { 
     console.log(this.width, ':', this.height); 
    }  
} 

// call the delayed init method 
Main.init() 

var p = new Particle(); 
p.print(); 
Main.print();

解决方案2：拆分在3个文件要尊重依赖

//Particle.js --> loaded first 
function Particle() { 
    this.width = Main.width; 
    this.height = Main.height; 
    this.print = function() { 
     console.log(this.width, ':', this.height); 
    }  
} 

// Main.js --> loaded in second position 
var Main = (function() { 
    var p = new Particle(); 
    this.draw = true; 
    this.width = 800; 
    this.height = 600; 
    function print() { 
     console.log(p.width, ':', p.height); 
    } 
    return { 
     draw : this.draw, 
     width : this.width, 
     height : this.height, 
     print : print 
    } 
})(); 

// Init.js --> loaded third 
var p = new Particle(); 
p.print(); 
Main.print();

来源

2012-07-09 11:38:25

如何在Javascript中交叉引用类

回答

相关问题