область действия «this» в функции jQuery

Question

Сегодня я столкнулся с очень интересной проблемой, которую многие из вас могут найти элементарно, но поскольку я просто изучаю использование jQuery, мне интересно знать, как это работает.

У меня есть два массива, и я повторяю элементы массива. Один массив - arrAllDetailsConstantData, а другой - arrAllDetails. Я хочу сравнить с помощью arrAllDetailsConstantData и обновление с помощью arrAllDetails.

Я использую вложенные петли. Но происходит то, что при обновлении массива arrAllDetails, массив arrAllDetailsConstantData также обновляется. Я предполагаю, что это как-то связано с охватом родителя (хотя я просто догадываюсь). Не могли бы вы мне помочь?

Вот мой код:

$.each(privateVariables.arrAllDetailsConstantData, function() { 
    if (this.AssociationId == value && this.uniqueChargeAttr == uniqueChargeAttr) { 

     if (this.Units == $("#txtUnits").val() && 
      this.Modifier1 == $("#txtModifier1").val() && 
      this.Modifier2 == $("#txtModifier2").val() && 
      this.Modifier3 == $("#txtModifier3").val() && 
      this.Modifier4 == $("#txtModifier4").val() && 
      this.DxOption == $("#ddlDxOption").val() && 
      this.DxCode1 == $("#txtDx1").val() && 
      this.DxCode2 == $("#txtDx2").val() && 
      this.DxCode3 == $("#txtDx3").val() && 
      this.DxCode4 == $("#txtDx4").val()) { 

     } else { 
      $.each(arrAllDetails, function() { 
       if (this.AssociationId == value && this.uniqueChargeAttr == uniqueChargeAttr) { 
        this.ActionType = "M"; 
        this.CptName = $("#lblCptDesc").text(); 
        this.CptDesc = $("#lblCptDesc").text(); 
        this.Units = $("#txtUnits").val(); 
        this.Modifier1 = $("#txtModifier1").val(); 
        this.Modifier2 = $("#txtModifier2").val(); 
        this.Modifier3 = $("#txtModifier3").val(); 
        this.Modifier4 = $("#txtModifier4").val(); 
        this.DxOption = $("#ddlDxOption").val(); 
        this.DxCode1 = $("#txtDx1").val(); 
        this.DxCode2 = $("#txtDx2").val(); 
        this.DxCode3 = $("#txtDx3").val(); 
        this.DxCode4 = $("#txtDx4").val(); 

        privateVariables.arrActionData.push(this); 

       } 
      }); 
     } 
    } 
}); 

// test code ends 

Answer 1

• Во-первых, номерjQuery относится к вызывающему элементу.

В $.each, это относится к итерированного элемента.

Таким образом, в первом цикле: $.each(privateVariables.arrAllDetailsConstantData, function() {});, this будет в настоящее время зацикливания элемента вашего arrAllDetailsConstantData массива.

Во втором цикле, this будет в настоящее время зацикливания элемента вашего arrAllDetails массива.

• Во-вторых, нам нужен код создания массивов.

Не забывайте, что на многих языках, что если вы используете этот arrAllDetailsConstantData = arrAllDetails, ссылка указатель на те два объекта указывают на тот же диапазон памяти. В этом случае используйте arrAllDetailsConstantData = arrAllDetails.slice(); от Array.prototype.slice.

Answer 2

за рамки «это» вы можете проверить JQuery and 'this' object

Что касается вашего кода: Вам нужно добавить, как вы создали два массива в первом место.

Основываясь на вашем коде, они, похоже, создаются с использованием тех же элементов (поэтому arrDetails представляется подмножеством объектов в arrAllDetails). Что-то в пути

$.each(arrDetails, function() {arrAllDetails.push(this); }); 

или просто assinging:

arrDetails = arrAllDetails; 

Если это так, то объект в пределах массивов, на самом деле то же самое. Поэтому редактирование элемента в одном массиве также отредактирует его в другом массиве (они указывают на один и тот же объект в памяти).

Я не уверен, что вы пытаетесь выполнить, но если вы хотите, чтобы объекты были разными, вам нужно клонировать записи, чтобы они были отдельными объектами, а не просто использовали их.

Кроме того, вы понимаете это из-за этого (оно относится к ближайшей области) правильно, но переопределены другими проблемами.

Answer 3

В Javascript this относится к владельцу функции-исполнения. Не всегда легко узнать, что на самом деле является владельцем. С областью определения HTML-элементов, this обычно относится к самим элементам. Внутри итерации (например, $.each(data, function)) this относится к элементу, который повторяется.

Вы используете this в разных контекстах. Каждый раз в другой итерации.

$.each(privateVariables.arrAllDetailsConstantData, function() { 
    if (this.AssociationId == value && this.uniqueChargeAttr == uniqueChargeAttr) { 
     //in this context: "this" refers to the currently selected 
     //item of the iteration over: 
     // privateVariables.arrAllDetailsConstantData 
    } else { 
     $.each(arrAllDetails, function() { 
      // in this context: "this" refers to the selected item 
      // of the iteration over "arrAllDetails" 
     }); 
    } 
}); 

Вы можете сохранить контекст при вводе итерацию путем связывания this локальной переменной.

$.each(privateVariables.arrAllDetailsConstantData, function() { 
    if (this.AssociationId == value && this.uniqueChargeAttr == uniqueChargeAttr) { 
     // this refers to an item from privateVariables.arrAllDetailsConstantData 
    } else { 
     var context = this; 
     $.each(arrAllDetails, function() { 
      // context refers to an item from privateVariables.arrAllDetailsConstantData 
      // so: use 
      context.AssociationId 
      // instead of 
      this.AssociationId 
     }); 
    } 
});