Reputation: 13
I have an array with multiple objects inside like below.
[{ DishId: 40, DishName: "Mango", TimeSpan: 98},
{ DishId: 41, DishName: "Banana", TimeSpan: 99},
{ DishId: 42, DishName: "Orange", TimeSpan: 100}]
And i wanted to extract DishId and DishName from it and create another array of objects like below : Expected Output:
[{ DishId: 40, DishName: "Mango"},
{ DishId: 41, DishName: "Banana"},
{ DishId: 42, DishName: "Orange"}]
I am doing below
allDishes =
[{ DishId: 40, DishName: "Mango", TimeSpan: 98},
{ DishId: 41, DishName: "Banana", TimeSpan: 99},
{ DishId: 42, DishName: "Orange", TimeSpan: 100}];
var dishes = {};
var dishesArray = [];
for(i = 0; i < allDishes.length; i++){
dishes.DishId= allDishes[i].DishId;
dishes.DishName = allDishes[i].DishName;
dishesArray.push(dishes);
}
It is giving same repeated objects where as i am wanting all different object as i shown in example above
[ { DishId: 42, DishName: 'Orange' },
{ DishId: 42, DishName: 'Orange' },
{ DishId: 42, DishName: 'Orange' }]
Upvotes: 1
Views: 686
Reputation: 2933
You are reusing your dishes
object, so in the following iterations you overwrite the changes that you made in the previous ones. All you need to do is to declare a new object every time in the loop, change its properties and then push it to the array.
If you want to understand why you cannot reuse the same object, research "objects are passed as a reference in JavaScript" and you will find plenty of information.
const allDishes = [{ // changed
DishId: 40,
DishName: "Mango",
TimeSpan: 98
},
{
DishId: 41,
DishName: "Banana",
TimeSpan: 99
},
{
DishId: 42,
DishName: "Orange",
TimeSpan: 100
}
];
const dishesArray = []; // changed
for (let i = 0; i < allDishes.length; i++) { // changed
const dish = {} // NEW
dish.DishId = allDishes[i].DishId;
dish.DishName = allDishes[i].DishName;
dishesArray.push(dish);
}
console.log(dishesArray);
Also, there is another way on how to do what you wanted to do. It's called map and it returns a new array, based on an old array. Also, you can use an object literal with it (instead of declaring properties, you can create an object with properties already included), like here:
const allDishes = [{
DishId: 40,
DishName: "Mango",
TimeSpan: 98
},
{
DishId: 41,
DishName: "Banana",
TimeSpan: 99
},
{
DishId: 42,
DishName: "Orange",
TimeSpan: 100
}
];
const dishesArray = allDishes.map((dish) => ({
DishId: dish.DishId,
DishName: dish.DishName
}));
console.log(dishesArray);
Other observations: always use const
or let
to declare your variables. Those are represented as changed
comments in your code
Upvotes: 4
Reputation: 84
You can use map property of array directly as
let dishesArray = allDishes.map(dish => dish = {DishId : dish.DishId, DishName: dish.DishName })
Upvotes: 1
Reputation: 11613
When you create dishes
outside of the loop, you're pushing the same reference repeatedly onto your array. In my example below, I re-initialize dishes
in every loop to generate a new reference.
My code is identical to your code except for where I initialize dishes
.
allDishes =
[{ DishId: 40, DishName: "Mango", TimeSpan: 98},
{ DishId: 41, DishName: "Banana", TimeSpan: 99},
{ DishId: 42, DishName: "Orange", TimeSpan: 100}];
var dishesArray = [];
for(i = 0; i < allDishes.length; i++){
let dishes = {}; // re-initialize this to a new reference
dishes.DishId= allDishes[i].DishId;
dishes.DishName = allDishes[i].DishName;
dishesArray.push(dishes);
}
console.log(dishesArray);
Upvotes: 0