将数组中的元素与各种数据类型交换

Question

所以我四处寻找答案，我确实得到了一些见解，但无法完全找到所需的解决方案。我的问题是这样的：

因此，我有一个数字为1到5的键盘，当我选择其中一个数字键时，它会将其移动到一个名为 的数组中，作为一个对象，如下所示：numberPad

[

  { number: 1, alias: 'one', checked: true, option: 'Option for key 1' },

  { number: 4, alias: 'four', checked: true, option: 'Option for key 4' }

]

然后，它将 每个索引呈现为一个样式卡，每个索引都是自己的可单击下拉按钮。单击呈现的数字时，将看到一个单独的按钮列表（* 也是 1 到 5*），如果在该新按钮列表中单击了一个不在数组中的数字，则将数据推送到 。如果数字存在于 中，那么我需要在这里做一些事情...numberPadnumbernumberPadnumberPadnumberPad

假设渲染了 1 和 4，我单击数字 4 以打开按钮列表。如果我现在选择1，因为它已经在数据数组中，我只想在两者之间交换值。option

所以，我点击4，按钮列表打开，我点击1，我希望我的数组看起来像这样：

[

  { number: 1, alias: 'one', checked: true, option: 'Option for key 4' },

  { number: 4, alias: 'four', checked: true, option: 'Option for key 1' }

]

我在到达那里时遇到了一些麻烦。我在SO上看到了许多关于交换函数的答案，但这些答案似乎将整个索引与另一个索引交换，因为我只想在单击时交换一个键/值对。

有没有人在这里有任何建议，请...？提前致谢！！

Answer 1

好吧，所以我觉得很傻。我已经有这个交换函数，我写了：swapArray = (input, i, j) => {  // do not mutate original array  const copyArray = input.slice(0);  [copyArray[i], copyArray[j]] = [copyArray[j], copyArray[i]];  return copyArray;};我所要做的就是像这样扩展函数：swapArray = (input, i, j, data) => {  // do not mutate original array  const copyArray = input.slice(0);  [copyArray[i][data], copyArray[j][data]] = [copyArray[j][data], copyArray[i][data]];  return copyArray;};然后，我所要为上面的数组所做的就是：numberPadswapArray(numberPad, 0, 1, 'option')它产生了正确的结果。不知道我怎么没有马上意识到这一点。Mods，请随时关闭这个问题，请...

Answer 2

我假设对象将是您在问题中提到的数组的输入，并相应地进行了更改。我正在根据要求改变相同的数据对象。希望此功能可以帮助您找到所需的内容。let data = [  {    "number": 1,    "alias": "one",    "checked": true,    "option": "Option for key 1"  },  {    "number": 4,    "alias": "four",    "checked": true,    "option": "Option for key 4"  }]let swapOptions = (clickedObj, selectedObj) => {    const selectedObjIndex = data.findIndex(d => d.number === selectedObj.number)    if(selectedObjIndex === -1) {        data.push(selectedObj);        return;    }     clickedObjIndex = data.findIndex(d => d.number === clickedObj.number)    data.splice(clickedObjIndex, 1, {...clickedObj, option: selectedObj.option})    data.splice(selectedObjIndex, 1, {...selectedObj, option:clickedObj.option})}swapOptions(data[1], data[0])console.log(data)swapOptions(data[0], {  "number": 5,  "alias": "one",  "checked": true,  "option": "Option for key 5"})console.log(data)