Require.js，模塊依賴關係

Question

我有幾個模塊：「Shapes.js」，它是Shape對象的容器（模塊「Shape.js」）「Mouse.js」，它將在用戶按鼠標左鍵單擊鼠標時計算座標以及需要進行計算並確定該座標屬於該形狀的模塊「Selection.js」。

// Mouse.js

define([], function() { 
    function Mouse(element, e) {   
     var offsetX = 0, offsetY = 0; 

     if (element.offsetParent !== undefined) { 
      do { 
       offsetX += element.offsetLeft; 
       offsetY += element.offsetTop; 
      } while ((element = element.offsetParent)); 
     } 

     this.getMouseX = function() { 
      return e.pageX - offsetX; 
     } 
     this.getMouseY = function() { 
      return e.pageY - offsetY; 
     } 
    } 
    return Mouse; 
}); 

// Selection.js

define(['modules/Shapes', 'modules/Mouse'], function(Shapes, Mouse) { 
    var selection; 
    document.getElementById('canvas').addEventListener('mousedown', function(e) { 
      selection = null; 

      var mouse = new Mouse(document.getElementById('canvas'), e); 
      var shapes = Shapes.getShapes(); 

      for(var i=0; i<shapes.length; i++) { 
       if ((shapes[i].getX() <= mouse.getMouseX()) 
        && (shapes[i].getX() + shapes[i].getWidth() >= mouse.getMouseX()) 
        && (shapes[i].getY() <= mouse.getMouseY()) 
        && (shapes[i].getY() + shapes[i].getHeight() >= mouse.getMouseY())) { 

        selection = shapes[i]; 
        break; 
       } 
      } 
     }); 
    return selection; 
}); 

爲了使這個問題小我不會發表 「形狀」 和 「形狀」 模塊，他們不重要。

因此，現在在「main.js」模塊中，我希望在用戶triger mousedown事件時始終引用所選元素（或null），但我無法獲取它。甚至不知道從哪裏開始。如果我只是加載主模塊中的選擇模塊，我將永遠得到undefined.Thanks提前。

（代碼片段是從西蒙·薩里斯帆布教程，稍作修改，只是想通過Require.js做的一切）

編輯：@ Katana314，你認爲這樣的事情？
// Selection.js（編者）

define(['modules/Shapes', 'modules/Mouse'], function(Shapes, Mouse) { 

    var selection; 

    return function(e) { 
     selection = null; 

     var mouse = new Mouse(document.getElementById('canvas'), e); 
     var shapes = Shapes.getShapes(); 

     for(var i=0; i<shapes.length; i++) { 
      if ((shapes[i].getX() <= mouse.getMouseX()) 
       && (shapes[i].getX() + shapes[i].getWidth() >= mouse.getMouseX()) 
       && (shapes[i].getY() <= mouse.getMouseY()) 
       && (shapes[i].getY() + shapes[i].getHeight() >= mouse.getMouseY())) { 

       selection = shapes[i]; 
       break; 
      } 
     } 

     return selection; 
    } 
}); 

// Main.js

document.getElementById('canvas').addEventListener('mousedown', function(e) { 
    console.log(Selection(e)); // Shape... :D 
}); 

Answer 1

編輯：誤讀的東西，跳過。下面的原始回覆： requirejs的一部分是一個模塊只能被實例化一次。不過，這實際上與您當前的設置無關。

1. 運行「Mouse.js」「限定功能，存儲return編結果（一個構造函數），爲模塊路徑‘鼠標’
2. 運行‘Selection.js’」限定功能，存儲return編結果（selection ，還沒有收到價值）作爲模塊路徑「選擇」
3. 任何需要「選擇」的結果將有'未定義'。

我認爲你想要的目標是從Selection中返回某種不變的對象，甚至是一個函數。於是，無論是要求它可以做這樣的事情：

require('Selection', function(getSelection) { 
    var currentElement = getSelection(); // and so on... 
}); 

由於您的問題集中在RequireJS，我還沒有真正分析其他錯誤代碼的其他功能雖然。

編輯：其實，我可能誤解了你的語法的一小部分。它看起來好像你已經在你的模塊中返回一個函數，而不是選擇本身。手頭的問題可能與檢查活動選擇的代碼有關。只是爲了驗證，你是如何在其他代碼中包含Selection的，並且你是否嘗試過使用調試器來瀏覽它的內容？