関数宣言と関数式をいつ使用するか

TechJargonシリーズ

これらの両方の方法で関数を作成する方法をすでに知っている可能性があります。function doStuff() {}および() =>{}は、1日中入力する文字です。しかし、それらはどのように異なり、なぜ一方を他方の上に使用するのですか?

注:例はJavaScriptで提供されています。Y私たちのM ileage M AY Vの他の言語との進。

最初の違い:名前

名前を付けて関数を作成すると、それが関数宣言になります。関数式では名前を省略して、その関数を「匿名」にすることができます。

関数宣言:

function doStuff() {};

関数式:

const doStuff = function() {}

ES6構文で使用される無名関数は次のようによく見られます。

const doStuff = () => {}

巻き上げ

巻き上げとは、関数と変数が作成された後だけではなく、コードの「上部」で利用できることを指します。オブジェクトはコンパイル時に初期化され、ファイル内のどこからでも使用できます。

関数宣言は引き上げられますが、関数式は引き上げられません。

例で理解するのは簡単です:

doStuff();
function doStuff() {};

上記はエラーをスローしませんが、これは次のようになります。

doStuff();
const doStuff = () => {};

関数式の場合

強力な巻き上げ特性を備えた関数宣言は、有用性のために関数式を排除しようとしているように見えるかもしれません。ただし、どちらかを選択するには、関数がいつどこで必要になるかを考える必要があります。基本的に、誰がそれについて知る必要がありますか?

関数式は、グローバルスコープの汚染回避するために呼び出されます。プログラムが多くの異なる機能を認識する代わりに、それらを匿名にしておくと、それらは使用され、すぐに忘れられます。

IIFE

名前(すぐに呼び出される関数式)は、ここですべてを物語っています。関数が呼び出されると同時に作成される場合、次のようなIIFEを使用できます。

(function() => {})()

または:

(() => {})()

IIFEの詳細については、この包括的な記事をご覧ください。

コールバック

別の関数に渡される関数は、JavaScriptでは「コールバック」と呼ばれることがよくあります。次に例を示します。

function mapAction(item) { // do stuff to an item } array.map(mapAction)
array.map(mapAction)

ここでの問題は、mapActionアプリケーション全体で利用できることです。その必要はありません。そのコールバックが関数式である場合、それを使用する関数の外部では使用できません。

array.map(item => { //do stuff to an item })

または

const mapAction = function(item) { // do stuff to an item } array.map(mapAction)
array.map(mapAction)

ただし、初期化以下のmapActionコードで使用できます。

概要

つまり、グローバルスコープで関数を作成し、コード全体で使用できるようにする場合は、関数宣言を使用します。関数式を使用して、関数を使用できる場所を制限し、グローバルスコープを軽量に保ち、クリーンな構文を維持します。

参考文献

  • 関数宣言、MDNドキュメント。
  • 関数式、MDNドキュメント。
  • 巻き上げ、MDN用語集。

TechJargonシリーズ

誰もがすでに専門用語に夢中になっていると仮定すると、技術交流会や会議で投げ出されるフレーズはたくさんあります。私はしばしば専門用語に満足していません。開発者は、私が知識を欠いていることに驚いて行動するのが一般的です。

真実は、私はしばしばそれのための正しい言葉を知らないということです。人間として、特に開発者の人間として、私たちは「話をしない」人を解雇するのが大好きなので、このシリーズは、「知っておくべき」プログラミングの概念をしっかりと理解することについてです。

これはシリーズの2番目の記事です。1つ目は高階関数でした。交流会や会議に行って、仲間の技術者が何について話しているのかを知っているふりをするときは、もっと気をつけてください。しかし、家に帰ってグーグルで検索する必要があります。