javascript - 深度替换知道我们必须在其中注入(inject)值的对象中的属性值的值

Question

我们有一个深层嵌套的结构，每次运行应用程序时都会发生变化。

{
  some: {
    complex: {
      unknown: {
        structure: {
          fields: [
            { name: "group1", other: "data", currentValue: "" },
            { name: "group2", other: "another data", currentValue: "" },
          ]
        }
      }
    }
  }
}

我们必须在此结构中注入(inject)适当的值。我们收到例如

{ 
  group1: 'the proper value'
}

而且我们必须替换适当组中的值才能得到:

{
  some: {
    complex: {
      unknown: {
        structure: {
          fields: [
            { name: "group1", other: "data", currentValue: "the proper value" },
            { name: "group2", other: "another data", currentValue: "" },
          ]
        }
      }
    }
  }
}

我们尝试使用 lodash mergeWith 但是因为我们不知道我们必须注入(inject)的值到底在哪里，我们只知道我们必须注入(inject)值的对象的键的值，我们没有设法得到这个工作。

Answer 1

有一个递归函数遍历对象并根据您所寻求的值对其进行变异。

const obj = {
  some: {
    complex: {
      unknown: {
        structure: {
          fields: [{
              name: 'group1',
              other: 'data',
              currentValue: '',
            },
            {
              name: 'group2',
              other: 'another data',
              currentValue: '',
            },
          ],
        },
      },
    },
  },
};

const toChange = {
  group1: 'the proper value',
  group2: 'the proper value 2',
};

// Recursive function that go replace
function lookAndReplace(config, ptr) {
  // If we deal with an object look at it's keys
  if (typeof ptr === 'object') {
    Object.keys(ptr).forEach((x) => {
      // If the keys is the one we was looking for check the value behind
      if (x === config.keyToCheck) {
        // We have found one occurence of what we wanted to replace
        // replace the value and leave
        if (ptr[x] === config.key) {
          ptr[config.keyToReplace] = config.value;
        }

        return;
      }

      // Go see into the value behind the key for our data
      lookAndReplace(config, ptr[x]);
    });
  }

  // If we are dealing with an array, look for the keys
  // inside each of the elements
  if (ptr instanceof Array) {
    ptr.forEach(x => lookAndReplace(config, x));
  }
}

// For each group we look for, go and replace
Object.keys(toChange).forEach(x => lookAndReplace({
  key: x,
  value: toChange[x],
  keyToCheck: 'name',
  keyToReplace: 'currentValue',
}, obj));

console.log(obj);

---

/!\重要这个解决方案也适用于嵌套数组

const obj = {
  some: {
    complex: {
      unknown: {
        structure: {
          // fields is an array of array
          fields: [
            [{
              name: 'group1',
              other: 'data',
              currentValue: '',
            }],
            [{
              name: 'group2',
              other: 'another data',
              currentValue: '',
            }],
          ],
        },
      },
    },
  },
};

const toChange = {
  group1: 'the proper value',
  group2: 'the proper value 2',
};

// Recursive function that go replace
function lookAndReplace(config, ptr) {
  // If we deal with an object look at it's keys
  if (typeof ptr === 'object') {
    Object.keys(ptr).forEach((x) => {
      // If the keys is the one we was looking for check the value behind
      if (x === config.keyToCheck) {
        // We have found one occurence of what we wanted to replace
        // replace the value and leave
        if (ptr[x] === config.key) {
          ptr[config.keyToReplace] = config.value;
        }

        return;
      }

      // Go see into the value behind the key for our data
      lookAndReplace(config, ptr[x]);
    });
  }

  // If we are dealing with an array, look for the keys
  // inside each of the elements
  if (ptr instanceof Array) {
    ptr.forEach(x => lookAndReplace(config, x));
  }
}

// For each group we look for, go and replace
Object.keys(toChange).forEach(x => lookAndReplace({
  key: x,
  value: toChange[x],
  keyToCheck: 'name',
  keyToReplace: 'currentValue',
}, obj));

console.log(obj);

---

const obj = {
  some: {
    complex: {
      unknown: {
        structure: {
          fields: [{
              name: "group1",
              other: "data",
              currentValue: ""
            },
            {
              name: "group2",
              other: "another data",
              currentValue: ""
            },
          ]
        }
      }
    }
  }
};

const toChange = {
  group1: 'the proper value',
  group2: 'the proper value 2',
};

// Recursive function that go replace
function lookAndReplace({
  key,
  value,
  keyToCheck,
  keyToReplace,
}, ptr) {
  // If we deal with an object
  if (typeof ptr === 'object') {
    Object.keys(ptr).forEach((x) => {
      if (x === keyToCheck) {
        // We have found one
        if (ptr[x] === key) {
          ptr[keyToReplace] = value;
        }
      } else {
        lookAndReplace({
          key,
          value,
          keyToCheck,
          keyToReplace,
        }, ptr[x]);
      }
    });
  }

  if (ptr instanceof Array) {
    ptr.forEach(x => lookAndReplace({
      key,
      value,
      keyToCheck,
      keyToReplace,
    }, x));
  }
}

// For each group we look for, go and replace
Object.keys(toChange).forEach(x => lookAndReplace({
  key: x,
  value: toChange[x],
  keyToCheck: 'name',
  keyToReplace: 'currentValue',
}, obj));

console.log(obj);