简单实用的树形结构拼接方法
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="initial-scale=1.0, user-scalable=no" /><style type="text/css">body,html,#allmap {width: 100%;height: 100%;overflow: hidden;margin: 0;font-family: "微软雅黑";}</style><script type="text/javascript" src="http://api./api?v=2.0&ak=egAs3pKxpHT6hAV8zu3KEqUsRQGNcy3m"></script><title>js拼接树形结构数组</title></head><body><script type="text/javascript">var dataArray = [{id: 1,parentId: 0,name: "动物",rank: 1},{id: 2,parentId: 0,name: "植物",rank: 1},{id: 3,parentId: 0,name: "微生物",rank: 1},{id: 4,parentId: 1,name: "哺乳动物",rank: 1},{id: 5,parentId: 1,name: "卵生动物",rank: 1},{id: 6,parentId: 2,name: "种子植物",rank: 1},{id: 7,parentId: 2,name: "蕨类植物",rank: 1},{id: 8,parentId: 4,name: "大象",rank: 1},{id: 9,parentId: 4,name: "海豚",rank: 1},{id: 10,parentId: 4,name: "猩猩",rank: 1},{id: 11,parentId: 5,name: "蟒蛇",rank: 1},{id: 12,parentId: 5,name: "麻雀",rank: 1},];var copyVal = deepCopy(dataArray);var treeArray = assembleTree({data: copyVal,parent: "parentId",id: "id",child: "children"});// 深度拷贝function deepCopy(data) {return JSON.parse(JSON.stringify(data));};function assembleTree(params) {var options = {data: params.data,parent: params.parent,id: params.id,child: params.child};let tree = options.data.filter(function (parent) {let item = options.data.filter(function (child) {return parent[options.id] == child[options.parent];});if (item.length > 0) {parent[options.child] = item; }return parent[options.parent] == 0;});return tree;}console.log(treeArray);</script></body></html>
执行结果如下：
