在Javascript中構建JSON檔案-附加資料中的問題

我的目標是創建如下 JSON 資料集： JSON：

    {
        "category": {
            "id": "10100",
            "name": "Dessert",
            "products": [
                {
                    "id": "10101",
                    "name": "Cheese Cake",
                    "description": "New York Style",
                    "price": 1.55,
                    "price_before_discount": 1.55,
                    "imageURL": "image2.jpg"
                },
                {
                    "id": "10102",
                    "name": "Apple Pie",
                    "description": "Old Fashion Home Made Pie.",
                    "price": 1.75,
                    "price_before_discount": 1.75,
                    "imageURL": "image3.jpg"
                }
            ],
            "id": "10104",
            "name": "Breakfast",
            "products": [
                {
                    "id": "10104",
                    "name": "Ham and Eggs",
                    "description": "With Hash Browns and Toast.",
                    "price": 4.75,
                    "price_before_discount": 4.75,
                    "imageURL": "image4.jpg"
                }
            ]
        }
    }

Javascript代碼：

    var menu = {};
    var category = {}
    var products = []
    
    menu.category = category;
    
    var catID = "10100";
    var catName = "Dessert";
    
    var catItems = {
        "id": catID,
        "name": catName
    }
    Object.assign(menu.category, catItems)
    
    menu.category.products = products;
    
    var itemID = "10101";
    var itemName = "Cheese Cake";
    var itemDescription = "New York Style"
    var itemPrice = 1.55
    var itemPrice_before_discount = 1.55
    var itemImageURL = "image.jpg"
    
    var items = {
        "id": itemID,
        "name": itemName,
        "description": itemDescription,
        "price": itemPrice,
        "price_before_discount": itemPrice_before_discount,
        "imageURL": itemImageURL
    }
    
    menu.category.products.push(items);
    
    var itemID = "10102";
    var itemName = "Apple Pie";
    var itemDescription = "Old Fashion Home Made Pie."
    var itemPrice = 1.75
    var itemPrice_before_discount = 1.75
    var itemImageURL = "image.jpg"
    
    var items = {
        "id": itemID,
        "name": itemName,
        "description": itemDescription,
        "price": itemPrice,
        "price_before_discount": itemPrice_before_discount,
        "imageURL": itemImageURL
    }
    
    menu.category.products.push(items);
    
    var cat2ID = "10102";
    var cat2Name = "Breakfast";
    
    catItems = {
        "id": cat2ID,
        "name": cat2Name
    }
    Object.assign(menu.category, catItems)
    
    menu.category.products = products;
    
    var itemID = "10104";
    var itemName = "Ham and Eggs";
    var itemDescription = "With Hash Browns and Toast"
    var itemPrice = 4.75
    var itemPrice_before_discount = 4.75
    var itemImageURL = "image4.jpg"
    
    var items = {
        "id": itemID,
        "name": itemName,
        "description": itemDescription,
        "price": itemPrice,
        "price_before_discount": itemPrice_before_discount,
        "imageURL": itemImageURL
    }
    
    menu.category.products.push(items);
    
    
    console.log(JSON.stringify(menu, null, 2));

上面的代碼結果是：

    {
      "category": {
        "id": "10102",
        "name": "Breakfast",
        "products": [
          {
            "id": "10101",
            "name": "Cheese Cake",
            "description": "New York Style",
            "price": 1.55,
            "price_before_discount": 1.55,
            "imageURL": "image.jpg"
          },
          {
            "id": "10102",
            "name": "Apple Pie",
            "description": "Old Fashion Home Made Pie.",
            "price": 1.75,
            "price_before_discount": 1.75,
            "imageURL": "image.jpg"
          },
          {
            "id": "10104",
            "name": "Ham and Eggs",
            "description": "With Hash Browns and Toast",
            "price": 4.75,
            "price_before_discount": 4.75,
            "imageURL": "image4.jpg"
          }
        ]
      }
    }

我遇到的問題是添加類別節點，當前要附加的資料覆寫/更新前一個類別節點。

我的問題是如何在適當的位置添加/附加類別節點。

謝謝你。

uj5u.com熱心網友回復：

我認為您需要通過使用classes來更多地構建您的代碼。如果您設定了適當的資料結構，那么處理資料就會容易得多，無論是在閱讀/理解代碼方面還是在將來修改資料方面。

我認為代碼是不言自明的，但請詢問是否有不清楚的地方。

class Category {      
  constructor(id, name) {
    this.id = id;
    this.name = name;
    this.products = [];
  }
  
  addProduct(item) {
    if (item && item.type == 'product') {
      this.products.push(item);
    }
  }
}

class Product {  
  constructor(id, name, description, price_before_discount, imageURL, price) {
    this.id = id;
    this.name = name;
    this.description = description;
    this.price = price || price_before_discount;
    this.price_before_discount = price_before_discount;
    this.imageURL = imageURL;
  }
  
  get type() {
    return 'product';
  }
}

// ADDING DATA

let dessertCategory = new Category(10100, 'Dessert')
let cheeseCakeProduct = new Product(10101, 'Cheese Cake', 'New York Style', 1.55, 'image2.jpg')

dessertCategory.addProduct(cheeseCakeProduct);

let breakfastCategory = new Category(10104, 'Breakfast')
let hamAndEggsProduct = new Product(10104, 'Ham and Eggs', 'With Hash Browns and Toast.', 4.75, 'image4.jpg')

breakfastCategory.addProduct(hamAndEggsProduct);


let menu = {};

menu.categories = [];

menu.categories.push(dessertCategory);
menu.categories.push(breakfastCategory);

console.log( menu );
console.log( '----' );
console.log( JSON.stringify(menu) );

uj5u.com熱心網友回復：

json 就像鍵值資料結構，不能有 2 項具有相同的鍵。對于這個問題，您可以在類別中添加計數器之類的數字

 {
  "category1": {...},
  "category2": {...},
  ...
  }

標籤：javascript json

上一篇：無法讀取未定義的屬性（讀取“切片”）

下一篇：ReactJs導航，在新路由頁面中重新渲染以前的組件