JavaScriptにおける関数式のニュアンス

関数式(Function Expression)という名前は偶然ではありません。それは実際に、そのような関数が何らかの式の一部であることを意味しています。

例えば、何らかの文字列と無名関数を足し合わせることができます:

javascriptlet str = 'str' + function() {return 3;};
console.log(str); // 'strfunction() {return 3;}' と出力される

なぜ数値 3 ではなく、このような奇妙な結果が見えるのでしょうか?なぜなら、2番目の項は関数の実行結果ではなく、そのソースコードだからです(私たちはこの関数を呼び出さず、単に記述しただけです)。

つまり、関数式という名前は、そのような関数が何らかの式に参加していることを表しています。

変数への代入も式です:

javascriptlet func = function() {
  console.log('!');
};

また、例えば関数を console.log のパラメータとして渡すこともでき、それはコンソールにそのソースコードを出力します - これも式とみなされます:

javascriptconsole.log(function() {return 3;});

なぜこれが重要か:それは、関数宣言(Function Declaration)と関数式(Function Expression)の違いが、前者が名前付きで作成され、後者が最初から名前を持たないということではないからです。それは違います。

例です。これは名前のない関数ですが、同時にどの式にも参加していません(つまり、簡単に言えば、何の操作も行われていません):

javascript/*
  この関数は関数宣言(Function Declaration)になりますが、
  構文エラーが発生します:
*/
function() {
  console.log('!');
}

このようなコードはエラーを発生させます!なぜか:関数がどの式にも参加していないため、ブラウザはそれを関数宣言(Function Declaration)と見なしますが、その名前が見つからないため、エラーを発生させます。

エラーをなくすためには、関数を何らかの式の一部にする必要があります。例えば、その前に + 演算子を書きます:

javascript+function() { // このコードは正しいです
  console.log('!');
};

どのように機能するか: + 演算自体は何もしません。これは、数値 3 の代わりに +3 と書くのと同じで - 許容されますが、何も変わりません。

しかし、関数の場合 - 変わります。今や私たちの関数は単に記述されただけではなく、式に参加しています。そのため、エラーは発生しません。関数の実行結果もありません。なぜなら、私たちはそれを記述しただけで、呼び出していないからです。

+ の代わりに、何でも書くことができます。例えば:

javascript-function() { // このコードは正しいです
  console.log('!');
};

!function() { // このコードは正しいです
  console.log('!');
};

また、関数を括弧で囲むこともできます。この場合も関数式になります:

javascript(function() { // このコードは正しいです
  console.log('!');
});
Задание 1

提示された関数が関数宣言(Function Declaration)か関数式(Function Expression)かを判断してください:

javascriptfunction func() {
  console.log('!');
}
Задание 2

提示された関数が関数宣言(Function Declaration)か関数式(Function Expression)かを判断してください:

javascriptlet func = function() {
  console.log('!');
}
Задание 3

提示された関数が関数宣言(Function Declaration)か関数式(Function Expression)かを判断してください:

javascript+function() {
  console.log('!');
}
Задание 4

提示された関数が関数宣言(Function Declaration)か関数式(Function Expression)かを判断してください:

javascript!function func() {
  console.log('!');
}
Задание 5

提示された関数が関数宣言(Function Declaration)か関数式(Function Expression)かを判断してください:

javascript-function func() {
  console.log('!');
}
Задание 6

提示された関数が関数宣言(Function Declaration)か関数式(Function Expression)かを判断してください:

javascript1 + function func() {
  console.log('!');
}
Задание 7

提示された関数が関数宣言(Function Declaration)か関数式(Function Expression)かを判断してください:

javascript(function func() {
  console.log('!');
})
Задание 8

提示された関数が関数宣言(Function Declaration)か関数式(Function Expression)かを判断してください:

javascriptconsole.log(
  function() {
    console.log('!');
  }
);