出典:Cotting Anmajavascriptの基礎課程の内容をまとめた文章です.
https://www.youtube.com/watch?v=KF6t61yuPCY

🍋関数宣言

これが既定の方法です.

function sayHello(){
	console.log('Hello');
}

sayHello()

🍋関数式

変数を名前のない関数に宣言することで、関数を割り当てます.

let sayHello = function(){
	console.log('Hello');
}

sayHello()

🤔 関数宣言文と関数式の違いは何ですか?

これが呼び出しのタイミングです.

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

sayHello()

function sayHello(){
	console.log('Hello');
}

このように変えても動作します
上から下へ読む操作のInterpret言語JavaScriptでそんなことがあるはずがない.console.logを使用すると、次のようにエラーが出力されます.

では、sayHelloはどのように働いているのでしょうか.
これはJavaScript内部アルゴリズムのためです.
実行前の初期化フェーズでは、JavaScriptはコード内のすべての関数宣言を検索して作成します.これは、目視では、関数の使用可能範囲がコードの位置を超えていることを意味します.これはハウスティンと呼ばれています.

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

let sayHello = function(){
	console.log('Hello');
}

sayHello()

コードに到達する必要があるため、生成後にのみ使用できます.

🤔だからどちらがいいですか?

関数宣言はより自由に符号化できるが,どちらを用いても構わない.

🍋矢印関数

より簡潔です.

let add = function(num1, num2){
	return num1 + num2;
}

👇

let add = (num1, num2) => {
	return num1 + num2;
}

1行

のみが戻る場合は、{}カッコを=>()カッコに置き換え、戻りを省略できます.

let add = (num1, num2) => (
	num1 + num2;
)

1行

のみが返される場合は、カッコを省略できます.

let add = (num1, num2) =>num1+num2;

パラメータ

が1つしかない場合は、カッコを省略できます.

let add = name =>`Hello, ${name}`;

パラメータなしの整数であれば括弧は省略できません.

let showError = () => {
	alert('error!');
}

が文を返すのに1行しかないが、複数行のコード()がある場合は、一般的なカッコは使用できません.

let add = (num1,num2) => {
	const result = num1 + num2;
	return result;
}

宣言はもっと自由だ.
矢印関数はES 6の後に追加された機能です.ES 6以降は非常に活躍しているのでぜひ知っておきたい