Board logo

標題: Javascript problem [打印本頁]
作者: ray81880    時間: 2014-7-15 22:45     標題: Javascript problem

近日要 support 一些 js program, 但小弟唔係太熟 js, 想請教大家.  

在 source code 中, 時常看到類似以下 coding:

var proj = proj || {};
(function () {
    var functA = function {
        var base = {};  // 這裡開始不明白.  getString declare 後又再 call 返
        base.getString = this.getString;
        this.getString = function () {
            var strings = base.getString.call($this);
            return strings.concat(["ab","cd","ef"]);
        };
    };
})();

1. 請問以上的程式是做甚麼?  
2. 這種模式的寫法, 有沒有特定的名稱 (如 closure, truly and falsy)

萬分感謝!
作者: KinChungE    時間: 2014-7-16 07:14

var base = {}； <-- declare base as JSON
base.getString = this.getString； <-- add this.getString to base

以上兩句, 如果一次過寫哂就係
var base = { getString: this.getString };
作者: gamezz    時間: 2014-7-16 23:44

回覆 2# KinChungE

請問

    (function () {
    var functA = function {
        //do something
        };
    };
})();

同

function functA(){
  //do something
}

有咩分別?
作者: tonyli1212    時間: 2014-7-16 23:53

  1. (function () {
  2.     var functA = function {
  3.         //do something
  4.         };
  5.     };
  6. })();
  7. alert(functA);
複製代碼
  1. function functA(){
  2.   //do something
  3. }
  4. alert(functA)
複製代碼
前者不留痕跡
回覆  KinChungE

請問

    (function () {
    var functA = function {
        //do something
       ...
gamezz 發表於 2014-7-16 23:44
作者: FlyingForever    時間: 2014-7-17 01:11

本帖最後由 FlyingForever 於 2014-7-17 15:25 編輯

你比段Source Code似乎有D問題喎……
  1. var proj = proj || {}; // 唔關事
  2. (function () {
  3.     var functA = function() {  // 原版漏括孤
  4.         var base = {};
  5.         base.getString = this.getString;
  6.         this.getString = function () {
  7.             var strings = base.getString.call(this); // 應該係就咁this而唔係原版既$this？但Google又好似真係有$this既用法……
  8.             return strings.concat(["ab","cd","ef"]);
  9.         };
  10.     };
  11. })();
複製代碼
Run完之後咩都唔會發生
因為個function係自己既function scope入面define左一個variable functA
但define完之後咩都冇做過，個function就結束左
由於functA只係係function scope入面，所以function外面根本call唔到佢
正如以下既寫法：
  1. (function() {
  2.     var i = 10;
  3. })();
複製代碼
係完全同冇做野一樣……

睇返入面段Code，functA係擴展緊this.getString
（唔好問我個this點黎，我都望唔透，請其他師兄指點……）
首先將this.getString呢個function複製一份，變成base.getString
然後this.getString改寫成「call返base.getString，之後再作修改」
咁由於base.getString係原版既this.getString，所以實際上係對this.getString進行擴展
作者: KinChungE    時間: 2014-7-17 07:10

你比段Source Code似乎有D問題喎……Run完之後咩都唔會發生
因為個function係自己既function scope入面defi ...
FlyingForever 發表於 2014-7-17 01:11


(function() {})();代表document ready後先開始做
但係留意, 括號入面declare左既野, 出面拎唔翻
作者: Charcoal99    時間: 2014-7-17 10:09

google "Self Invoked Anonymous Function" & "Immediately-Invoked Function Expression" yourself
作者: chi251155    時間: 2014-7-17 10:31

回覆 6# KinChungE


    This is not correct. What you stated is for jquery only and with a "$" at the beginning.
作者: FlyingForever    時間: 2014-7-17 19:41

回覆 6# KinChungE
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>immediate function test</title>
  6. </head>
  7. <body>
  8. <script>
  9. (function() {
  10.     alert(document.getElementById("test"));
  11. })();
  12. </script>
  13. <div id="test"></div>
  14. </body>
  15. </html>
複製代碼
結果alert既係null
如果將script放係div後面，就會出DOM Object
作者: KinChungE    時間: 2014-7-17 19:43

回覆  KinChungE 結果alert既係null
如果將script放係div後面，就會出DOM Object
FlyingForever 發表於 2014-7-17 19:41


記錯野添
即係呢個做法純綷用黎避免撞variable name?
作者: 神秘二代    時間: 2014-7-17 22:09

本帖最後由 神秘二代 於 2014-7-17 22:14 編輯
記錯野添
即係呢個做法純綷用黎避免撞variable name?
KinChungE 發表於 2014-7-17 19:43


呢個做法只係protect入面d野唔可以比出面call
類似private class咁.....
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>immediate function test</title>
  6. </head>
  7. <body>
  8. <script>
  9. (function() {
  10.         var test_variable = 1;
  11.         function test(){
  12.                     alert("123");
  13.         }
  14.         test();
  15. })();
  16. try{
  17.         test();
  18. }catch(e){alert(e);}
  19. try{
  20.         alert(test_variable);
  21. }catch(e){alert(e);}
  22. var test_variable_2 = 1;
  23. function test2(){
  24.         alert("123");
  25. }
  26. try{
  27.         test2();
  28.         alert(test_variable_2);
  29. }catch(e){alert(e);}
  30. </script>
  31. </body>
  32. </html>
複製代碼
作者: KinChungE    時間: 2014-7-17 23:04

呢個做法只係protect入面d野唔可以比出面call
類似private class咁.....
神秘二代 發表於 2014-7-17 22:09


即係scope既分別




歡迎光臨 電腦領域 HKEPC Hardware (https://www.hkepc.com/forum/) Powered by Discuz! 7.2