使用JavaScript格式化数组字符串

Published on:
Tags: javascript

格式化规则#

  1. [ 后面跟 [ ，换行，增加缩进
  2. , 后面跟 [ ，换行，增加缩进
  3. ] 后面跟 , ，换行，缩进
  4. ] 后面跟 ] ，换行，减少缩进

关于换行#

  1. HTML页面显示，使用 <br> 换行
  2. 输入框显示，使用 \n 换行

格式化函数#

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<html>
    <head>
        <title>json</title>
    </head>
    <body>
        <script>
            var formatArrString = function(conf) 
            {
                let html = "";
                let tmp = "";       // 临时存储字符串
                let level = 0;      // 缩进行数          
                let num = 4;        // 缩进空格数
                for(let i=0;i<conf.length;i++)
                {
                    tmp += conf.charAt(i);
                    if(conf.charAt(i) == '[' && conf.charAt(i+1) == '[')
                    {
                        html += tmp;
                        html += "<br>";
                        level += num;
                        tmp = "";
                        for(let j=0;j<level;j++)
                            html += "\xa0"
                    }

                    if(conf.charAt(i) == ',' && conf.charAt(i+1) == '[')
                    {
                        html += tmp;
                        html += "<br>";
                        level += num;
                        tmp = "";
                        for(let j=0;j<level;j++)
                            html += "\xa0"
                    }

                    if(conf.charAt(i) == ']' && conf.charAt(i+1) == ',')
                    {
                        html += tmp;
                        tmp = "";
                        level -= num;
                    } else if(conf.charAt(i) == ']' && conf.charAt(i+1) == ']')
                    {
                        html += tmp;
                        tmp = "";
                        html += "<br>";
                        level -= num;
                        for(let j=0;j<level;j++)
                            html += "\xa0"
                    }
                }
                html += tmp;
                return html;
            }

            var conf = "[[667,3,[[99999999999,10900,[[99999999999,20000000,1000],[20000000,10000000,900],[10000000,5000000,800],[5000000,1000000,700]]],[10900,10600,[[99999999999,20000000,900],[20000000,10000000,800],[10000000,5000000,700],[5000000,1000000,600]]],[10600,10300,[[99999999999,20000000,800],[20000000,10000000,700],[10000000,5000000,600],[5000000,1000000,500]]],[10300,10000,[[99999999999,20000000,700],[20000000,10000000,600],[10000000,5000000,500],[5000000,1000000,400]]],[9000,7000,[[-99999999999,-20000000,-250],[-20000000,-10000000,-200],[-10000000,-5000000,-200],[-5000000,-1000000,-200]]],[7000,0,[[-99999999999,-20000000,-300],[-20000000,-10000000,-200],[-10000000,-5000000,-200],[-5000000,-1000000,-200]]]]],[2405,3,[[99999999999,10900,[[99999999999,20000000,1000],[20000000,10000000,900],[10000000,5000000,800],[5000000,1000000,700]]],[10900,10600,[[99999999999,20000000,900],[20000000,10000000,800],[10000000,5000000,700],[5000000,1000000,600]]],[10600,10300,[[99999999999,20000000,800],[20000000,10000000,700],[10000000,5000000,600],[5000000,1000000,500]]],[10300,10000,[[99999999999,20000000,700],[20000000,10000000,600],[10000000,5000000,500],[5000000,1000000,400]]],[9000,7000,[[-99999999999,-20000000,-250],[-20000000,-10000000,-200],[-10000000,-5000000,-200],[-5000000,-1000000,-200]]],[7000,0,[[-99999999999,-20000000,-300],[-20000000,-10000000,-200],[-10000000,-5000000,-200],[-5000000,-1000000,-200]]]]]]";
            document.write(formatArrString(conf));
        </script>
    </body>
</html>

格式化效果#

  1. 使用 bejson 格式化出来的效果
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
[
    [667, 3, [
        [99999999999, 10900, [
            [99999999999, 20000000, 1000],
            [20000000, 10000000, 900],
            [10000000, 5000000, 800],
            [5000000, 1000000, 700]
        ]],
        [10900, 10600, [
            [99999999999, 20000000, 900],
            [20000000, 10000000, 800],
            [10000000, 5000000, 700],
            [5000000, 1000000, 600]
        ]],
        [10600, 10300, [
            [99999999999, 20000000, 800],
            [20000000, 10000000, 700],
            [10000000, 5000000, 600],
            [5000000, 1000000, 500]
        ]],
        [10300, 10000, [
            [99999999999, 20000000, 700],
            [20000000, 10000000, 600],
            [10000000, 5000000, 500],
            [5000000, 1000000, 400]
        ]],
        [9000, 7000, [
            [-99999999999, -20000000, -250],
            [-20000000, -10000000, -200],
            [-10000000, -5000000, -200],
            [-5000000, -1000000, -200]
        ]],
        [7000, 0, [
            [-99999999999, -20000000, -300],
            [-20000000, -10000000, -200],
            [-10000000, -5000000, -200],
            [-5000000, -1000000, -200]
        ]]
    ]],
    [2405, 3, [
        [99999999999, 10900, [
            [99999999999, 20000000, 1000],
            [20000000, 10000000, 900],
            [10000000, 5000000, 800],
            [5000000, 1000000, 700]
        ]],
        [10900, 10600, [
            [99999999999, 20000000, 900],
            [20000000, 10000000, 800],
            [10000000, 5000000, 700],
            [5000000, 1000000, 600]
        ]],
        [10600, 10300, [
            [99999999999, 20000000, 800],
            [20000000, 10000000, 700],
            [10000000, 5000000, 600],
            [5000000, 1000000, 500]
        ]],
        [10300, 10000, [
            [99999999999, 20000000, 700],
            [20000000, 10000000, 600],
            [10000000, 5000000, 500],
            [5000000, 1000000, 400]
        ]],
        [9000, 7000, [
            [-99999999999, -20000000, -250],
            [-20000000, -10000000, -200],
            [-10000000, -5000000, -200],
            [-5000000, -1000000, -200]
        ]],
        [7000, 0, [
            [-99999999999, -20000000, -300],
            [-20000000, -10000000, -200],
            [-10000000, -5000000, -200],
            [-5000000, -1000000, -200]
        ]]
    ]]
]

2.使用 formatArrString 函数格式化出来的效果

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
[
    [667,3,
        [
            [99999999999,10900,
                [
                    [99999999999,20000000,1000],
                    [20000000,10000000,900],
                    [10000000,5000000,800],
                    [5000000,1000000,700]
                ]
            ],
            [10900,10600,
                [
                    [99999999999,20000000,900],
                    [20000000,10000000,800],
                    [10000000,5000000,700],
                    [5000000,1000000,600]
                ]
            ],
            [10600,10300,
                [
                    [99999999999,20000000,800],
                    [20000000,10000000,700],
                    [10000000,5000000,600],
                    [5000000,1000000,500]
                ]
            ],
            [10300,10000,
                [
                    [99999999999,20000000,700],
                    [20000000,10000000,600],
                    [10000000,5000000,500],
                    [5000000,1000000,400]
                ]
            ],
            [9000,7000,
                [
                    [-99999999999,-20000000,-250],
                    [-20000000,-10000000,-200],
                    [-10000000,-5000000,-200],
                    [-5000000,-1000000,-200]
                ]
            ],
            [7000,0,
                [
                    [-99999999999,-20000000,-300],
                    [-20000000,-10000000,-200],
                    [-10000000,-5000000,-200],
                    [-5000000,-1000000,-200]
                ]
            ]
        ]
    ],
    [2405,3,
        [
            [99999999999,10900,
                [
                    [99999999999,20000000,1000],
                    [20000000,10000000,900],
                    [10000000,5000000,800],
                    [5000000,1000000,700]
                ]
            ],
            [10900,10600,
                [
                    [99999999999,20000000,900],
                    [20000000,10000000,800],
                    [10000000,5000000,700],
                    [5000000,1000000,600]
                ]
            ],
            [10600,10300,
                [
                    [99999999999,20000000,800],
                    [20000000,10000000,700],
                    [10000000,5000000,600],
                    [5000000,1000000,500]
                ]
            ],
            [10300,10000,
                [
                    [99999999999,20000000,700],
                    [20000000,10000000,600],
                    [10000000,5000000,500],
                    [5000000,1000000,400]
                ]
            ],
            [9000,7000,
                [
                    [-99999999999,-20000000,-250],
                    [-20000000,-10000000,-200],
                    [-10000000,-5000000,-200],
                    [-5000000,-1000000,-200]
                ]
            ],
            [7000,0,
                [
                    [-99999999999,-20000000,-300],
                    [-20000000,-10000000,-200],
                    [-10000000,-5000000,-200],
                    [-5000000,-1000000,-200]
                ]
            ]
        ]
    ]
]