如何動態更新JavaScript數組

Question

我創建了一個空的javascript數組（矩陣）以實現div的刷新。 我創建了一個函數以動態地將數據放入其中。 然后，我創建了一個更新數組的函數（我遇到了問題）。 數組中填充的數據是我放入JSON文件中的數據屬性。

為了更好地理解，這是我放在json文件中的數據屬性：

var currentAge      = $(this).data("age");
var currentDate     = $(this).data("date");
var currentFullName = $(this).data("fullname");
var currentIDPerson = $(this).data("idPerson");
var currentGender   = $(this).data("gender");

創建數組：

var arrayData   = [];

這是一個創建的函數，用於向Array初始化和添加元素：

function initMatrix(p_currentIDPerson, p_currentGender, p_currentFullName, p_currentDate, p_currentAge) {
  var isFound = false;      
  // search if the unique index match the ID of the HTML one
  for (var i = 0; i < arrayData.length; i++) {
    if(arrayData[i].idPerson== p_currentIDPerson) {
      isFound = true;
    }
  }

  // If it doesn't exist we add elements
    if(isFound == false) {
      var tempArray = [
        { 
          currentIDPerson: p_currentIDPerson,  
          currentGender: p_currentGender, 
          currentFullName: p_currentFullName,  
          currentDate: p_currentDate, currentAge: p_currentAge
        }
      ];
      arrayData.push(tempArray);
    }
  }

這里是我嘗試的更新功能，但是它不起作用，也許我沒有以正確的方式對其進行編碼。 如果可以的話請幫忙。

function updateMatrix(p_currentIDPerson, p_currentGender, p_currentFullName, p_currentDate, p_currentAge) {
  for (var i = 0; i < arguments.length; i++) {
    for (var key in arguments[i]) {
      arrayData[i] = arguments[i][key];         
    }
  }
}

要了解'$ this'和elm：elm是我放置click事件的clickableDivs：

(function( $ ) {    
  // Plugin to manage clickable divs
  $.fn.infoClickable = function() {
    this.each(function() {
      var elm = $( this );

      //Call init function
      initMatrixRefresh(elm.attr("idPerson"), elm.data("gender"), elm.data("fullname"), elm.data("date"), elm.data("age"));

      //call function update
      updateMatrix("idTest", "Alarme", "none", "10-02-17 08:20", 10);

      // Définition de l'evenement click
      elm.on("click", function(){});
    });
  }
  $('.clickableDiv').infoClickable();   
}( jQuery ));

先感謝您

Answer 1

好吧...我建議您使用一個對象，其中每個鍵都是用於保留此列表的人員ID，而不是數組。 這樣，您可以編寫更干凈的代碼，獲得相同的結果，但性能得到改善。 例如：

var myDataCollection = {};

function initMatrix(p_currentIDPerson, p_currentGender, p_currentFullName, p_currentDate, p_currentAge) {
  if (!myDataCollection[p_currentIDPerson]) {
     myDataCollection[p_currentIDPerson] = {
        currentIDPerson: p_currentIDPerson,  
        currentGender: p_currentGender, 
        currentFullName: p_currentFullName,  
        currentDate: p_currentDate,
        currentAge: p_currentAge
     };
  }
}

function updateMatrix(p_currentIDPerson, p_currentGender, p_currentFullName, p_currentDate, p_currentAge) {
  if (myDataCollection[p_currentIDPerson]) {
     myDataCollection[p_currentIDPerson] = {
        currentGender: p_currentGender, 
        currentFullName: p_currentFullName,  
        currentDate: p_currentDate,
        currentAge: p_currentAge
     };
  } 
}

根據您的業務邏輯，您可以刪除if語句，並僅保留一個函數，該函數將在沒有具有指定id的對象時添加該對象，並在有一個具有指定id的對象時更新該對象。

Answer 2

我認為結果矩陣的形狀與您所想的不同。 具體來說，init之后的矩陣看起來像[ [ {id, ...} ] ] 。 您的更新功能循環不夠。 似乎您正在嘗試創建用於存儲和更新用戶列表的數據結構。 我會建議一個平面列表或一個由userID索引的對象，因為那是您的查找。

 var userStorage = {} // add/update users userStorage[id] = {id:u_id}; // list of users var users = Object.keys(users);