it-swarm.com.de

Objekte im Array ersetzen

Ich habe dieses Javascript-Objekt:

var arr1 = [{id:'124',name:'qqq'}, 
           {id:'589',name:'www'}, 
           {id:'45',name:'eee'},
           {id:'567',name:'rrr'}]

var arr2 = [{id:'124',name:'ttt'}, 
           {id:'45',name:'yyy'}]

Ich muss Objekte in arr1 durch Elemente aus arr2 mit derselben id ersetzen.

Hier ist das Ergebnis, das ich erhalten möchte:

var arr1 = [{id:'124',name:'ttt'}, 
           {id:'589',name:'www'}, 
           {id:'45',name:'yyy'},
           {id:'567',name:'rrr'}]

Wie kann ich es mit Javascript implementieren?

14
Michael

Sie können Array#map mit Array#find verwenden.

arr1.map(obj => arr2.find(o => o.id === obj.id) || obj);

var arr1 = [{
    id: '124',
    name: 'qqq'
}, {
    id: '589',
    name: 'www'
}, {
    id: '45',
    name: 'eee'
}, {
    id: '567',
    name: 'rrr'
}];

var arr2 = [{
    id: '124',
    name: 'ttt'
}, {
    id: '45',
    name: 'yyy'
}];

var res = arr1.map(obj => arr2.find(o => o.id === obj.id) || obj);

console.log(res);

Hier gibt arr2.find(o => o.id === obj.id) das Element zurück, d. H. Objekt aus arr2, wenn die id im arr2 gefunden wird. Wenn nicht, wird dasselbe Element in arr1, d. H. obj, zurückgegeben.

37
Tushar

Wenn Sie sich nicht für die Reihenfolge des Arrays interessieren, möchten Sie vielleicht die Differenz zwischen arr1 und arr2 durch id mit differenceBy () und dann einfach mit concat () alles anhängen aktualisierte Objekte.

var result = _(arr1).differenceBy(arr2, 'id').concat(arr2).value();

var arr1 = [{
  id: '124',
  name: 'qqq'
}, {
  id: '589',
  name: 'www'
}, {
  id: '45',
  name: 'eee'
}, {
  id: '567',
  name: 'rrr'
}]

var arr2 = [{
  id: '124',
  name: 'ttt'
}, {
  id: '45',
  name: 'yyy'
}];

var result = _(arr1).differenceBy(arr2, 'id').concat(arr2).value();

console.log(result);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.13.1/lodash.js"></script>

1
ryeballar

Da Sie Lodash verwenden, können Sie _.map und _.find verwenden, um sicherzustellen, dass die wichtigsten Browser unterstützt werden.

Am Ende würde ich mit so etwas wie gehen:

function mergeById(arr) {
  return {
    with: function(arr2) {
      return _.map(arr, item => {
        return _.find(arr2, obj => obj.id === item.id) || item
      })
    }
  }
}

var result = mergeById([{id:'124',name:'qqq'}, 
           {id:'589',name:'www'}, 
           {id:'45',name:'eee'},
           {id:'567',name:'rrr'}])
    .with([{id:'124',name:'ttt'}, {id:'45',name:'yyy'}])

console.log(result);
<script src="https://raw.githubusercontent.com/lodash/lodash/4.13.1/dist/lodash.js"></script>

1
Dieterg

Dank ES6 können wir es auf einfache Weise schaffen -> zum Beispiel mit dem util.js-Modul;))).

  1. Füge 2 Array von Entitäten zusammen

    export const mergeArrays = (arr1, arr2) => arr1 && arr1.map(obj => arr2 && arr2.find(p => p.id === obj.id) || obj);

erhält 2 Array und führt es zusammen

  1. Array mit demselben Entitätstyp zusammenführen

    export const mergeArrayWithObject = (arr, obj) => arr && arr.map(t => t.id === obj.id ? obj : t);

es verschmilzt dieselbe Art von Array des Typs mit einer Art von Typ, zum Beispiel: Array der Person -> [{id: 1, Name: "Bir"}, {id: 2, Name: "Iki"}, {id: 3 , Name: "Uc"}] zweiter Parameter Person {ID: 3, Name: "Name geändert"} Ergebnis ist [{ID: 1, Name: "Bir"}, {ID: 2, Name: "Iki"}, {id: 3, name: "Name geändert"}]

1
Musa

Ich reiche diese Antwort nur ein, weil die Leute Bedenken hinsichtlich der Browser und der Aufrechterhaltung der Reihenfolge von Objekten geäußert haben. Ich weiß, dass dies nicht der effizienteste Weg ist, um dieses Ziel zu erreichen. 

Ich habe das Problem in zwei Funktionen zur besseren Lesbarkeit aufgeteilt.

// The following function is used for each itertion in the function updateObjectsInArr
const newObjInInitialArr = function(initialArr, newObject) {
  let id = newObject.id;
  let newArr = [];
  for (let i = 0; i < initialArr.length; i++) {
    if (id === initialArr[i].id) {
      newArr.Push(newObject);
    } else {
      newArr.Push(initialArr[i]);
    }
  }
  return newArr;
};

const updateObjectsInArr = function(initialArr, newArr) {
    let finalUpdatedArr = initialArr;  
    for (let i = 0; i < newArr.length; i++) {
      finalUpdatedArr = newObjInInitialArr(finalUpdatedArr, newArr[i]);
    }

    return finalUpdatedArr
}

const revisedArr = updateObjectsInArr(arr1, arr2);

jsfiddle

1
spwisner
function getMatch(elem) {
    function action(ele, val) {
        if(ele === val){ 
            elem = arr2[i]; 
        }
    }

    for (var i = 0; i < arr2.length; i++) {
        action(elem.id, Object.values(arr2[i])[0]);
    }
    return elem;
}

var modified = arr1.map(getMatch);
0
user8201502