jsの関数宣言と関数式の解析

不言
リリース: 2018-07-14 17:40:56
オリジナル
1668 人が閲覧しました

この記事では主にjsの関数宣言と関数式の解析を紹介します。必要な方は参考にしてください

1. JavaScriptでは関数を定義します。

関数宣言

  function say(){
     console.log('函数声明');
  }
ログイン後にコピー

関数式

   var say = function(){
      console.log('函数表达式');
   }
ログイン後にコピー
2. 分析例

通常の開発では、目に見えない違いがあります。次の例を見てみましょう。実行結果は次のとおりです:

    say();
    var say = function(){
          console.log('函数表达式');
    }
    say();
    function say(){
     console.log('函数声明');
    }
    say();
ログイン後にコピー

この結果を分析してみましょう:

1. Say 関数が初めて呼び出されたとき、関数はまだ定義されていません。 print out "function" では、"statement" の値はどうなるのでしょうか?その理由は、

JavaScriptインタプリタ内に変数宣言を昇格させる仕組みがあり、

関数宣言

が最後に書かれていてもスコープの先頭に昇格するということです。まだ前に昇進します。

関数式で作成された関数は実行時に代入され、式の代入が完了するまで呼び出すことはできません
そのため、関数がまだ定義されていない場合でも、上図のように関数宣言が前面に昇格されています。コードは次と同等です:
函数声明
函数表达式
函数表达式
ログイン後にコピー

次の 2 つの比較から、「関数宣言のプロモーション」の概念をよりよく理解できます:
1.

    var say; //变量被提升,此时的值为undefined
    say();// 函数被提升,输出“函数声明”
    var say = function(){
          console.log('函数表达式');
    }
    say();
    function say(){
     console.log('函数声明');
    }
    say();
ログイン後にコピー
2.

var say;
console.log(say);
say();
function say(){
   console.log('函数声明');
}

输出:
f say(){
   console.log('函数声明');
}
函数声明
ログイン後にコピー

2 の 2 番目の関数を呼び出すとき。現時点では、まず単純に と理解できますか?実際、実行時の関数宣言のホイスティングにより、実際の実行順序は次のようになります:

var say;
console.log(say);
say();
var say = function(){
   console.log('函数表达式');
}

输出:
undefined
Uncaught TypeError: say is not a function
    at <anonymous>:3:1
ログイン後にコピー
3. 概要

函数表达式覆盖了函数声明,因此输出了‘函数表达式’,然而到了第三次调用say函数时,此时打印的竟然还是‘函数表达式’??为什么后面的函数声明没有覆盖前面的函数表达式1. 関数宣言は JS 解析中にホイストされるため、同じスコープ内であればどこでも実行されます。関数宣言が定義されると、関数を呼び出すことができます。

2. 関数式の値は JS の実行時に決定され、関数は式の代入が完了した後にのみ呼び出すことができます

以上がこの記事の全内容です。その他の関連コンテンツについては、PHP 中国語 Web サイトを参照してください。


関連する推奨事項:

JS を介して疑似配列を配列に変換する方法

JS を使用して配列の差分メソッドを見つける方法

以上がjsの関数宣言と関数式の解析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート