javascript - 如何获取一个对象，将其设置为来自与另一个对象的属性匹配的预定值的特定属性？

Question

*** 我修改了上述问题，以便根据我的问题的意图更有意义，并且此代码模式可能会出现混淆/误解。

总体而言，我想要完成的是能够创建一个对象，从为空，并将其设置为具有属性名称的东西，同时将该属性名称设置为另一个对象的值。

这将允许我做的是创建一个对象，该对象将具有一个属性，该属性将包含一个具有属性的对象，其中一个将是键，该值的值将是其中的属性的名称新对象设置为。

为什么我需要这个或想要这个新对象......

这个模式的目的，我看到它的用途是获取一个设置为接口/名称的对象，其中设置为包含属性的对象与引用中的值之一同名财产的价值。这听起来令人困惑，所以我创建了一个 jsbin 来说明我所要求的解决方案......如果其他人对我的问题有更好的解释或标题，请告知。

我与代码示例一起提供的答案是我通过我的理解所要求和实现的。

------上一个问题--------

我的问题是为什么或何时应该决定采用对象属性并将其设置为另一个对象。对我来说，似乎继承“设置”是原因，但我不是 100% 确定。此外，我不确定何时应该考虑这一点，以及在什么情况下我应该决定使用这种模式。

我可以阅读代码并遵循它，但我最困惑和相关的问题是 object[property] = otherObject;

也许这与 Object.assign() 构造有关？我所知道的是，我已经看过几次这样的操作，并且对为什么以及何时应该知道使用这种模式感到有些困惑。不过，我在这里可能还缺少其他东西。

这是我引用的代码示例。

constructor(props) {
super(props);
this.state = {
  completedAssets : 0,
  totalAssets : 0,
  currentDownloads: {},
  logs: []
};
}

let currDownloadObject = {
  fileName: fileName,
  currentSize: loaded,
  totalSize: total,
  complete: (loaded === total),
  completeOrder : fileCompleteOrder,
  order: (file) ? file.order : Object.keys(this.state.currentDownloads).length + 1
}

let currentDownloadStateArray = Object.assign({},this.state.currentDownloads);

currentDownloadStateArray[fileName] = currDownloadObject;

this.setState({currentDownloads: currentDownloadStateArray});

这是一个让我最困惑的输出示例。

运行此日志语句时：

console.log('currentDownloadStateArray ', currentDownloadStateArray);

我得到这个回报的例子：

https://navigation/az.png: {fileName: "https://navigation/az.png", currentSize: 7451, totalSize: 7451, complete: true, completeOrder: 1, …}
https://navigation/destination.png: {fileName: "https://avigation/destination.png", currentSize: 8322, totalSize: 8322, complete: true, completeOrder: 2, …}

所以现在，实际上，currentDownloadStateArray 被设置为一个对象，该对象具有每个文件名属性的接口。<<< 为什么会发生这种情况，它的用途是什么

标签： javascriptobjectjavascript-objects

Answer 1

要创建一个由包含该对象的另一个对象设置为值的新对象，您将执行以下操作。

let state = {
  iteratedFoo: {} // this is a dictionary of dictionaried objects... an object which is a collection of objects.
};

let currentDownloadState = (someValue, anotherValue, urlName) => {

let bar = {
  fileName: urlName,
  someProp: someValue,
  anotherProp: anotherValue
}

let foo = Object.assign({}, state['iteratedFoo'] )

// console.log('foo[urlName] = ', foo[urlName]); // undefined because it wasn't set yet on first loop

foo[urlName] = bar;

console.log('bar ', bar);
console.log('foo ', foo);
console.log('foo[urlName] = ', foo[urlName]);

state['iteratedFoo'] = foo;

console.log('state["iteratedFoo"] ', state['iteratedFoo']);
}

currentDownloadState('this value', 'another value', 'www.msn.com');
currentDownloadState('this value', 'another value', 'www.espn.com');
currentDownloadState('this value', 'another value', 'www.theverge.com');

当重复此函数时， iteratedFoo 对象创建一个对象，该对象是 foo 对象的集合，该对象包含一个属性名称，该属性名称包含一个具有属性的值，其中一个属性是 foo 属性名称的值......在这种情况下为 foo [网址名称]

http://jsbin.com/linebap/1/edit?js,console

这样做的目的和用例最终将创建由所述引用对象的属性值引用的对象集合。

生成的 state.iteratedFoo 对象现在看起来像这样......

"state[\"iteratedFoo\"] "
[object Object] {
 www.espn.com: [object Object] {
    anotherProp: "another value",
    fileName: "www.espn.com",
    someProp: "this value"
  },
  www.msn.com: [object Object] {
    anotherProp: "another value",
    fileName: "www.msn.com",
    someProp: "this value"
  },
 www.theverge.com: [object Object] {
    anotherProp: "another value",
    fileName: "www.theverge.com",
    someProp: "this value"
  }
}