javascript - 如何搜索 JavaScript 对象并更改值

Question

尝试理解 JavaScript 并写入对象。我这里有一个对象:

  {
   "name":"",
   "children":[
      {
         "name":"Level 1",
         "children":[
            {
               "name":"Level 2",
               "children":[
                  {
                     "name":"Level 3",
                     "children":[
                        {
                           "name":"Level 4",
                           "children":[
                              {
                                 "name":"Speed",
                                 "children":null,
                                 "id":6
                              }
                           ],
                           "id":5
                        }
                     ],
                     "id":4
                  }
               ],
               "id":3
            }
         ],
         "id":2
      },
      {
         "name":"Level 1",
         "children":[
            {
               "name":"Level 2",
               "children":[
                  {
                     "name":"Level 3",
                     "children":[
                        {
                           "name":"Level 4",
                           "children":[
                              {
                                 "name":"Cost",
                                 "children":null,
                                 "id":11
                              }
                           ],
                           "id":10
                        }
                     ],
                     "id":9
                  }
               ],
               "id":8
            }
         ],
         "id":7
      },
      {
         "name":"Level 1",
         "children":[
            {
               "name":"Level 2",
               "children":[
                  {
                     "name":"Level 3",
                     "children":[
                        {
                           "name":"Level 4",
                           "children":[
                              {
                                 "name":"Manufacturability",
                                 "children":null,
                                 "id":16
                              }
                           ],
                           "id":15
                        }
                     ],
                     "id":14
                  }
               ],
               "id":13
            }
         ],
         "id":12
      }
   ],
   "id":1
}

我正在尝试了解如何搜索给定的 id 值并更改其 name 值。

在我的例子中，我知道我可以使用 d.id 和 d.name 使用下面的代码访问值(这是小部件显示的一部分； name 值填充它)

var jstring = this.model.get('value') ? this.model.get('value') : "{}";
// where 'value' = demo.json

var root = JSON.parse(jstring)
var g = this.g = svg.selectAll("g")
     .data(partition.nodes(root))
     .enter().append("g");
var path = this.path = g.append("path")
      .attr("d", arc)
      .style("fill", function(d) {
      d.active = d.active ? true : false
      return d.active || d.center ? color[1] : color[0];
                })
      .on("dblclick",dblclick);
var text =  this.text = g.append("text")
                .attr("transform", function(d) { return "rotate(" + computeTextRotation(d) + ")"; })
                .attr("x", function(d) { return y(d.y); })
                .attr("dx", "6") // margin
                .attr("dy", ".35em") // vertical-align
                .text(function(d) { return d.name; });

例如，如果我单击小部件上的某个区域，我可以通过将其值设置为 d.name 来填充输入框，它会为我提供正确的值。

function dblclick(d)
           {


                    var input = document.getElementById("name");
                    input.value = d.name;


                    $( "#dialog" ).dialog(
                    {

                    buttons: {
                        Save: function() {
                        d.name = input.value;

                   var newString = JSON.stringify(root, function(key, val) {

                      if (Array.isArray(val)){
                          return val
                      }
                      if (val != null && typeof val == "object") {
                          val = _.pick(val, 'name', 'children', 'id');
                          if(d.id == val.id){

                              input.value = d.name;
                             console.log(d.name)
                          }

                          val.children = Array.isArray(val.children) ? val.children : [];

                          return val
                      }
                      return val
                    })
                  self.model.set('value', newString)
                  self.update()
                  console.log(newString)

我发现了一个类似的问题here但我不明白如何应用答案来修改我的 JSON。

这里还有我试过的 fiddle :http://jsfiddle.net/CVvW4/237/ .我遵循了另一个问题的答案，但我的实现是错误的。

Answer 1

• 你的jsonStr已经是一个json对象，不需要再进行字符串化和解析
• 你有一个嵌套结构，要找到你需要递归函数的东西

这里是如何根据给定的 id 找到一个节点:

var root = jsonStr

function findById(node, id) {
  if (node.id == id) return node; // we found the node with the id given, return it
  var result = null; // if the id wasn´t the one we were looking, we need to look if it is in its children
  if (node.children) {
    for (var i = 0; i < node.children.length && result == null; i++) {
        result = findById(node.children[i], id)
    }
  }
  return result; // return null if it wasn´t in its children, return the node if it was
}

console.log(findById(root, 16))

现在，要更改其名称，您可以简单地执行以下操作:

findById(root, 16).name = 'asd';