1

私は Javascript の call() メソッドについて学んでおり、この例を理解しようとしています。今私の質問は次のとおりです。

  • コンソール (ブラウザ) に何も表示されないのはなぜですか。console.log() メソッド; 動かない？
  • この匿名機能はどのように機能していますか?

ありがとうございました！

var animals = [
  {species: 'Lion', name: 'King'},
  {species: 'Whale', name: 'Fail'}
];

for (var i = 0; i < animals.length; i++) {
  (function (i) {
    this.print = function () {
      console.log('#' + i  + ' ' + this.species + ': ' + this.name);
    }
  }).call(animals[i], i); // I cant understand this anonymus func ? :(
}
4

1 に答える 1

1

このコードを例の最後に追加してみてください。

animals[0].print();

無名関数は、関数の本体内でコンテキストcallを設定するために使用される which を使用して呼び出されます。thisしたがって、無名関数が を使用するthisと、実際には外部から渡された現在の動物への参照が取得されます。

この関数は、thisオブジェクト (現在の動物) をprintメソッドで拡張します。これだけでは、コンソールに何も表示されません。これは単にprintメソッドが動物オブジェクトに追加されたことを意味します。ただし、上記のコードを使用して、オブジェクトのこのメソッドにアクセスできます。

ループを展開すると、コードは効果的に次のことを行います。

animals[0].print = function () {
    console.log('#' + 0  + ' ' + this.species + ': ' + this.name);
}

animals[1].print = function () {
    console.log('#' + 1  + ' ' + this.species + ': ' + this.name);
}

この例を理解するための鍵は、 を使用しないと、無名関数callのthis参照が自動的にグローバルwindowオブジェクトを参照することを理解することです。windowメソッドを使用してオブジェクトを拡張しますがprint、これは明らかに私たちが望んでいるものではありません。

print次のステップの例では、オブジェクト プロトタイプにメソッドを追加して同じ結果を取得します。(これはあなたの本の次の例かもしれません)

于 2012-09-06T19:12:05.170 に答える