34
29

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のfilterメソッド、mapメソッドについて

Last updated at Posted at 2018-04-25

#filterメソッド
###条件に一致したものだけを抽出できる


var numbers = [3, 2, 4, 6, 1, 8, 6];

var result = numbers.filter(value => value < 3)

console.log(result);


//=> [2, 1]

filterメソッドは3つの引数を受け取ることができる

コールバックの引数 定義
value 配列の要素の値
index 配列要素の数値インデックス
array 要素を格納している配列オブジェクト

var numbers = [配列データ];

numbers.filter( function(value, index, array) {})

第2引数のオブジェクトについて


var stationeries = {
  'pencil': 100,
  'notebook': 80,
  'scissors': 250,
  'sticker': 150 
};

var tools = ['notebook', 'eraser', 'sticker', 'screw', 'paint'];

var result = tools.filter( function(value, index) {
  for (var stationery in this) {
    if (stationery === value) return value;
  }
}, stationeries) //第2引数にオブジェクトを指定

console.log(result);


//=> ["notebook", "sticker"]

第2引数にオブジェクトを指定すると、コールバック関数内のthisは呼び出しオブジェクトを参照する

#mapメソッド
###配列の順番通りに、各要素に対して一度ずつ呼び出して新しい配列を作る


var numbers = [1, 2, 3, 4];
var result = numbers.map(value => 2 * value)
console.log(result);


//=> [2, 4, 6, 8]

mapメソッドは3つの引数を受け取ることができる

コールバックの引数 定義
value 配列の要素の値
index 配列要素の数値インデックス
array 要素を格納している配列オブジェクト

var numbers = [配列データ];

numbers.map( function(value, index, array) {})

第2引数のオブジェクトについて


var stationeries = {
  'pencil': 100,
  'notebook': 80,
  'scissors': 250,
  'sticker': 150 
};

var tools = ['notebook', 'sticker'];

var result = tools.map( function(value, index) {
  for (var stationery in this) {
    if (stationery === value) return this[value];
  }
}, stationeries) //第2引数にオブジェクトを指定

console.log(result);


 //=> [80, 150]

第2引数にオブジェクトを指定すると、コールバック関数内のthisは呼び出しオブジェクトを参照する

34
29
0

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
34
29

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?