DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> Javascript自執行匿名函數(function() { })()的原理分析
Javascript自執行匿名函數(function() { })()的原理分析
編輯:JavaScript基礎知識     

匿名函數指沒有指定函數名或指針的函數,自執行匿名函數只是其中一種,下文中稱這種函數為:自執行函數

  下面是一個最常見的自執行函數:

     // 傳統匿名函數
       (function() {
         alert('hello');
       })();

  這段代碼的執行效果就是在頁面再載入時彈出:"hello"

  是什麼促使它自動執行的?,來看下面的代碼

    // 在傳統寫法上去掉小括號,並在前面加上運算符 ~,!,+,-
      ~function(){
        alert('hello');
      }();
      !function(){
        alert('hello');
      }();
      +function(){
        alert('hello');
      }();
      -function(){
        alert('hello');
      }();

  這些寫法與上文所說的傳統方式執行起來並無區別,

  我發現,這些寫法的共同點是運算符,其實傳統方式的小括號()也屬於運算的一種,出現在:a=b*(c+d),

  運算符 + 傳遞給自生的參數 = 函數自動執行?但有些符號也不支持,比如“=,*,/”號,它自執行的原因還是很神秘,網上也找不到像樣的答案

  然後我發現了一個神奇的現象,這些運算符可以無限疊加。。。。。。

    // function前面是特定符號可以無限疊加...
      ~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~!+-~!+-+-!~~~~~~~~+-!!!!!!+function a(b) {
        alert('hello');
      }();

  程序正常運行!!!!!!

  但是,有兩種情況會報錯

    如果連續出現三個及以上的“+”或“-”符號,則會出錯;

    如果連續出現兩個“+”或“-”符號再接上其他符號,則會出錯,例如“++~”,“--+”;

  錯誤提示:Uncaught ReferenceError: Invalid left-hand side expression in prefix operation  (意思是左側表達式錯誤)

  然後我用同樣的符號來運算一個變量,發現一模一樣,這或許已經可以說明是javascript的運算促使函數的自動執行,也可以理解為通過運算來調用這個函數!

 

  並不是函數自己執行了,而是通過運算來調用這個函數!,但只支持部分運算方式!

 

  此外,這個自執行函數,未必是匿名函數!看上方的代碼,我在運算符後的函數中,定義了函數名稱a,並沒有什麼異常,但也沒什麼卵用- -!,這個a依然無法被其他方法調用,但我覺得很多人都稱其為匿名函數有點不妥!

  重要的發現已經給出了,但只代表個人觀點,如有錯誤請務必指出

  若覺得本文對你有幫助請點贊,謝謝!

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved