json stringify()替换函数和命名空间

k2fxgqgv  于 2022-11-19  发布在  其他
关注(0)|答案(1)|浏览(134)

我试图突出显示Javascript中JSON的某个部分,使用JS JSON在下面的const namespace中找到。strigify()的第二个参数是replacer。因此,当key等于名称空间时,它会增加名称空间中的索引。最后,我用key 0和Z将值括起来。

const dataTree = {
    "styles": {
        "elements": {
            "heading": {
                "typography": {
                    "fontFamily": "Volkorn",
                    "fontSize": "16px"
                },
            },
        },
        "typography": {
            "fontFamily": "Vollkorn",
            "fontSize": "16px",
            "lineHeight": "1.7"
        }
    }
}

const namespace = "styles.typography.fontSize".split('.')
let i = 0

const replacer = (k, v) => {
    if(namespace[i] === k){
        i++
        if(i === namespace.length-1){
            if(Object.keys(v).includes(namespace.at(-1))){
                v[0] = 'before' 
                v["Z"] = 'after' 
                return v
            }
        }
    }
    if(v["Z"]) {
        delete v["Z"]
        delete v[0]
    } 
    return v
}
const strV = JSON.stringify(dataTree, replacer, 2)

问题在于路径不正确。在上面的示例中,路径是styles.elements.heading.typography.fontSize而不是styles.typography.fontSize
你知道吗?

dldeef67

dldeef671#

如果使用替换器,则在替换器返回的已修改对象上递归调用替换器。
如果替换器正在向树中插入新属性,则很难跟踪替换器的当前调用正在处理的树中的位置。
您可以使用对象来执行此操作:

const dataTree = {"styles":{"elements":{"heading":{"typography":{"fontFamily":"Volkorn","fontSize":"16px"}}},"typography":{"fontFamily":"Vollkorn","fontSize":"16px","lineHeight":"1.7"}}};

const namespace = 'styles.typography.fontSize'.split('.');

const replaceAtLocation = (tree, [p,...rest], replacer) => rest.length ?
  Object.fromEntries(Object.entries(tree).map(([k,v])=>k===p ?
    [k,replaceAtLocation(v, rest, replacer)] : [k,v])) : replacer(tree);

const result = replaceAtLocation(dataTree,namespace,tree=>Object.fromEntries(
  Object.entries(tree).flatMap(([k,v])=>k===[...namespace].pop()?
    [['A','before'],[k,v],['Z','after']]:[[k,v]])));

console.log(JSON.stringify(result, null, 2));

请注意,我已经将'0'替换为'A',因为'0'将始终作为对象中的第一个属性排序,而不是紧接在所需属性之前。

相关问题