将值数组映射到对象数组

Question

So I have an issue that requires me to map an array of names to an object with a property of name.

The following code is in question:

this.planNames.map((name,index) => {
     this.tempdata[index].name = name;
        }),

Here is an example of the array.

tempdata: any = [
    {
      name: 'Mix and match',
      title: 'Single-line plans for voice messaging and data.',
      desc:
        'A great plan option for businesses that want each line on its own plan. These plans have no maximum line caps.',
    },
    {
      name: 'Flexible',
      title: 'Multi-line plans for when one size does not fit all.',
      desc:
        'A great plan option for up to 10 phones with different unlimited data needs',
    }

Any idea using arrow functions would be great as I am learning more about these myself.

Answer 1

There should be some changes in your map function.

this.planNames.map((item,index) => {
   this.tempdata[index].name = item.name;
});
console.log(this.tempData)

Answer 2

The map function is only to replace data by others in array.
If you want to update other array data, you should use a for loop:

 const tempdata = [ { name: 'Mix and match', title: 'Single-line plans for voice messaging and data.', desc: 'A great plan option for businesses that want each line on its own plan. These plans have no maximum line caps.', }, { name: 'Flexible', title: 'Multi-line plans for when one size does not fit all.', desc: 'A great plan option for up to 10 phones with different unlimited data needs', } ]; const planNames = ['a', 'b']; for(let i = 0; i < planNames.length; i++) { tempdata[i].name = planNames[i]; } console.log(tempdata);

Answer 3

[].map returns a new array containing the result of each of the original array elements passed through the callback function. So, you don't need to create a temporary array beforehand - the result of the map function will contain what you need.

const newTempData = this.planNames.map((name, index) => {
   return { ...tempdata[i], name }
});

You don't generally mutate data in a .map function. If you're interested in mutating the original data structure, tempdata , you should just use a standard [].forEach .

tempdata.forEach((data, index) => {
    data.name = this.planNames[index];
});