javascript - 比较 Javascript 中两个数组的不同值

Question

Javascript 大师，我需要你的帮助。

我需要比较两个不同的数组并检查不同的值。这些值来自同一表单多选元素。我尝试获取当前值的列表(cacheTermList)并检查更改时的新值(newTermList)。我的想法是，如果输入了新值，我想将 id 传递给 ajax 调用，并将一些数据返回到屏幕。

代码:

var cachedTermList = $('select#edit-categories').val();

      if (cachedTermList == null) {
        var cachedTermList = new Array();
      }

      $('select#edit-categories').chosen().change(function() {
        var newTermList = $('select#edit-categories').val();

        if (cachedTermList != null) {
          for(var i = 0; i < newTermList.length; i++) {
          alert(newTermList[i]);
            if (!($.inArray(newTermList[i], cachedTermList))) {
              $.ajax({
                 type: "GET",
                 url: "/classifieds/js/term/" + newTermList[i],
                 success: function(data){
                   //$('div#term-help-text').html(data);
                   cachedTermList.push(newTermList[i]);
                   alert(cachedTermList);
                 }
               });
            }
          }
        } else {

        }
      });

请耐心等待，我不太经常使用 Javascript。我试图通过在加载时设置 cachedTermList 来获取当前的值列表，然后当选择更改时，将 newTermList 设置为字段的新值，然后循环它，并检查该列表中是否存在不在缓存列表。

虽然我可以看到事情发生，并转储两个术语列表并看到不同的值，但在我的一生中，我无法让它将找到的值推送到缓存列表，以便下次元素更改时，它不会不要一次又一次地向 ajax 调用发送相同的值。 .push() 执行后，它只是添加 ',,,' 而没有值。我哪里出错了？

Answer 1

这是典型的闭环问题。所有success 回调都引用相同的i。执行回调时，循环已完成，i 的值为 newTermList.length + 1，因此 newTermList[i]将返回未定义。

您必须通过引入新的作用域来捕获索引或值，这可以通过调用函数来完成(JavaScript 没有 block 作用域)。

更新:另一个问题是$.inArray不返回 bool 值，而是返回元素的索引或-1。因此，您必须将返回值与 -1 进行比较。

$('select#edit-categories').chosen().change(function() {
    // ...
    for(var i = 0; i < newTermList.length; i++) {
        if ($.inArray(newTermList[i], cachedTermList) === -1) {
            addTerm(newTermList[i], cachedTermList);
        }
    }
    //...
});


function addTerm(term, target) {
    $.ajax({
        type: "GET",
        url: "/classifieds/js/term/" + term,
        success: function(data){
            //$('div#term-help-text').html(data);
            target.push(term);
            alert(target);
        }
    });
}

还请记住，所有 Ajax 调用基本上都会同时执行。该循环不会等到一个调用完成。如果您想一次执行一个调用，可以使用 jQuery's Deferred objects .