2.17矢印関数デフォルト

関数式と比較して、単純で簡潔な構文で関数を作成する方法があります.
矢印関数(arrowfunction)を使用します.矢印関数の名前は構文の外観を借りています.

let func = (arg1, arg2, .... argN) => expression

このようにコードが記述されると、受信パラメータarg1..argNの関数funcが生成される.関数funcは、矢印(=>)の右側にある표현식(expression)を評価し、評価結果を返します.
以下の関数の略バージョンといえる.

let func = function(arg1, args2, ... argN) {
  return expression;
};

より具体的な例を見てみましょう.

let sum = (a, b) => a + b;

/* 위 화살표 함수는 아래 함수의 축약 버전이다.

let sum = function(a, b) {
	return a + b;
    }
    */

alert( sum(1, 2) ); // 3

ご覧のように、(a, b) => a + bは、係数aおよびbを受け入れる関数です.(a, b) => a + bは、瞬間式a + bの実行を評価し、結果を返す.

の買収が1つしかない場合は、買収をめぐる括弧を省略することができます.カッコを省略すると、コードの長さをさらに短縮できます.
例)

let double = n => n * 2;
// let double = function(n) {return n * 2} 과 거의 동일하다.

alert(double(3)); // 6

買収

がなければ、カッコをクリアするだけです.ただしこの場合は括弧は省略できません.

let sayHi = () => alert("안녕하세요!");

sayHi();

矢印関数は、関数式と同じ方法で使用できます.
次の例に示すように、関数を動的に作成できます.

let age = prompt("나이를 알려주세요.", 18);

let welcome = (age < 18) ?
    () => alert('안녕') : 
    () => alert('안녕하세요!');

welcome();

矢印関数に最初に触れると、可読性が低下します.知らないから.しかし、文法が上手になり始めたら、適用すればおかずの一皿になります.
関数の本文の1行の簡単な関数、矢印の関数でするのは便利です.その利点は、タイプが少なくても関数を生成できることです.

複数行矢印関数

上記の矢印関数は、=>の左側の引数を用いて=>の右側の式を計算する関数です.
ただし、評価が必要な式や複数の構文を持つ関数がある場合があります.この場合、矢印関数構文を使用して関数を作成することもできます.ただし、この場合はカッコ内に評価が必要なコードを入れるべきです.また、returnの指示字を使用して、結リンゴの値を半減することを明示しなければならない.
下図のように.

let sum = (a + b) => { // 중괄호는 본문 여러 줄로 구성되어 있음을 알려준다.
  let result = a + b;
  return result;
};

alert ( sum(1, 2) ); // 3

✔まだ終わっていません。

これまで,簡潔さという特徴をめぐって矢印関数を解析してきた.しかし、これはすべてではありません!
ここで説明する機能に加えて、矢印関数は他の興味深い機能をサポートします.
詳細については、JavaScriptのその他の内容について詳しく説明する必要があります.矢印関数を深く理解するために、必要な内容を学習し、矢印関数を再表示するときにこれらの内容を議論します.
これまで,本稿で用いた1行の矢印関数,1つの矢印関数をコールバックとして用いた場合について理解した.

サマリ

矢印関数は、本明細書で1行の関数を記述するときに役立ちます.本明細書が1行でない場合は、矢印関数を別の方法で記述する必要があります.
1.かっこなし:(...args) => expression-矢印の右側に式を配置します.関数は式を評価し、評価と結果を返します.
2.大かっこで記入:(...args) => { body }-本文が複数行で構成されている場合は、大かっこを使用します.ただし、この場合、returnインジケータを使用して戻り値を表示する必要があります.

課題

矢印関数に変更

関数式を使用して作成した次の関数を矢印関数で置き換えましょう.

function ask(question, yes, no) {
  if (confirm(question)) yes()
  else no();
}

ask(
  "동의하십니까?",
  function() { alert("동의하셨습니다."); },
  function() { alert("취소 버튼을 누르셨습니다."); }
);

に答える

function ask(question, yes, no) {
  if (confirm(question)) yes()
  else no();
}

ask(
  "동의하십니까?",
  () => alert("동의하셨습니다."),
  () => alert("취소 버튼을 누르셨습니다.")
);