這種類型的jquery編碼風格叫什麼？

我一直使用jQuery的一個這種類型的jquery編碼風格叫什麼？

$(document).ready(function { 
    .... 
});

但我剛剛繼承與腳本文件打開如下所示的完整的網站：

var gc = gc || {}; 

gc.header = { 

    mobileNav: function() { 
     ... 
    }, 

    headerLink: function() { 
     ... 
    } 
}; 

gc.header.headerLink();

我從來沒有見過它的結構以這種方式 - 它實際上很容易使用，並且希望更多地瞭解如何幫助改進我的編碼風格。

如果有人能幫我提供這種類型的編碼風格是什麼？而且 - 如果你知道任何一些學習資源？

在此先感謝！

Lew。

來源

2016-06-16 Lewis Knight

模塊模式？ –

這被稱爲面向對象編程。該對象是'gc'，它具有方法（函數）並且也可以具有屬性。你可以在這裏閱讀更多關於它的信息：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript – Ike10

2完全沒有任何關係 – devqon

JavaScript語法的這種風格是一個面向多一點的對象。這使得編輯和閱讀變得更加容易，同時也可以幫助您的JavaScript保持'乾淨'，通過namespacing您的JavaScript。這意味着您基本上儘可能將盡可能多的JavaScript保留在全局對象之外 - 從而減少代碼中的衝突。

逐行：

 
var gc = gc || {}; // If a 'gc' object exists, use it. Otherwise create an empty object. 

gc.header = { // In the gc.header object create 2 methods, mobileNav and headerLink 

    mobileNav: function() { 
     ... 
    }, 

    headerLink: function() { 
     ... 
    } 
}; 

gc.header.headerLink(); // Reference the headerLink() method inside gc.header

這遠遠優選創造一個更加平坦圖案，其中mobileNav和headerLink是全局函數因爲mobileNav和headerLink是可以在其它插件可使用，並命名爲相同非常通用的功能。通過命名空間可以降低破壞代碼和碰撞的風險，因爲gc.header.headerLink()更獨特。

來源

2016-06-16 15:04:57 Andrew

很好的回答和解釋，謝謝。 +1 –

不客氣！ – Andrew

它通常被稱爲命名空間。它完全與jQuery無關。

來源

2016-06-16 15:01:08 Quentin

完美！在此之後的快速谷歌搜索，它顯示了我正在尋找什麼！謝謝 –

或者更確切地說它不是特定於jQuery – jmoerdyk

它`只是普通的JavaScript，它是一種叫做命名空間：How do I declare a namespace in JavaScript?

來源

2016-06-16 15:02:38

這種類型的jquery編碼風格叫什麼？

回答

相關問題