将String解析为Javascript对象并向Key添加唯一ID

时间:2012-12-28 06:32:47

标签: javascript json parsing object

我有以下代码,它接受一个字符串并将其转换为一个对象。问题是该字符串包含多个重复的键,当变成一个对象时,它只识别最后一个。

这是我的工作演示http://jsfiddle.net/Qt92d/

这是我的代码:

    var str = 'View\n{\n    Name: View1;\n    Image\n    {\n        BackgroundImage: Image.gif;\n        Position: 0, 0;\n        Width: 320;\n        Height: 480;\n    }\n\n    Button\n    {\n        BackgroundImage: Button.gif;\n        Transition: View2;\n        Position: 49, 80;\n        Width: 216;\n        Height: 71;\n    }\n\n    Button\n    {\n        BackgroundImage: Button2.gif;\n        Position: 65, 217;\n        Width: 188;\n        Height: 134;\n    }\n\n    Label\n    {\n        Position: 106, 91;\n        Width: 96;\n        Height: 34;\n        Text: "Button";\n        FontSize: 32;\n        Color: 0.12549, 0.298039, 0.364706, 1;\n    }\n    Scroll\n    {\n        Position: 106, 91;\n        Width: 96;\n        Height: 34;\n        Button{\n            BackgroundImage: Button2.gif;\n            Position: 65, 217;\n            Width: 188;\n            Height: 134;\n        }\n        Button{\n            BackgroundImage: Button2.gif;\n            Position: 65, 217;\n            Width: 188;\n     \n      Height: 134;\n        }\n\n    }\n\n}';

str = str.replace(/(\w+)\s*\{/g, "$1:{"); // add in colon after each named object
str = str.replace(/\}(\s*\w)/g, "},$1"); // add comma before each new named object
str = str.replace(/;/g, ","); // swap out semicolons with commas
str = str.replace(/,(\s+\})/g, "$1"); // get rid of trailing commas
str = str.replace(/([\d\.]+(, [\d\.]+)+)/g, "[$1]"); // create number arrays
str = str.replace(/"/g, ""); // get rid of all double quotes
str = str.replace(/:\s+([^\[\d\{][^,]+)/g, ':"$1"');  // create strings

$("pre").html(str);

var obj;
eval("obj={" + str + "};");

以下是上述代码的输出。请注意,有多个“按钮”。那就是问题出现的地方。

    View:{
    Name:"View1",
    Image:{
        BackgroundImage:"Image.gif",
        Position: [0, 0],
        Width: 320,
        Height: 480
    },

    Button:{
        BackgroundImage:"Button.gif",
        Transition:"View2",
        Position: [49, 80],
        Width: 216,
        Height: 71
    },

    Button:{
        BackgroundImage:"Button2.gif",
        Position: [65, 217],
        Width: 188,
        Height: 134
    },

    Label:{
        Position: [106, 91],
        Width: 96,
        Height: 34,
        Text:"Button",
        FontSize: 32,
        Color: [0.12549, 0.298039, 0.364706, 1]
    },
    Scroll:{
        Position: [106, 91],
        Width: 96,
        Height: 34,
        Button:{
            BackgroundImage:"Button2.gif",
            Position: [65, 217],
            Width: 188,
            Height: 134
        },
        Button:{
            BackgroundImage:"Button2.gif",
            Position: [65, 217],
            Width: 188,

      Height: 134
        }

    }

}

我试图找出如何在每个键的末尾添加一个自动递增的数字,即视图,名称,按钮,图像等

1 个答案:

答案 0 :(得分:1)

您应该使用JSON库进行对象解析。这将大大简化事情。

就构建数据而言,“Button”,“Label”,“Scroll”类型对象应存储在数组中,并且键应位于字段中。我推荐打字。例如,您可以轻松地将您的数据表示为JSON:

{                                                               
    View:{
        Name:"View1",
        Objects: [
        {
            Type: "Image",
            BackgroundImage:"Image.gif",
            Position: [0, 0],
            Width: 320,
            Height: 480
        },

        {
            Type: "Button",
            BackgroundImage:"Button.gif",
            Transition:"View2",
            Position: [49, 80],
            Width: 216,
            Height: 71
        },

        {
            Type: "Button",
            BackgroundImage:"Button2.gif",
            Position: [65, 217],
            Width: 188,
            Height: 134
        },
        {
            Type: "Label",
            Position: [106, 91],
            Width: 96,
            Height: 34,
            Text:"Button",
            FontSize: 32,
            Color: [0.12549, 0.298039, 0.364706, 1]
        },
        {
            Type: "Scroll",
            Position: [106, 91],
            Width: 96,
            Height: 34,
            Objects: [
                {
                    Type: "Button",
                    BackgroundImage:"Button2.gif",
                    Position: [65, 217],
                    Width: 188,
                    Height: 134
                },
                {
                    Type: "Button",
                    BackgroundImage:"Button2.gif",
                    Position: [65, 217],
                    Width: 188,

                    Height: 134
                }
            ]
        }
    }
}

请注意,此方法支持多个按钮对象。


修改

鉴于要求,我发现这是有效的。在替换任何字符串之前,添加var i = 0;并在最终正则表达式后添加:

str = str.replace(/([^:] +):{/ g,function(m,p1){return p1 +“_”+(++ i).toString()+“:{” ;});

*这将以您的灵魂为代价为您提供所需的结果*

为您的格式编写简单的解析器/编码器并不困难。容器对象看起来像:

{type: "view", "properties":{"name":"View1"}, "objects":[{"type":"Image","properties":{...}, "objects":[...]}, ...]}

逻辑相对简单。对象由“[A-Za-z] + {”启动,并由“}(,?)”关闭。属性由“[A-Za-z]:”启动,并始终以“}”关闭。遵循这些规则,迭代字符串中的字符并将每个字符附加到缓冲区直到缓冲区与规则中的一个或另一个匹配为止应该不难。