27

私は Mozilla の Javascript Guideを読んでいます。彼らが JS と Java を対比させたとき、Java コードは自分のファイル内の各クラスで簡単に分割されると思いました。さらに検索した後、ネームスペースとモジュールパターンを使用してJSで同じことができることを理解しました-いじりましたが、非常に混乱しました（特に、 File1.js で宣言されたコンストラクターを File2.js に呼び出す場合）

ここに階層があります： クラス編成

しかし、私はそれを適切に機能させる方法を理解できません

どうすればいいですか

//employe.js
function Employee () {
  this.name = "";
  this.dept = "general";
}

function Manager () {
  this.reports = [];
}
Manager.prototype = new Employee;

function WorkerBee () {
  this.projects = [];
}
WorkerBee.prototype = new Employee;

function SalesPerson () {
  this.dept = "sales";
  this.quota = 100;
}
SalesPerson.prototype = new WorkerBee;

これに：

 // employe.js
function Employee () {
  this.name = "";
  this.dept = "general";
}

 // Manager.js   
function Manager () {
  this.reports = [];
}
Manager.prototype = new Employee;

 // WorkerBee.js     
function WorkerBee () {
  this.projects = [];
}
WorkerBee.prototype = new Employee;

 // SalesPerson.js      
function SalesPerson () {
 this.dept = "sales";
 this.quota = 100; 
 }
SalesPerson.prototype = new WorkerBee;
4

3 に答える 3

21

すべてのモジュールがアクセスして書き込む必要がある 1 つのグローバル名前空間オブジェクトが必要です。次のようにファイルを変更します。

// employe.js

window.myNameSpace = window.myNameSpace || { };

myNameSpace.Employee = function() {
    this.name = "";
    this.dept = "general";
};

Manager.jsは次のようになります。

// Manager.js

window.myNameSpace = window.myNameSpace || { };

myNameSpace.Manager = function() {
    this.reports = [];
}
myNameSpace.Manager.prototype = new myNameSpace.Employee;

もちろん、これは非常に単純化された例です。ファイルと依存関係をロードする順序は子供向けではないためです。利用可能な優れたライブラリとパターンがいくつかあります。requireJSとAMDまたはCommonJSモジュール パターンを参照することをお勧めします。http://requirejs.org/

于 2012-10-28T02:05:15.777 に答える
8

別のことをする必要はありません。スクリプト ファイルを含めるだけで、それらは単一のファイルであるかのように機能します。

Javascript にはファイル スコープがありません。コードが解析されると、コードがどこから来たかは問題になりません。

于 2012-10-28T02:10:21.180 に答える
3

Web サイトやゲームなどの小規模および中規模のプロジェクトでは、ネイティブの名前空間とコンストラクターが非常にうまく機能します。ロード順序が複雑すぎて何らかの自動ロードなしでは処理できない場合、これらは適切な選択ではありません。

index.html:

<script src="Employee.js"></script>
<script src="Manager.js"></script>

Manager.js:

var Manager = function() {
    var employee1 = new window.Employee(this);
    var employee2 = new window.Employee(this);
};

従業員.js:

var Employee = function(boss) {
    // work stuff here
    this.wage = 5;
};

従業員コンストラクター関数内のプロパティはマネージャーに表示されることに注意してください。new単語はコンストラクターを示します。これは、上記のように関数の代わりにプロパティを持つオブジェクトを返すことにより、コンストラクターなしでも可能です。

于 2016-05-17T00:14:04.720 に答える