TIL#22関数式、関数宣言、矢印関数

11129 ワード
JavaScript テキストリンク

関数宣言 


function sayHello(){

  console.log('Hello')

}

関数式

let sayHello = function(){

  console.log('Hello')

}
関数宣言と関数式の実行方法は同じです.sayHello();

差異


関数宣言:どこでも呼び出す



JavaScriptは、関数のアップグレードにおいてもhoisting(初期化段階で関数の位置を予め決定することによって利用可能範囲を拡大する)とすることができる.
関数呼び出しの範囲はより広く、どこでも呼び出すことができます.

関数式カンスウェイ:コードに到達したときに作成



関数式は、対応するコードに到達するまでJavaScriptによって行ごとに読み込まれ、実行される必要があります.
生成されます.だから.  文の実行後に使用できます.

矢印関数

led add = fuction(num1, num2){
 return num1 + num2 ;
 }
矢印関数を使用して、次のコードに示すように、上の関数を置き換えることができます.function単語を省略し、矢印を追加します.

let add =  (num1,num2) =>{ 
  return num1 + num2;
returnゲートもあります.  1行のコードは、大カッコではなく普通のカッコで置き換えることができます.
let add = (num1,num2) => (
   num1 + num2;
  )
return  ドアが1行の場合、カッコは省略できます.
let add = (num1,num2) => num1 + num2;
引数がある場合は、  かっこは省略できます.
let sayHello = name => `Hello,${name}`;
因数がまったくないと括弧は省略できません.
let showError = () => {
  alert(`error!`);
}
そしてreturnゲートがあっても  以前に複数行のコードがある場合は、通常のカッコ()は使用できません.
let add = function(num1,num2){
  const result = num1 + num2;
  return result;
}

矢印関数の例


1.

function showError(){

 console.log("error")

};

를 화살표 함수로 변경하게 되면

let showHellow = () => {

  console.log("error");

};

2.

const  sayHello = function (name) {

   const msg = `Hello, ${name}` ;

   console.log(msg);

};

를 화살표 함수로 변경

const sayHello = (name) => {

   const msg = `Hello, ${name}` ;

   console.log(msg);

};

3.

const add = function (num1, num2)  {

  const  result  = num1  + num2;

  return  result;

}

를 화살표 함수로 변경

const add = (num1,num2) => num1 + num2 ;
関数宣言は、関数式よりも自由です.
矢印関数はES 6以降非常に活発である.
必須項目
css 3の未読メッセージの赤い点
スクロールナビゲーション