2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【JavaScript】【for文駆逐作戦】mapメソッドの使い方

Last updated at Posted at 2019-01-14

この記事の内容

  • JavaScriptのES6で正式採用された「map」の使い方について
  • for文は駆逐していく方針らしいです

なぜ駆逐するのか

  • 読みづらいし、ナウくないから。
  • 配列の取り出し方を制する者は、ES6を制すから

さっそく書き方

いつもの「for文」


var cars = [
   { type: '軽自動車', price: '安い'},
   { type: '高級車', price: '高い'}
];

  for (var i = 0;  i < cars.length;  i++ ) {
    var prices = cars[i].price;
    console.log(prices);
    // 安い、高い
  }

最新の「map文」

var cars = [
   { type: '軽自動車', price: '安い'},
   { type: '高級車', price: '高い'}
];

var prices = cars.map(function(car){
  return car.price;
});
//結果:["安い", "高い"]

補足

  • 配列内のオブジェクトの好きなプロパティを取り出して、新しい配列を作成することができる

まとめ

  • だんだんfor文を使わなくても値を取り出せるようになってきた。
  • for文で取り出さないで、いろんなメソッドを使って取り出すからこそ真のJavaScript使いになれるんだと思う

function pluck(array, property) {
// 与えられたarrayに対してmapをかけて
return array.map(function(element) {
// 対象のオブジェクト(element)の対象のpropertyを抜き取る
return element[property];
});
}

2
1
3

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?