javascript - 如何停止对象数组中的重复数据输入

Question

我有一个名为validationValueIdValues的数组，因此当用户单击输入状态时，即。 validationIdValue 获取各个输入框的值。现在，一个用户选择"is"或“否”选项。该函数创建一个 obj，其键名称等于 state，validationIdValue 且值等于用户选择，简而言之，创建一个像这样的 obj

{08765d0f-2e7a-4fbd-9282-c38f5ddf8d8b: "NO"}

然后这个对象被推送到validationValueIdValues变量。现在，当用户选择相同的框并将选择值从“否”更改为"is"时，就会出现问题

  {08765d0f-2e7a-4fbd-9282-c38f5ddf8d8b: "YES"}

然后这个对象被推送到validationValueIdValues变量，而不检查先前带有键的相同对象是否存在，如果存在则从数组中删除该对象。我为此目的使用以下代码，但数组中仍然存在重复的 obj。

  var validationValueIdValues = []  //as global variable

  if (this.state.selectedOption === "YES") {
    const attribute = {};
    attribute[this.state.validationIdValue] = "YES";
    if (validationValueIdValues.length > 0) {
      validationValueIdValues.forEach((data, index) => {
        if (Object.keys(data) == this.state.validationIdValue) {
          validationValueIdValues.splice(index, 1);
            validationValueIdValues.push(attribute);
        }
      });
    } else {
      validationValueIdValues.push(attribute);
    }
  }

我对 this.state.selectedOption === "NO"使用了相同的 if 语句

Answer 1

您需要检查数组中的所有键才能找到匹配的值。正如您提到的，您不需要为"is"或“否”重复代码。像这样的东西足够通用来处理它

const validationValueIdValues = []  //as global variable


const addOrUpdateValidationValues = (newValidationValue) => {
    if(!newValidationValue) {
        return;
    }
    const keyOfNewValue = Object.keys(newValidationValue)[0]
    let added = false
    // loop through all values
    for(const validationValue of validationValueIdValues) {
        const keyOfCurrentValue = Object.keys(validationValue)[0]
        if(keyOfNewValue === keyOfCurrentValue) {
            // found that kind of key then just replace the value 
            added = true
            validationValue[keyOfCurrentValue] = newValidationValue[keyOfNewValue]
        }
    }
    // not added push
    if(!added) {
        validationValueIdValues.push(newValidationValue)
    }

}


// ...
// when you have the select or what ever event
// just call
addOrUpdateValidationValues(this.state.selectedOption)