Question

我想具有更新元素prop的功能。像这样

function updateElement(element, propName, value){
    element[propName] = value;
}

执行将类似于：

updateElement(item, "name", "foo")

它正在工作，但我想将propName作为函数来避免字符串：

updateElement(item, x => x.name, "foo");

但是我不确定该如何实现，我有类似的东西，但是它不起作用

function updateElement(element, mapFn, value){
    mapFn(element) = value;
}

你能帮我吗？

编辑我想有一个更通用的解决方案，例如，我想避免使用硬编码字符串：

let item = {name: 'foo', address: {...}, ...};

我想以这种方式调用我的函数：

updateElement(item, x => x.name, "foo") <- it will update name, or


updateElement(item, x => x.address, newAddress) <- it will change prop of address

Answer 1

这是我的评论的扩展，但您可以使用具有签名的回调：

（object：Object，value：any）=> //做事

以下是实现的功能，该功能可以验证并将值设置为预定义的属性。

想法：

创建一个包装函数，该函数接受回调并返回处理函数。
处理函数定义行为，而与对象无关。
您可以在任何对象上调用此函数，并且具有相同的副作用。

这种方法的好处是，您可以创建通用的验证器和设置器函数。

function updateElement(setCallback, validateCallback) {
  return function setValue(object, value) {
    if(!validateCallback || validateCallback(value)) {
      setCallback(object, value)
    } else {
      console.log("Error: Passed value is incorrect");
    }
  }
}

const dummy = {};

const setNameFn = updateElement((context, value) => context.name = value)
const setAgeFn = updateElement((context, value) => context.age = value, (value) => !isNaN(value));

setNameFn(dummy, 'foo');
setAgeFn(dummy, 'bla')
setAgeFn(dummy, 20);

console.log(dummy);

Answer 2

也许传入一个返回名称的函数？

function returnName(){
  return "name";
}

然后，您可以使用该函数返回名称并使用它进行所需的操作：

function passFunction(func){
  console.log(func());
}
passFunction(returnName);

但是为什么要传递一个函数来获取字符串呢？您可以使用内部带有字符串的对象并传递该对象。

Answer 3

您想要的东西是不可能的。 x => x.name将读取x.name的值并将其返回。在JS中，不可能获得类似于引用或指向单个属性的指针来更改其值的信息。您可以使用属性描述符来做一些事情，但这不会比分配属性简单。

让我们看看您的示例：

updateElement(item, x => x.name, "foo") // <- it will update name, or
updateElement(item, x => x.address, newAddress) // <- it will change prop of address

这只是很多代码和间接操作

item.name = "foo"
item.address = newAddress

我真的不知道updateElement函数会带来什么优势，也许您可以提供有关为什么要这样做的更多信息。

Javascript-更新对象道具的功能

3 个答案:

想法：