使用JSON數據填充jQuery樹

Question

我從過去兩天開始努力從json數據編寫高效的算法來爲jqxtree創建源對象。我收到的數據是這種形式

var data = [ 
{ 
    number: 1001, 
    title: "Toyota : Corolla : LE : 2014" 
}, { 
    number: 1002, 
    title: "Toyota : Corolla : Sports : 2015" 
}, { 
    number: 1003, 
    title: "Toyota : Corolla : LE : 2013" 
}, { 
    number: 1004, 
    title: "Toyota : Camry: LE : 2013" 
}] 

現在我需要創建一個源對象

var source = [ 
    { label: "Toyota", 
items: [ 
    { label: "Corolla", 
    items : [{ label : "LE" 
     items : [{label : 2014} 
      {label : 2013}]}, 
     { label : "Sports" 
     items : [{label : 2015}]} ]}, 
    { label: "Camry", 
    items : [{ label : "LE" 
     items : {label : 2013}}]} 
] 
} 
]; 

任何人都可以請幫我這。

感謝

Answer 1

var data = [ 
    { 
    number: 1001, 
    title: "Toyota : Corolla : LE : 2014" 
    }, 
    { 
    number: 1002, 
    title: "Toyota : Corolla : Sports : 2015" 
    }, 
    { 
    number: 1003, 
    title: "Toyota : Corolla : LE : 2013" 
    }, 
    { 
    number: 1004, 
    title: "Toyota : Camry : LE : 2013" 
    } 
]; 


//---------------------------------------------------- 
function format(data){ 

    var result = []; 

    function recurse(items, depth, target){ 

     for (var i = 0; i < target.length; i++) { 

      if(target[i].label == items[depth]){ 
       depth++; 
       recurse(items, depth, target[i].items); 
       return; 
      } 
     }; 

     var newItem = { label: items[depth] }; 
     target.push(newItem); 
     depth++; 

     if(depth < items.length){ 
      recurse(items, depth, newItem.items = []); 
     }  
    } 

    data.forEach(function(item){ 
     recurse(item.title.split(" : "), 0, result); 
    }); 

    return result; 
} 

console.log(JSON.stringify(format(data), null, 2)); 

輸出：

[ 
    { 
    "label": "Toyota", 
    "items": [ 
     { 
     "label": "Corolla", 
     "items": [ 
      { 
      "label": "LE", 
      "items": [ 
       { 
       "label": "2014" 
       }, 
       { 
       "label": "2013" 
       } 
      ] 
      }, 
      { 
      "label": "Sports", 
      "items": [ 
       { 
       "label": "2015" 
       } 
      ] 
      } 
     ] 
     }, 
     { 
     "label": "Camry", 
     "items": [ 
      { 
      "label": "LE", 
      "items": [ 
       { 
       "label": "2013" 
       } 
      ] 
      } 
     ] 
     } 
    ] 
    } 
] 

Answer 2

你可能想試試這個。下面是測試代碼的小提琴鏈接。

https://fiddle.jshell.net/8rqtxfyg/7/

下面是代碼：

var items = [{ 
    number: 1001, 
    title: "Toyota : Corolla : LE : 2014" 
}, { 
    number: 1002, 
    title: "Toyota : Corolla : Sports : 2015" 
}, { 
    number: 1003, 
    title: "Toyota : Corolla : LE : 2013" 
}, { 
    number: 1004, 
    title: "Toyota : Camry : LE : 2013" 
}]; 



console.log(JSON.stringify(parseTitle(items))); 


function parseTitle(items) { 
    var newItems = []; 

    for(var i in items) { 
     newItems = merge(newItems, mapper(items[i].title.split(":"))); 
    } 

    return newItems; 
} 


function mapper(titles) { 
    var item = {}; 

    item["label"] = titles.shift().replace(/^\s+|\s+$/g, ""); 
    if(titles.length > 0) { 
     item["items"] = []; 
     item["items"].push(mapper(titles)); 
    } 

    return item; 
} 

function merge(items, itemToMerge, parentItem) { 

    for(var i in items) { 
     if(items[i]["label"] == itemToMerge["label"]) { 
      if(items[i].hasOwnProperty("items") && itemToMerge.hasOwnProperty("items")) { 
       items[i].items = merge(items[i].items, itemToMerge.items[0], items[i]); 
      } else { 
       parentItem.items.push(itemToMerge); 
      } 

      return items; 
     } 
    } 

    items.push(itemToMerge); 

    return items; 
} 

下面是控制檯輸出：

[{ 
    "label": "Toyota ", 
    "items": [{ 
     "label": " Corolla ", 
     "items": [{ 
      "label": " LE ", 
      "items": [{ 
       "label": " 2014" 
      }, { 
       "label": " 2013" 
      }] 
     }, { 
      "label": " Sports ", 
      "items": [{ 
       "label": " 2015" 
      }] 
     }] 
    }, { 
     "label": " Camry", 
     "items": [{ 
      "label": " LE ", 
      "items": [{ 
       "label": " 2013" 
      }] 
     }] 
    }] 
}]