関数宣言と関数式


関数はJavaScriptの非常に重要な部分です.第一等公民と呼ばれています.その地位はどんなに尊貴で大切なものかが分かります.私の一貫したやり方によって、原理的なものに深く入り込みます.この文章は主に関数宣言と関数表現に関する知識を掘り起こします.
JavaScriptで一つの関数を定義するには四つの方法があります.
  • 関数宣言
  • 関数式
  • ES 6の矢印関数
  • new Function()
  • 関数宣言
    構文
    function    (  ){
              
    }
    呼び出し
  • 関数名(パラメータ)
  • 関数名.call(関数名、パラメータ)
  • 関数名.appy(関数名,[パラメータ])
  • new関数名(パラメータ)
  • タイマー
  • 関数宣言を関数式にして
  • を呼び出します.
  • ES 6のテンプレート文字列
  • function fn(text){
        console.log(text);
    }
    
    fn('    ');
    
    fn.call(fn,' call  ');
    
    fn.apply(fn,[' apply  ']);
    
    new fn(' new  ');
    
    setTimeout(fn('      '));
    
    (function fn(text){
        console.log(text);
    })('          ');
    
    fn`        `;   //ES6   
    
    関数式
    構文
    var/let/const   =function(  ){
              
    }
    呼び出し
  • 関数名(パラメータ)
  • 関数名.call(関数名、パラメータ)
  • 関数名.appy(関数名,[パラメータ])
  • new関数名(パラメータ)
  • 直接後ろに小さな括弧のペアを追加します.
  • タイマー
  • ES 6のテンプレート文字列
  • は、賦課された形で出現する(具体的な形式で呼び出される)
  • .
    const fn=function(text){
        console.log(text);
    };
    
    fn('    ');
    
    fn.call(fn,' call  ');
    
    fn.apply(fn,[' apply  ']);
    
    new fn(' new  ');
    
    const fn2=function(text){
        console.log(text);
    }('           ');
    
    setTimeout(fn('      '));
    
    fn`        `;
    
    document.onclick=function(){
        console.log('                  ');
    };
    関数宣言と関数式の違い
  • 関数宣言には識別子(関数名)が必要です.関数式は省略できます.
  • 式の名前は関数の外では使えません.関数の内部でしか
  • を使用できません.
  • 関数は、functionキーに続く関数名を指すname属性を持っています.関数式に名前がない場合、name属性は変数名
  • を指します.
  • 関数宣言は事前解析されます.関数表現は
  • ではありません.
    //1、  
    //         
    function fn(){};
    //function(){};        //  ,    
    
    //           
    let fn1=function(){};
    (function(){});
    !function(){};
    
    //        
    let fn2=function newFn(){
        console.log(newFn);    //       。             
    };
    fn2();
    //newFn();    //  ,      
    
    
    //name  
    console.log(
        fn.name,    //fn
        fn1.name,    //fn1           ,name          
        fn2.name    //newFn
    );        
    
    
    //2、   
    fn3();
    function fn3(){
        console.log('fn3');
    }
    
    //fn4();    //  ,      
    let fn4=function(){
        console.log('fn4');
    }
    自己実行関数
    自己実行関数は、すぐに呼び出す関数式(IIIIFE)ともいう.その役割は私たちが積極的に関数を呼び出す必要がないため、自分で呼び出します.モジュール化、処理コンポーネントにとって非常に有用です.まず一つの問題を見てください.関数を呼び出す一番簡単な方法はペアの括弧を入れることです.関数宣言の末尾に括弧を入れた後、この関数を呼び出すことができますか?
    function fn(){
        console.log(1);
    }();    //  
    
    const fn1=function(){
        console.log('     ');
    }();    //    
    関数宣言が直接に呼び出されない理由
  • 小かっこには式しか入れられません.文を入れてはいけません.
  • functionキーワードは、語句としてもよいし、表現としてもよい.しかし、jsはfunctionキーワードが行頭に表示されると規定しており、一律に文
  • と解釈している.
    解決方法:Functionを行頭に出さないでください.
  • は、フュージョン本体を括弧でかこみ、式に変換する.後ろに括弧を入れて
  • を運転します.
  • は演算子(new+-!type of、&𞓜|...)によって式を実行しますので、実行して結果を出すことができます.
    //          
    (
        if(true){
            console.log(1);
        }
    )//  ,        
    
    (1);
    (1+2);
    ([1]);
    ({});
    
    function fn(){
        console.log('      ');
    }(1);    //    ,        
    
    
    //                 ,           ,                ,          
    (function fn(){
        console.log('      ');
    })();
    //         
    (function fn(){
        console.log('      ');
    }());
    関数宣言を式に変換するだけで、括弧を入れて宣言できます.関数の実行には多くの奇妙な方法があります.
    0+function(text){
        console.log(text);
    }('          ');
    
    true&&function(text){
        console.log(text);
    }('            ');
    
    false||function(text){
        console.log(text);
    }('            ');
    
    0,function(text){
        console.log(text);
    }('            ');
    
    //         
    ~function(text){
        console.log(text);
    }('    +-!~     ');
    
    new function(text){
        console.log(text);
    }('  new        ');
    
    typeof function(text){
        console.log(text);
    }('  typeof        ');