アウトプットを頑張る

初めてのプログラミング学習期間中の記録と、日頃読んでいる本をメモのアウトプットをがんばります。

【プログラミング学習】JavaScriptの色々な関数(無名/即時/アロー)

名前の無い関数

f:id:yuma6128:20220111072108j:plain

◎無名関数

  • 関数式で記述されている function(){} が無名関数と呼ばれる部分になります。
    無名関数は、関数名なしで関数を定義でき、より簡潔なコードが記述できるメリットがあります。
// 関数宣言
function hello(){
 console.log('こんにちは')
}

// 関数式(無名関数)
const hello = function(){
 console.log('こんにちは')
}

サンプルコードの記述

const calc = function(num1,num2){
 return num1 * num2
}

const num1 = 5
const num2 = 6
console.log(calc(num1,num2))

f:id:yuma6128:20220116121553p:plain
コンソールで30と出力されていれば成功です。

定義したと同時に実行される関数

◎即時関数

  • 即時関数とは、関数を定義すると同時に実行される構文になります。
    関数を定義してから呼び出す手間を省くことができます。
// 無名関数
const countNum = function(num){
console.log(num)
}
countNum(1)

// 即時関数
(function countNum(num){
console.log(num)
})(1)
  • ()の中にfunctionからはじまる関数定義そのものを配置することで、その関数を即実行するようになります。
    その結果、関数を呼び出すという手間が省けます。

    より短い記述の関数

    ◎アロー関数

    アロー関数とは、functionの記述を省略し、その代わりに()=>という記述によって関数を定義する構文です。
    より短い記述で定義をできるメリットがあります。

const countNum = (num) =>{
console.log(num)
}
countNum(5)

5がコンソールで表示されていれば成功です。