マニュアルに明記してあるのだが、挙動を抑えづらいのでJSBinで実際にコードを走らせつつ確認する。
lodash.mergeとは
再帰的にObjectを合体する関数。配列に対しては、中身がObjectなら同インデックスのObject同士を合体する。JSBinでみる
var merged;
merged = _.merge([
{
name: 'banana',
price: 80
}, {
name: 'apple',
price: 120
}
], [
{
color: 'yellow',
category: 'vegetable'
}, {
color: 'red',
category: 'fruit'
}
]);
console.log(merged); /*=>
[{
category: "vegetable",
color: "yellow",
name: "banana",
price: 80
}, {
category: "fruit",
color: "red",
name: "apple",
price: 120
}]
*/
配列自体を合体する
配列の中身がObjectでない場合はマージ不能と判定されて後に指定した配列が適用されるのだが、下の例のように配列自体を合体して欲しい場合がある。JSBinでみる
var merged;
merged = _.merge({
name: 'banana',
tags: ['yellow']
}, {
price: 80,
tags: ['vegetable']
});
console.log(merged); /*=>
{
name: "banana",
price: 80,
tags: ["vegetable"] -> tags: ["yellow", "vegetable"] となってほしい！
}
*/
この問題は第三引数でカスタム関数を指定することで解決できる。2つの値をどのようにマージするのか指定できるので、配列ならArray#concatするよう実装する。JSBinでみる
var merged;
merged = _.merge({
name: 'banana',
tags: ['yellow']
}, {
price: 80,
tags: ['vegetable']
}, function(a, b) {
if (_.isArray(a) && _.isArray(b)) {
return a.concat(b);
}
});
console.log(merged); /*=>
{
name: "banana",
price: 80,
tags: ["yellow", "vegetable"]
}
*/