通過javascript的匿名函數來分析幾段簡單有趣的代碼

來源:互聯網
上載者:User

1、簡單形式的封裝調用 複製代碼 代碼如下:var userName = function() { return "jeff wong" } ();
alert(userName);

上面的代碼確實簡單,我們可以逐步分解成下面的寫法: 複製代碼 代碼如下:var anonymousFunc = function() { return "jeff wong" }; //匿名函數
var name = anonymousFunc(); //執行該函數 返回人名
alert(name);

2、new 一下Function的形式(大寫Function) 複製代碼 代碼如下:var a = new Object();
var b = new Function();
//alert(typeof (a)); //object
//alert(typeof (b)); //function
alert(a); //[object Object]
alert(b); //匿名函數
//alert(a == b); //false
//alert(a === b); //false

正如你所看到的那樣,我們new一個Object,變數a彈出的是[object Object],而new一個Function(注意,是大寫Function),b在彈出的時候,產生了匿名函數。 既然b是匿名函數,函數當然可以執行,我們可以繼續試試下面的代碼驗證自己的猜測: 複製代碼 代碼如下:alert(b()); //undefined
alert(a()); //指令碼錯誤 提示“缺少函數”

3、new 一下function也大有乾坤(小寫function)
(1)、簡單的空函數 複製代碼 代碼如下:var func = new function() { };
alert(typeof (func)); //object
alert(func); //[object Object]
//alert(func()); //指令碼錯誤 func不是函數

其實上面的代碼也就等價於下面的寫法: 複製代碼 代碼如下:function anonymousClass() { } //匿名類
var instance = new anonymousClass();
alert(typeof (instance));//object
alert(instance); //[object Object]

[code]

(2)、函數帶個傳回值的,也不是很難理解
[code]
var func = new function() { return "jeff wong" };
alert(typeof (func));
alert(func);
//alert(func()); //指令碼錯誤 缺少函數

其實上面的代碼也就等價於下面的寫法: 複製代碼 代碼如下:function anonymousClass() { return "jeff wong"; } //匿名類
var instance = new anonymousClass();
alert(typeof (instance));//object
alert(instance); //[object Object]

(3)、還是函數帶個傳回值的,寫法稍微有點不同

下面的代碼請注意和(2)中的區分一下,因為接下來要重點討論的就是那一點點的不同書寫形式: 複製代碼 代碼如下:var func = new function() { return new String("jeff wong"); };
alert(typeof (func)); //object 意料之中
alert(func); //這裡?!
//alert(func()); //指令碼錯誤 缺少函數

上面代碼的等價形式依然簡單: 複製代碼 代碼如下:function anonymousClass() { return new String("jeff wong"); }
var instance = new anonymousClass();
alert(typeof (instance));
alert(instance);

已經運行看到結果了嗎?沒錯,第三種寫法我們在彈出func或者instance的時候,都出人意料地得到了一段字串"jeff wong"。細心比較(2)和(3)中的代碼,除了return處的寫法稍有不同之外,兩處代碼幾乎完全一致,所以我們推斷,毫無疑問,是new String的形式讓我們的函數產生了意想不到的效果。 為什麼會這樣呢?

原來,在javascript中,只要在new運算式之後的constructor返回(return)一個原始類型(無return時其實是return原始類型undefined,如(1)),比如第(2)種寫法,那麼就返回new建立的匿名對象;而如果new運算式之後的constructor返回一個引用對象,比如對象(Object),函數(function)及數組(Array)等等,那麼返回的該引用對象就將覆蓋new建立的匿名對象。現在再來分析(3)中的寫法,由於new String會構造一個字串引用對象,它就覆蓋了new所建立的匿名對象,而new String的所指向引用值是“jeff wong”,所以彈出的必然是當前new String所分配的值。

  最後,留個思考題,大家看看下面的代碼返回什麼結果:

複製代碼 代碼如下:var func = new function() { var str = new String("jeff wong"); return str; };//再換種寫法
//alert(typeof (func)); //object 意料之中
alert(func); //猜一下這裡應該是什麼結果?

作者:Jeff Wong

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.