2つの異なる配列（照合値）に基づいて新しい配列を作成する

Question

JavaScriptで2つの配列があり、最初の配列に基づいて配列を再配置したいとします。

最初の配列：私は再手配arrayOneに一致するpage_idのに基づいしたい

var arrayOne = [ 
     "5", 
     "1", 
     "2", 
     "4" 
    ] 

二番目の配列：

var arrayTwo = [ 
    { 
     "page_id" : "5", 
     "page_title" : "About" 
    }, 
    { 
     "page_id" : "2", 
     "page_title" : "Home" 
    }, 
    { 
     "page_id" : "4", 
     "page_title" : "Contact Us" 
    }, 
    { 
     "page_id" : "1", 
     "page_title" : "Gallery" 
    }, 
]; 

再配置した後 私はpage_idに基づいてarrayTwoを再配置したいので、2番目の配列を再配置すると、次のようになります。

var arrayTwo = [ 
    { 
     "page_id" : "5", 
     "page_title" : "About" 
    }, 
    { 
     "page_id" : "1", 
     "page_title" : "Gallery" 
    }, 
    { 
     "page_id" : "2", 
     "page_title" : "Home" 
    }, 
    { 
     "page_id" : "4", 
     "page_title" : "Contact Us" 
    }, 

]; 

私はこの時点で非常に固執しています。私はここで多くのソート「解決策」とGoogleを見つけましたが、うまく動作していないようです。私はこれを行うためにfor-loopを使ってみましたが、実際にはどこにも行きませんでした。私は通常、助けを求めないだろうが、私は3時間の良い検索のために立ち往生してきた。

最初の一致と一致するのはpage_idで、2番目に一致しているため、使用できる一致がありますが、言われたように私はかなり固執しています。

ご協力いただきありがとうございます！

Answer 1

まずオブジェクトに二番目の配列を変換する - キーがpage_idのだろう、例えば：

arrayOne.map(x => map[x]); 

ワーキング例：

var map = arrayTwo.reduce((a, b) => { 
    a[b.page_id] = b; 
    return a; 
}, {}); 

は、今、私たちは簡単のように最初の配列を、mapすることができます：http://jsbin.com/tiyudutasi/edit?js,console

Answer 2

Array.prototype.map()を使用して、arrayOne、Array.prototype.filter()を繰り返すことができます。

var index = {}; 
arrayTwo.forEach(function(obj){index[obj.page_id] = obj;}); 

その後、あなたは：あなたが最初の「インデックス」とは、オブジェクトの数与えられた数を返すことができますを作成し、現在に等しいpage_idarrayOne値

var arrayOne = [ 
 
    "5", 
 
    "1", 
 
    "2", 
 
    "4" 
 
]; 
 

 
var arrayTwo = [{ 
 
    "page_id": "5", 
 
    "page_title": "About" 
 
}, { 
 
    "page_id": "2", 
 
    "page_title": "Home" 
 
}, { 
 
    "page_id": "4", 
 
    "page_title": "Contact Us" 
 
}, { 
 
    "page_id": "1", 
 
    "page_title": "Gallery" 
 
}]; 
 

 
arrayTwo = arrayOne.map(function(id) { 
 
    return arrayTwo.filter(function(obj) { 
 
    return obj.page_id === id 
 
    })[0] 
 
}); 
 

 
console.log(arrayTwo);

Answer 3

を持つarrayTwoでマッチオブジェクトインデックスを使用してオブジェクトを並べ替えることができます：

var reordered = arrayOne.map(function(id){return arrayTwo[id];}); 

Answer 4

また、2 forEachの（アレイあたり1）

var arrayOne = [ 
    "5", 
    "1", 
    "2", 
    "4" 
] 
var arrayTwo = [ 
    { 
     "page_id" : "5", 
     "page_title" : "About" 
    }, 
    { 
     "page_id" : "2", 
     "page_title" : "Home" 
    }, 
    { 
     "page_id" : "4", 
     "page_title" : "Contact Us" 
    }, 
    { 
     "page_id" : "1", 
     "page_title" : "Gallery" 
    }, 
]; 

var result = []; 
arrayOne.forEach(item => arrayTwo.forEach(element => { if (item === element.page_id) result.push(element)})); 

console.log(result); 

Answer 5

私が読みやすくなりますfindを使用して考えるを使用することができます。あなたはより多くのブラウザをサポートする必要がある場合

arrayOne.map(id => arrayTwo.find(row => row.page_id === id)); 

、あなたの代わりにsortを使用することができます。

arrayTwo.sort((a, b) => arrayOne.indexOf(a.page_id) - arrayOne.indexOf(b.page_id));