web-dev-qa-db-ja.com

Underscore.jsの各関数内で変数が未定義なのはなぜですか?

これが私のコードです:

TextClass = function () {
    this._textArr = {};
};

TextClass.prototype = {
    SetTexts: function (texts) {
        for (var i = 0; i < texts.length; i++) {
            this._textArr[texts[i].Key] = texts[i].Value;
        }
    },
    GetText: function (key) {
        var value = this._textArr[key];
        return String.IsNullOrEmpty(value) ? 'N/A' : value;
    }
};

Underscore.jsライブラリを使用していて、SetTexts関数を次のように定義したいと思います。

_.each(texts, function (text) {
    this._textArr[text.Key] = text.Value;
});

しかし、ループに入ったときの_textArrは未定義です。

19
CJe

JavaScriptでは、thisとして知られる関数コンテキストは機能します かなり異なって

これは2つの方法で解決できます。

  1. 一時変数を使用してコンテキストを格納します。

    _SetTexts: function (texts) {
      var that = this;
      _.each(texts, function (text) {
        that._textArr[text.Key] = text.Value;
      });
    }
    _
  2. 3番目のパラメーターを _.each() に使用して、コンテキストを渡します。

    _SetTexts: function (texts) {
      _.each(texts, function (text) {
        this._textArr[text.Key] = text.Value;
      }, this);
    }
    _
37
DCoder

次のように、_.each呼び出しのコンテキストとしてthisを渡す必要があります。

_.each(texts, function (text) {
    this._textArr[text.Key] = text.Value;
}, this);

http://underscorejs.org/#each のドキュメントを参照してください

6
Andrey Kuzmin

javascriptのthisは、期待どおりに機能しません。この記事を読む: http://www.digital-web.com/articles/scope_in_javascript/

ショートバージョン:

thisの値は、関数を呼び出すたびに変化します。修正するには、thisに等しい別の変数を設定し、代わりにそれを参照します

TextClass = function () {
    this._textArr = {};
};

TextClass.prototype = {
    SetTexts: function (texts) {
        var that = this;
        for (var i = 0; i < texts.length; i++) {
            that._textArr[texts[i].Key] = texts[i].Value;
        }
    },
    GetText: function (key) {
        var value = this._textArr[key];
        return String.IsNullOrEmpty(value) ? 'N/A' : value;
    }
};
1
mkoryak

「これ」以外のものを渡すこともできることに注意してください。たとえば、私は次のようなことをします。

var layerGroupMasterData = [[0],[1,2,3],[4,5],[6,7,8,9],[10]];

_.each(layerGroupMasterData,function(layerGroup,groupNum){
    _.each(layerGroup, function (layer, i) {
            doSomethingThatComparesOneThingWithTheOverallGroup(layerGroupMasterData,layer);
    },layerGroups);
},layerGroupMasterData);
0
JayCrossler