arrow functionの違い

preface
今日はツイッターでarrow functionとreglar関数の比較を見ました.
関数の中のthis指向問題は、関数の呼び出しに関連しています.
arrow関数の違いをまとめました.
1.this指向問題
矢印関数のthis値は、this値がどこで実行されても、常に外部関数のthis値に等しい.bind, apply, callは矢印関数ではなく、this値を変更することはできません.
2.this argments使用
矢印関数にはargumentsキーが定義されていません.矢印関数のargumentsはthis値と同じです.外部関数のargumentsと同じです.

function myRegularFunction() {
  const myArrowFunction = () => {
    console.log(arguments);
  }

  myArrowFunction('c', 'd');
}
myRegularFunction('a', 'b'); // logs { 0: 'a', 1: 'b' }

しかし、矢印関数のすべてのパラメータはthe rest parameters方式でアクセスできます.

function myRegularFunction() {
  const myArrowFunction = (...args) => {
    console.log(args);
  }

  myArrowFunction('c', 'd');
}

myRegularFunction('a', 'b'); // logs { 0: 'c', 1: 'd' }

3.return文
暗黙的なreturn文
矢印関数には1つの表式だけが含まれています.この表式の値を暗黙的に返します.

const increment = (num) => num + 1;

increment(41); // => 42

Objectを返したら、次のように操作できます.

const increment = (num) => ({ result: num + 1});
increment(41); // => {result: 42}

4.クラスでの使用
クラス内の矢印関数のthisは、語法的にクラスの例に結び付けられている.

class Hero {
  constructor(heroName,  herAge) {
    this.heroName = heroName;
    this.heroAge = heroAge;
  }

  logName = () => {
    console.log(this.heroName);
  }
  
	logAge() {
		console.log(this.heroAge)
	}
}
const batman = new Hero('Batman');

クラスの方法は、一般的な宣言と矢印関数の2つの方法を使用して、方法で呼び出されたときとは異なりませんが、矢印関数のthis指向はクラスのインスタンスに固定されています.
参考文献
文書