【JavaScript】配列の各要素に関数を適用させて新しい配列を作成するmapメソッドの使い方について解説します。

配列.map(配列の値=> 処理内容)

const numbers = [1, 2, 3, 4, 5];
const doubled = numbers.map(element => element * 2);
console.log(doubled); // 出力: [2, 4, 6, 8, 10]

const users = [
  { id: 1, name: 'John' },
  { id: 2, name: 'Jane' },
  { id: 3, name: 'Jake' }
];
const userNames = users.map(user => user.name);
console.log(userNames); // 出力: ['John', 'Jane', 'Jake']

const nestedArray = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];
const flattened = nestedArray.map(subArray => subArray.join(', '));
console.log(flattened); // 出力: ['1, 2, 3', '4, 5, 6', '7, 8, 9']

const products = [
  { id: 1, name: 'Laptop', price: 1000 },
  { id: 2, name: 'Phone', price: 500 },
  { id: 3, name: 'Tablet', price: 750 }
];
const discountedProducts = products.map(product => ({
  ...product,
  price: product.price * 0.9
}));
console.log(discountedProducts);
// 出力:
// [
//   { id: 1, name: 'Laptop', price: 900 },
//   { id: 2, name: 'Phone', price: 450 },
//   { id: 3, name: 'Tablet', price: 675 }
// ]

const discountedProducts = products.map(product => ({
  id: product.id,
  name: product.name,
  price: product.price * 0.9
}));