【问题标题】:How can I take an object, set it to a specific property that is from a predetermined value that matches a property from another object?如何获取一个对象,将其设置为来自与另一个对象的属性匹配的预定值的特定属性?
【发布时间】:2018-08-08 18:14:52
【问题描述】:

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

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

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

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

这个模式的目的,我看到它的用途是获取一个设置为接口/名称的对象,其中设置为包含属性的对象与其中一个值同名在引用属性的值中。这听起来令人困惑,所以我创建了一个 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 被设置为一个对象,该对象具有每个文件名属性的接口。

【问题讨论】:

  • 究竟是什么让您感到困惑?那Objects可以嵌套吗?还是这段代码?
  • @JonasWilms 我得到对象可以嵌套并且字典的字典......令人困惑的是为什么我将对象的属性设置为另一个对象?例如,这个 newObj[property] 将等于 someOtherObject...为什么我需要这样做...这更有意义吗?
  • 和 @JonasWilms 然后当我最终设置 currentDownloads 的状态 obj 时:我只使用 newObj 数组,它是 currentDownloads: currentDownloadStateArray... 不是 currentDownloadStateArray[fileName]
  • 问题不清楚。您想知道标题中问题的答案吗?还是您对为什么在特定情况下这样做更感兴趣?为什么通常会这样做?

标签: javascript object javascript-objects


【解决方案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[urlName]

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"
  }
}

【讨论】:

    猜你喜欢
    • 2022-11-10
    • 1970-01-01
    • 2015-10-22
    • 1970-01-01
    • 2019-03-01
    • 2022-09-23
    • 2020-06-22
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多