【JavaScript】map()メソッド、filter()メソッド、splice()メソッド、三項演算子

はじめに

　本記事は、プログラミング初学者が、学習を進めていて疑問に思った点について調べた結果を備忘録も兼ねてまとめたものです。
　そのため、記事の内容に誤りが含まれている可能性があります。ご容赦ください。
　間違いを見つけた方は、お手数ですが、ご指摘いただけますと幸いです。

map()メソッド

配列のすべての要素に対して与えた関数を実行して、その結果を配列として返します。
返り値が配列であることを望まない場合には、forEach()を使用します。
map()メソッドの記述例は以下の通りです。

sample.js

const array1 = [1, 4, 9, 16];

const map1 = array1.map(x => x * 2);

console.log(map1);
// Array [2, 8, 18, 32]

filter()メソッド

配列の要素に対し、指定した条件に合致するもののみを取り出し、新たな配列を生成するメソッドです。
条件に合致する要素がひとつもない場合には、空の配列を返します。
記述例は以下の通りです。

sample.js

const words = ['spray', 'limit', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// Array ["exuberant", "destruction", "present"]

splice()メソッド

配列から要素を削除したり、置き換えたり、追加したりすることができるメソッドです。
記述例は以下の通りです。

sample.js

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// 配列の1番目の要素から0個分削除し、'Feb'を追加する
console.log(months);
// Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
// 配列の4番目の要素から1個分削除（4番目の要素を削除）し、'May'を追加する
console.log(months);
// Array ["Jan", "Feb", "March", "April", "May"]

const month = {months.splice(1, 1);
console.log(month);
// Array ['march']　monthには削除した'march'が格納されている

三項演算子

条件分岐をさせることができます。連鎖させることも可能です。
記述例は以下の通りです。

sample.js

function getFee(isMember) {
  return (isMember ? '$2.00' : '$10.00');
  // isMenberがtrueであれば'$2.00'をfalse又はnullの場合には'$10.00'を実行
}

console.log(getFee(true));
// "$2.00"

console.log(getFee(false));
// "$10.00"

console.log(getFee(null));
// "$10.00"


// 連鎖させることも可能
function example(…) {
    return condition1 ? value1
         : condition2 ? value2
         : condition3 ? value3
         : value4;
}

まとめ

• map()メソッドは、配列のすべての要素に対して、与えた関数を実行した上でその結果を配列として返すメソッド
• filter()メソッドは、配列の要素に対し、指定した条件に合致するもののみを取り出し、新たな配列を生成するメソッド
• splice()メソッドは、配列から要素を削除したり、置き換えたり、追加したりすることができるメソッド
• 三項演算子は条件分岐