javascript - 阻止对象共享值

Question

为了进行设置，我创建了 2 个舰队对象，将它们存储在一个数组中，然后将该数组打印到控制台。这是创建两个舰队对象后我得到的。

[
  { number: 1, activities: [], addActivity: [Function (anonymous)] },
  { number: 2, activities: [], addActivity: [Function (anonymous)] } 
]

fleet 对象的addActivity 函数将一个事件添加到指定对象的activities 数组中。这是函数。

    fleet.addActivity = function(activity) {
        this.activities.push(activity);
    }

但是，每当我使用此函数时，它都会更改数组中的两个舰队对象，以便它们具有与我指定的相同的编号。例如，

const fleet = Fleet.getFleet(1);
fleet.addActivity('Run');

这是在控制台打印的:

[
  {
    number: 1,
    activities: [ 'Run' ],
    addActivity: [Function (anonymous)]
  },
  { number: 1, activities: [], addActivity: [Function (anonymous)] }
]

如果我再次使用

const fleet = Fleet.getFleet(2);
fleet.addActivity('Walk');

控制台会打印:

[
  {
    number: 2,
    activities: [ 'Walk', 'Run' ],
    addActivity: [Function (anonymous)]
  },
  { number: 2, activities: [], addActivity: [Function (anonymous)] }
]

有人知道如何解决这个问题吗？

编辑 - 这是 getFleet 函数:

function getFleet(fleetNumber) {
    let result = exports.fleets.filter(function (e) {
        return e.number = fleetNumber;
    });
    return result[0];
}

我也试过lodash深克隆的方法，还是有同样的问题。这是我的 addFleet 函数目前的样子。我以前创建舰队的方法已被注释掉。

function addFleet(number) {
    /*let fleet = {
        number: number,
        activities: []
    };
    fleet.addActivity = function(activity) {
        this.activities.push(activity);
    }*/
    const deepClone = lodash.cloneDeep(originalFleet);
    deepClone.number = number;
    exports.fleets.push(deepClone);
    exports.fleetAmount += 1;
    exports.currentFleets.push(number);
}

Answer 1

您的问题出在您的 getFleet() 函数中。您实际上是在覆盖变量，而不是检查每个对象编号是否相等。解决方法很简单，只需将一个等号改为三个。

function getFleet(fleetNumber) {
    let result = exports.fleets.filter(function (e) {
        return e.number === fleetNumber; // check for equality instead of overwriting
    });
    return result[0];
}

此外，您使函数过于复杂。由于您只需要找到第一个匹配项，因此您应该使用 Array.prototype.find()

function getFleet(fleetNumber) {
  return exports.fleets.find((e) => e.number === fleetNumber)
}