0

I have the following product object in typescript:

Product:

{
    productId: 1,
    productName: "ABC",
    orders: [{
        orderId: 1,
        orderDate: "2020-01-01",
        amount: 100
    },
    {
        orderId: 2,
        orderDate: "2020-01-01",
        amount: 200
    }],
    priceHistory: [{
        date: "2020-01-1",
        price: 15
    },
    {
        date: "2020-02-1",
        price: 16
    }],
    purchaseHistory: [{
        purchaseDate: "2019-01-01",
        purchaseAmt: 10,
        qty: 20
    },
    {
        purchaseDate: "2019-02-01",
        purchaseAmt: 10,
        qty: 2
    }],
    parts: [{
        partId: 1,
        partName: "Part 1",
        priceHistory: [,,,,],
        orders: [,,,],
        purchaseHistory: [,,,,]
    },
    {
        partId: 2,
        partName: "Part 2",
        priceHistory: [,,,,],
        orders: [,,,],
        purchaseHistory: [,,,,]
    }]
}

I need to pass the product object to an API without priceHistory and purchaseHistory (from product and parts).

{
    productId: 1,
    productName: "ABC",
    orders: [{
        orderId: 1,
        orderDate: "2020-01-01",
        amount: 100
    },
    {
        orderId: 2,
        orderDate: "2020-01-01",
        amount: 200
    }],
    priceHistory: [],
    purchaseHistory: [],
    parts: [{
        partId: 1,
        partName: "Part 1",
        priceHistory: [],
        orders: [,,,],
        purchaseHistory: []
    },
    {
        partId: 2,
        partName: "Part 2",
        priceHistory: [],
        orders: [,,,],
        purchaseHistory: []
    }]
}

How can I achieve this without impacting the original product object? I tried:

let newProduct = originalProduct;

newProduct.priceHistory = [];
newProduct.purchaseHistory = []

newProduct.parts.forEach((part) => {
 part.priceHistory = [];
 part.purchaseHistory = [];
});

However, it updates the original product object too. I believe we can do this using a spread (...) operator but I am not sure how can I copy all the properties

developer
  • 1,401
  • 4
  • 28
  • 73
  • 1
    If you assign an object to an variable using the `=` operator JavaScript will not copy the object, but reference the original one. For copying without referencing you may take a lookt at: [https://stackoverflow.com/questions/12690107/clone-object-without-reference-javascript](https://stackoverflow.com/questions/12690107/clone-object-without-reference-javascript) – B Polit Aug 19 '21 at 13:59
  • I made a quick fiddle for demonstration: [https://jsfiddle.net/38jcevkm/](https://jsfiddle.net/38jcevkm/) – B Polit Aug 19 '21 at 14:02
  • Try this code (Suggestions are welcome) - https://jsfiddle.net/dhiliph98/0ot1ga4w/4/ – Dhilip H Aug 19 '21 at 14:44
  • Thanks @DhilipH. It works fine. Is it better to use JSON.parse(JSON.stringify(object)) or your approach. Somehow the question has been marked as duplicate but this is a valid question. The duplicate question suggests to use Object.assign({}, object) but it does not deep clone it. – developer Aug 19 '21 at 14:51
  • 1
    @developer That depends on your requirement. JSON.parse approach just creates a deep clone of your object, but you'd have to remove the properties yourself. If you need a more generic solution that can be used anywhere, you can use mine. If you need a custom solution, you can use `JSON.parse(JSON.stringify(object))` approach. Made some changes. Use this - https://jsfiddle.net/dhiliph98/0ot1ga4w/14/ – Dhilip H Aug 19 '21 at 14:55

0 Answers0