Phụ thuộc thông tư trong mô-đun bằng cách sử dụng requireJs

Question

Đọc tài liệu requireJs,
để sửa phụ thuộc Thông tư, được đề xuất sử dụng exports để tạo đối tượng trống cho mô-đun có sẵn ngay lập tức.

Tôi thử mã này nhưng có vẻ như nó không hoạt động. Chuyện gì thế?

P.S .:
đọc nhận xét để xem đầu ra,
đặc biệt là mô-đun B bên trong cuộc gọi setTimeout.

---

// A module 
define([ 
    'b' 
], function (b) { 
    console.log('B:', b); // B, Object 
    var A = { 
     boo: 1 
    }; 

    return A; 
}); 

---

// B module 
define([ 
    'a', 
    'exports' 
], function (a, exports) { 
    console.log('A:', a); // A, undefined (as I was expecting) 
    exports.A = function() { 
     return a; 
    } 

    var B = { 
     bar: 1 
    }; 

    setTimeout(function() { 
     console.log('exports.A', exports.A()); // exports.A undefined 
              // I would like to access the A object 
              // which is defined in A module 
    }, 500); 

    return B; 
}); 

---

// main.js 

(function() { 

    define([ 
     'a' 
    ], function() { 
    }); 
}()); 

Answer 1

tôi thường có những vấn đề hình tròn sử dụng module AMD để xây dựng một cốt lõi ứng dụng mà cả hai đứng lên nhiều mô-đun và chứa cấu hình hoặc các vật dụng hữu ích khác đối với những người mô-đun để sử dụng.

Tôi đã làm một số thử nghiệm ngày hôm nay và điều này dường như hoạt động khá tốt.

define(['exports', 'underscore', './config', './mediator'], 
    function (exports, _, Backbone, config, Mediator){ 

    Core = /* ... */ 

    // Publicize a core 'singleton' so that it's dependencies can access it, and so can modules that define it as a dependency themselves. 
    core = new Core() 
    exports.core = core //publicize it in a way that supports circularity 
    return core // And also publicize it normally 
    } 
) 

Các đối tượng đều '===' bằng nhau, vì vậy điều này có vẻ rất hứa hẹn.

EDIT:

Phương thức trên không hoạt động khi được tối ưu hóa. Đây là một phương pháp mà có thể (chưa được kiểm tra): https://github.com/requirejs/example-multipage/blob/master/www/js/app/main1.js#L2

define(function (require) { 
    var $ = require('jquery'), 
     lib = require('./lib'), 
     Core; 

    Core = /* ... */ 

    return new Core() 
}); 

Answer 2

Một lựa chọn sẽ được không trở lại các module chính nó, nhưng một chức năng mà instantiates module (trong ví dụ này nó sẽ là một nhà xây dựng theo quy định tại nguyên cảo, ở phía dưới là tạo js đang -Lưu ý rằng giao diện không tạo .js đang)

• file IA.ts

  /// <reference path="IB.ts" /> 
  interface IA{ 
      funcA(); 
      _classB : IB; 
  } 
  

• file IB.ts

  /// <reference path="IA.ts" /> 
  interface IB{ 
      funcB(); 
      _classA : IA; 
  } 
  

• ClassA.ts file

  /// <reference path="IA.ts" /> 
  /// <reference path="IB.ts" /> 
  
  export class ClassA implements IA 
  { 
      _classB : IB = null; 
  
      constructor(classB : IB) 
      { 
       this._classB = classB; 
       if (classB){ 
        this._classB._classA = this; 
       } 
       return this; 
      } 
  
      funcA(){ 
       console.log('I am ClassA'); 
      } 
  } 
  

• ClassB.ts file

  /// <reference path="IA.ts" /> 
  /// <reference path="IB.ts" /> 
  export class ClassB implements IB 
  { 
      _classA : IA = null; 
      constructor(classA : IA) 
      { 
       this._classA = classA; 
       if (classA){ 
        this._classA._classB = this; 
       } 
       return this; 
      } 
      funcB(){ 
       console.log('I am ClassB'); 
      } 
  } 
  

• MainTest.ts file

  /// <reference path="../../def/require.d.ts" /> 
  /// <reference path="IA.ts" /> 
  /// <reference path="IB.ts" /> 
  define(['ClassA', 'ClassB'], 
      function (classA, classB) 
      { 
       var aa : IA = new classA.ClassA(); 
       var bb : IB = new classB.ClassB(aa); 
  
       bb.funcB(); 
       aa._classB.funcB(); 
       bb._classA.funcA(); 
       aa.funcA(); 
      }); 
  

Và mã được tạo js:

• file ClassA.js

  define(["require", "exports"], function(require, exports) { 
      var ClassA = (function() { 
       function ClassA(classB) { 
        this._classB = null; 
        this._classB = classB; 
        if (classB) { 
         this._classB._classA = this; 
        } 
        return this; 
       } 
       ClassA.prototype.funcA = function() { 
        console.log('I am ClassA'); 
       }; 
       return ClassA; 
      })(); 
      exports.ClassA = ClassA; 
  }); 
  

• file ClassB.js

  define(["require", "exports"], function(require, exports) { 
      var ClassB = (function() { 
       function ClassB(classA) { 
        this._classA = null; 
        this._classA = classA; 
        if (classA) { 
         this._classA._classB = this; 
        } 
        return this; 
       } 
       ClassB.prototype.funcB = function() { 
        console.log('I am ClassB'); 
       }; 
       return ClassB; 
      })(); 
      exports.ClassB = ClassB; 
  }); 
  

• file MainTest.js

  define(['ClassA', 'ClassB'], function (classA, classB) { 
  
      var aa = new classA.ClassA(); 
      var bb = new classB.ClassB(aa); 
  
      bb.funcB(); 
      aa._classB.funcB(); 
      bb._classA.funcA(); 
      aa.funcA(); 
  
  }); 
  

cuối cùng, kết quả sẽ là:

Tôi ClassB

Tôi ClassB

Tôi ClassA

Tôi ClassA

Answer 3

Bạn sẽ có thể sử dụng phiên bản đồng bộ require() trong mô-đun B của bạn để truy cập vào "A" mô-đun:

// B module 
define([ 
    'a', 
    'exports' 
], function (a, exports) { 
    console.log('A:', a); // A, undefined (as I was expecting) 
    exports.A = function() { 
     return require('a'); 
    } 
    ... 
});