js对象转json文件

需求

需求：在做项目时，遇到了需要制作地址列表的功能，这一般都会用到一些开源的组件库，但是有个问题是不同组件库之间的城市列表数据结构不一样，虽然可以找到很多的城市列表的数据，但是都不一定是我们想要的，所以最好就是对已有数据结构进行转换，转换成我们需要的结构然后单独放在一个文件中(毕竟城市列表数据也比较多)。

1.首先寻找类似需求的数据

比如这种)：

list: [
    {
      letter: "A",
      data: [
        {
          name: "阿巴嘎旗",
          city_pinyin: "abagaqi",
          city_id: 152522,
          py: "abgq",
        },
        {
          name: "阿坝县",
          city_pinyin: "abaxian",
          city_id: 513231,
          py: "abx",
        },
        ......
      ],
    },
    {
      letter: "B",
      data: [
        {
          name: "八步区",
          city_pinyin: "babuqu",
          city_id: 451102,
          py: "bbq",
        },
        {
          name: "巴楚县",
          city_pinyin: "bachuxian",
          city_id: 653130,
          py: "bcx",
        },
        ......
      ],
    },
    ......
  ]
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

但是我们需要的是这种结构的数据：

{
  "A": [
    { "areaId": 152522, "areaName": "阿巴嘎旗" },
    { "areaId": 513231, "areaName": "阿坝县" },
    .....
  ],
  "B": [
    { "areaId": 451102, "areaName": "八步区" },
    { "areaId": 653130, "areaName": "巴楚县" },
    ......
  ],
  ......
}
1
2
3
4
5
6
7
8
9
10
11
12
13

2.对数据进行转换

具体需要什么样的数据格式看你的需求。

let cityTransList = {};
// list为上面所说的类似数据
list.map((item) => {
  let value = [];
  item.data.map((item) => {
    let oneCity = {};
    oneCity.areaId = item.city_id;
    oneCity.areaName = item.name;
    value.push(oneCity);
  });
  cityTransList[item.letter] = value;
});
1
2
3
4
5
6
7
8
9
10
11
12

3.将转换后的数据转为json文件

function exportJson(name, data) {
  let blob = new Blob([data]);
  let link = document.createElement("a");
  link.href = URL.createObjectURL(blob);
  link.download = name; //  下载的文件名
  link.click();
}

exportJson("cityList.json", JSON.stringify(cityTransList));
1
2
3
4
5
6
7
8
9

4.完整代码

以下代码直接引入html中。

// 准备数据
const similarData = [...]

// 转换数据
let cityTransList = {};
list.map((item) => {
  let value = [];
  item.data.map((item) => {
    let oneCity = {};
    oneCity.areaId = item.city_id;
    oneCity.areaName = item.name;
    value.push(oneCity);
  });
  cityTransList[item.letter] = value;
});

// 另存为文件
function exportJson(name, data) {
  let blob = new Blob([data]);
  let link = document.createElement("a");
  link.href = URL.createObjectURL(blob);
  link.download = name; //  下载的文件名
  link.click();
}

exportJson("cityList.json", JSON.stringify(cityTransList));
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