配列要素の順序エラーの原因

Question

私は2つの配列を持っています。各配列の要素は以下のように示されている：

allLabBranches = [{ 
    "labbranchid": "1", 
    "labname": "Wahab Labs, Islampura Branch, Lahore", 
    "labtitle": "Wahab Labs Lahore", 
    "shortname": "WAHB", 
    "address": "56 Islampura, Lahore", 
    "landlineno": "04237940445", 
    "datecreated": "2016-03-11 11:00:00", 
    "createdbyname": "Jamshaid Sabir", 
    "createdbyuserid": "1", 
    "dateupdated": "2016-05-04 00:53:03", 
    "updatedbyname": "Jamshaid Sabir", 
    "updatedbyuserid": "1", 
    "clientgroups_clientgroupsid": "1", 
    "startdate": "2016-05-04" 
}, { 
    "labbranchid": "2", 
    "labname": "Wahab Labs, Model Town Branch, Lahore", 
    "labtitle": "Wahab Labs Lahore", 
    "shortname": "WAHAB", 
    "address": "45 Model Town, Lahore", 
    "landlineno": "04237945485", 
    "datecreated": "2016-03-11 11:00:00", 
    "createdbyname": "Jamshaid Sabir", 
    "createdbyuserid": "1", 
    "dateupdated": "0000-00-00 00:00:00", 
    "updatedbyname": "", 
    "updatedbyuserid": "", 
    "clientgroups_clientgroupsid": "1", 
    "startdate": "0000-00-00" 
}, { 
    "labbranchid": "3", 
    "labname": "Shahdara More Branch", 
    "labtitle": "Wahab Labs Lahore", 
    "shortname": "WAHAB", 
    "address": "Shahdara", 
    "landlineno": "04237933415", 
    "datecreated": "2016-03-11 11:48:15", 
    "createdbyname": "Jamshaid Sabir", 
    "createdbyuserid": "1", 
    "dateupdated": "0000-00-00 00:00:00", 
    "updatedbyname": "", 
    "updatedbyuserid": "", 
    "clientgroups_clientgroupsid": "1", 
    "startdate": "0000-00-00" 
}, { 
    "labbranchid": "4", 
    "labname": "New Branch", 
    "labtitle": "Wahab Labs Lahore", 
    "shortname": "WAHB", 
    "address": "More Samanabad, Lahore", 
    "landlineno": "042361561", 
    "datecreated": "2016-03-11 11:52:06", 
    "createdbyname": "Jamshaid Sabir", 
    "createdbyuserid": "1", 
    "dateupdated": "2016-03-14 15:06:44", 
    "updatedbyname": "Jamshaid Sabir", 
    "updatedbyuserid": "1", 
    "clientgroups_clientgroupsid": "1", 
    "startdate": "2016-03-14" 
}, { 
    "labbranchid": "5", 
    "labname": "Test Branch", 
    "labtitle": "xyz", 
    "shortname": "sfwe", 
    "address": "dsfasd", 
    "landlineno": "sdfasd", 
    "datecreated": "2016-03-12 00:14:11", 
    "createdbyname": "Jamshaid Sabir", 
    "createdbyuserid": "1", 
    "dateupdated": "2016-08-11 12:54:12", 
    "updatedbyname": "Jamshaid Sabir", 
    "updatedbyuserid": "1", 
    "clientgroups_clientgroupsid": "1", 
    "startdate": "2016-03-12" 
}, { 
    "labbranchid": "6", 
    "labname": "Test Branch 2", 
    "labtitle": "asdfs", 
    "shortname": "asdfs", 
    "address": "asdf", 
    "landlineno": "asdf", 
    "datecreated": "2016-03-12 12:16:24", 
    "createdbyname": "Jamshaid Sabir", 
    "createdbyuserid": "1", 
    "dateupdated": "0000-00-00 00:00:00", 
    "updatedbyname": "", 
    "updatedbyuserid": "", 
    "clientgroups_clientgroupsid": "1", 
    "startdate": "2016-03-12" 
}, { 
    "labbranchid": "7", 
    "labname": "Wahab Labs, Shahdara Branch, Lahore", 
    "labtitle": "Shahdara", 
    "shortname": "Shahdara", 
    "address": "Shahdara", 
    "landlineno": "0423744915", 
    "datecreated": "2016-08-11 12:56:27", 
    "createdbyname": "Jamshaid Sabir", 
    "createdbyuserid": "1", 
    "dateupdated": "2016-08-11 12:57:01", 
    "updatedbyname": "Jamshaid Sabir", 
    "updatedbyuserid": "1", 
    "clientgroups_clientgroupsid": "1", 
    "startdate": "2016-08-01" 
}] 

別の配列の要素は以下のとおりです。

labsOfUser = [{ 
    "userhasbranchid": "53", 
    "labbranches_labbranchid": "6", 
    "usersoflabs_userId": "9" 
}, { 
    "userhasbranchid": "54", 
    "labbranches_labbranchid": "1", 
    "usersoflabs_userId": "9" 
}, { 
    "userhasbranchid": "55", 
    "labbranches_labbranchid": "7", 
    "usersoflabs_userId": "9" 
}, { 
    "userhasbranchid": "56", 
    "labbranches_labbranchid": "2", 
    "usersoflabs_userId": "9" 
}] 

は今、私は選択の複数のボックスを持っているし、選択し、いくつかのように選択されていないとして、私はいくつかの枝を示しました。コードは以下の通りである：

function populateSelectedLabs() { 

    $('#labbranchids').empty(); 
    if (allLabBranches.length >= labsOfUser.length) { 
     for (var i = 0; i < allLabBranches.length; i++) { 
     for (var j = 0; j < labsOfUser.length; j++) { 
      if (allLabBranches[i].labbranchid == labsOfUser[j].labbranches_labbranchid) { 

      $("#labbranchids").append("<option selected='selected' value='" + allLabBranches[i].labbranchid + "'>" + allLabBranches[i].labname + "</option>"); 
      allLabBranches = jQuery.grep(allLabBranches, function(value) { 
       return value != allLabBranches[i]; 
      }); 
      } //end inner if   

     } //end inner loop 
     } //end outer loop 
    } //end if 
    for (var i = 0; i < allLabBranches.length; i++) { 
     $("#labbranchids").append("<option value='" + allLabBranches[i].labbranchid + "'>" + allLabBranches[i].labname + "</option>"); 
    } //end for loop 


    } //end function 

問題は、配列要素の比較配列中に存在するが、アレイ内の異なるインデックスに配置されている要素を見逃しています。エラーは、次のコード行で発生します。

if(allLabBranches[i].labbranchid == labsOfUser[j].labbranches_labbranchid){ 

両方の配列のすべての要素を比較する方法を教えてください。

Answer 1

特定の項目が一致しないのは、その同じ配列のループ内にallLabBranchesを再定義して、それをより短くすることです。

labsOfUser[j-1].labbranches_labbranchid == allLabBranches[i+1].labbranchid 

あなたはこの平等は外側のループの次の繰り返しで、後に検出されることを期待する：

はのは、それは次のように変更する前にすることは真実であると仮定しよう。しかし、allLabBranchesへの再割り当てにより、この値はインデックスi+1ではなく、iになります。この値は、（一致する値がj-1にあるため）内側ループの残りの部分ではもはや一致しないため、iは外側ループの次の繰り返しのために増加します。その結果、この値は決して一致しません。

allLabBranches配列を逆方向に反復することでこれを解決できますが、labsOfUser配列の値を持つハッシュを作成する方が良いでしょう。これによりパフォーマンスが向上します。

あなたはこのようにそれを行うことができます

：

function populateSelectedLabs() { 
    $('#labbranchids').empty(); 
    // create hash 
    var hash = {}; 
    for (var j = 0; j < labsOfUser.length; j++) { 
     hash[labsOfUser[j].labbranches_labbranchid] = 1; 
    } 
    allLabBranches = jQuery.grep(allLabBranches, function(value) { 
     return hash[value.labbranchid]; 
    }).concat(jQuery.grep(allLabBranches, function(value) { 
     return !hash[value.labbranchid]; 
    })); 

    for (var i = 0; i < allLabBranches.length; i++) { 
     $("#labbranchids").append($('<option>') 
      .val(allLabBranches[i].labbranchid) 
      .text(allLabBranches[i].labname) 
      .attr('selected', hash[allLabBranches[i].labbranchid])); 
    } 
} 

ターゲットブラウザはES6をサポートしている場合、あなたはこのようにそれを書くことができます：

function populateSelectedLabs() { 
    $('#labbranchids').empty(); 
    var hash = new Set(labsOfUser.map(value => value.labbranches_labbranchid)); 
    allLabBranches.filter(value => hash.has(value.labbranchid)) 
     .concat(allLabBranches.filter(value => !hash.has(value.labbranchid))) 
     .forEach(value => 
      $("#labbranchids").append($('<option>') 
       .val(value.labbranchid) 
       .text(value.labname) 
       .attr('selected', hash.has(value.labbranchid))) 
     ); 
}