Question

我想通过针对array of objects

测试一些properties来添加/替换array object中的object if name and id matches

替换object
将array if name and id does not match from array objects添加到let arr = [{name: 'test1', id:1, data: {a:1} }, {name:'test2', id:2, data: {a:2}}] let obj = {name:'test3', id:3, data: {a:3}} let itemFound = false; let newArr = arr.map((item)=>{ let test = item.name === obj.name && item.id === obj.id; if(test){ itemFound = true; } return test ? obj : item; }); if(!itemFound){ newArr.push(obj); } console.log(newArr)

我正在使用下面的代码，它的工作正常，但我不确定它是一个很好的解决方案。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css" integrity="sha384-Zug+QiDoJOrZ5t4lssLdxGhVrurbmBWopoEl+M6BdEfwnCJZtKxi1KgxUyJq13dy" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/js/bootstrap.min.js" integrity="sha384-a5N7Y/aK3qNeh15eJKGWxsqtnX/wWdSZSKp+81YjTmS15nvnvxKHuzaWwXHDli+4" crossorigin="anonymous"></script>
<div class='col-xs-12'>
</div>
<table class="table table-hover" width="100%">
  <thead>
    <tr>
      <th>Day</th>
      <th>Open 24h</th>
      <th>Open at</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="col-xs-1">Monday</td>
      <td class="col-xs-1">
        <input type="checkbox" name="" value="">24Hours
      </td>
      <td>
<div class="row">
<div class="col-xs-4">
        <select class="form-control">
                <option value="12"></option>
              </select>
</div>
<div class="col-xs-4">
        <select class="form-control">
                <option value="00"></option>
              </select>
</div>
<div class="col-xs-4">
        <select class="form-control">
                <option value="AM"></option>
              </select>
</div>
</div>
      </td>
    </tr>

Answer 1

您可以查找索引并更新数组（如果找到）或推送对象。

var array = [{ name: 'test1', id: 1, data: { a: 1 } }, { name: 'test2', id: 2, data: { a: 2 } }],
    object = { name: 'test3', id: 3, data: { a: 3 } },
    index = array.findIndex(({ name, id }) => name === object.name && id === object.id);

if (index === -1) {
    array.push(object);
} else {
    array[index] = object;
}

console.log(array);

Answer 2

您可以使用Array.prototype.find()

let arr = [{name: 'test1', id:1, data: {a:1} }, {name:'test2', id:2, data: {a:2}}]
let obj = {name:'test3', id:3, data: {a:3}}

const newArr = arr.slice();
const existingObj = newArr.find(item => item.name === obj.name && item.id === obj.id);

if(existingObj) {
    Object.assign(existingObj, obj);
} else {
    newArr.push(obj)
}

console.log(newArr)

Answer 3

在函数中包装@Nina Scholz的答案

objectReplacer(arrayOfObjects, newObject) {

      let index = arrayOfObjects.findIndex((value) => value === newObject.value);

      if (index === -1) {
        arrayOfObjects.push(newObject);
      } else {
        arrayOfObjects[index] = newObject;
      }
    }

从对象数组中添加/替换对象JavaScript

3 个答案: