【问题标题】:Accessing nested JavaScript objects with variables使用变量访问嵌套的 JavaScript 对象
【发布时间】:2014-10-28 21:11:14
【问题描述】:

我想访问(获取/设置)带有变量的nestedJS 对象。

例如,静态它看起来像这样:

$obj.children.12.children.32.Name; // Returns "Foo"

现在我有一个“路线”数组(或任何容易处理的东西):

["children",12,"children",32,"Name"]

又想得到对象的值。

就像我在 Stackover 上看到的 here 一样,有一种非常简单的方法可以做到这一点(解决方案 2)。

但是,现在我想更改传递的键/路由的值。有什么办法吗?

非常感谢!

编辑: 如果对我有帮助,我可以使用 jQuery/Angluar-Features。

【问题讨论】:

  • 假设你写了一个像getPath(obj, pathArray)这样的getter,你可以写一个settersetValueAtPath(obj, pathArray, valToStore),它的作用与getPath完全相同,只是它的循环在倒数第二个对象处停止(例如, i < pathArray.length - 1) 和 secondToLastItem[finalKey] = valToStore.
  • 感谢您的回复,@apsillers。我很难理解二传手如何工作。如果我执行 secondToLastObj[finalKey] = valToStore - 该值存储在变量“secondToLastObj”中,而不是对象本身中,对吗?但我想在包含所有数据的“大”对象中更改它。
  • @Tream 它也将在大对象中进行更改。变量secondToLastObj只指向大对象中的部分,数据并没有实际存储在那里。
  • @apsillers,我会尝试一下,我相信它会起作用,因为你这么说。但为什么?我知道 PHP 的语法:foreach($x as $k=>&v){}。现在 $v 的变化也会影响 $x 。但是它是如何在没有任何额外语法的情况下在一个简单的 for() 循环中工作的呢?非常感谢您的帮助!

标签: javascript


【解决方案1】:

借用accepted answer on the post you've linked to的代码,我们可以简单地做一个getter:

function getFromPath(obj, pathArray) {
  var res = obj;
  for (var i=0; i<pathArray.length; i++) { res = res[pathArray[i]]; }
  return res;
}

我们称之为getFromPath($obj, ["children",12,"children",32,"Name"]);。

由于您希望将此 getter 函数转换为 setter,因此您希望在倒数第二个对象上设置一个属性。我们可以通过提前停止循环一次迭代然后在对象上使用最终属性名称执行设置来做到这一点:

function setToPath(obj, pathArray, valueToSet) {
  var res = obj;

  // note the `length - 1` here: we don't go to the end of the path 
  for (var i=0; i<pathArray.length - 1; i++) { res = res[pathArray[i]]; }

  // res is now the second-to-last object in the path,
  // and we'll set the final value as a property on the object

  var finalKey = pathArray[pathArray.length-1];
  res[finalKey] = valueToSet;
}

我们将其称为setToPath($obj, ["children",12,"children",32,"Name"], "Dana");。

或者,如果您只想使用 getter 来执行此操作,您可以将路径缩短一个项目,然后对 getter 的结果执行集合:

var secondToLast = getFromPath($obj, ["children",12,"children",32]);
secondToLast["Name"] = "Dana";

【讨论】:

  • 所以它可以 100% 完美运行。非常感谢!对于想要复制和粘贴此内容的每个人:请注意,第 5 行中的 path[i] 应该是 pathArray[i]。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-12-30
  • 2012-02-03
  • 2020-09-12
  • 1970-01-01
  • 2018-07-14
  • 1970-01-01
相关资源
最近更新 更多