Sagufa Khanam
Sagufa Khanam

Reputation: 13

Extract object from array to create another array

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

Answers (3)

IvanD
IvanD

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

Shivani patel
Shivani patel

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

Marc
Marc

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

Related Questions