首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >在Javascript中保持对象递归循环的输出中的顺序

在Javascript中保持对象递归循环的输出中的顺序
EN

Stack Overflow用户
提问于 2018-08-11 03:04:48
回答 1查看 72关注 0票数 0

我正在尝试使用JSON文件来填充网页。我递归地循环遍历对象,将key、value属性写入字符串,并使用'list‘属性来增加嵌套级别。我需要一切井井有条。

这是我写的函数:

代码语言:javascript
复制
function recurOBJ(my_obj){
    let x, str
    str = ``
    for( x in my_obj ){
        str += x + `: ` + my_obj[x].copy
        console.log(x);
        if ( my_obj[x].hasOwnProperty('list') ){
            recurOBJ(my_obj[x].list)
        }
    }
    console.log(str);
    return str
}

这是一个示例对象:

代码语言:javascript
复制
{
    "item_01": {
        "copy": ["Some text."]
    },
    "item_02": {
        "copy": ["More text."],
        "list": {
            "listItem01": {
                "copy": ["List text."],
                "list": {
                        "item_a": { "copy": ["A: Lorem ipsum dolor sit amet."]},
                        "item_b": { "copy": ["B: Lorem ipsum dolor sit amet."]},
                        "item_c": { "copy": ["C: Lorem ipsum dolor sit amet."]},
                        "item_d": { "copy": ["D: Lorem ipsum dolor sit amet."]}
                }
        }}
    }
}

问题是,当我查看console.log(x)输出时,所有内容都以正确的顺序显示,但是当字符串console.log(str)返回时,它首先显示嵌套的值,然后显示更高级别的项。item01和item02之后。

正确的=> console.log(x):

代码语言:javascript
复制
item_01
item_02
listItem01
item_a
item_b
item_c
item_d

=> console.log(字符串)不正确:

代码语言:javascript
复制
item_a: A: Lorem ipsum dolor sit amet.
item_b: B: Lorem ipsum dolor sit amet.
item_c: C: Lorem ipsum dolor sit amet.
item_d: D: Lorem ipsum dolor sit amet.
listItem01: List text.
item_01: Some text.
item_02: More text.

我不知道该如何补救这件事。我尝试将对象转换为Map以保留顺序,但也不起作用。

EN

回答 1

Stack Overflow用户

发布于 2018-08-11 03:31:36

您可以采用递归方法,返回一个字符串数组和子对象,以及list属性或一个空对象。

代码语言:javascript
复制
function getData(object) {
    return [].concat(
        ...Object
            .entries(object)
            .map(([k, v]) => [k + ': ' + v.copy[0], ...getData(v.list || {})])
    );
}

var data = { item_01: { copy: ["Some text."] }, item_02: { copy: ["More text."], list: { listItem01: { copy: ["List text."], list: { item_a: { copy: ["A: Lorem ipsum dolor sit amet."] }, item_b: { copy: ["B: Lorem ipsum dolor sit amet."] }, item_c: { copy: ["C: Lorem ipsum dolor sit amet."] }, item_d: { copy: ["D: Lorem ipsum dolor sit amet."] } } } } } };

console.log(getData(data));
代码语言:javascript
复制
.as-console-wrapper { max-height: 100% !important; top: 0; }

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51792687

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档