日日操夜夜添-日日操影院-日日草夜夜操-日日干干-精品一区二区三区波多野结衣-精品一区二区三区高清免费不卡

公告:魔扣目錄網為廣大站長提供免費收錄網站服務,提交前請做好本站友鏈:【 網站目錄:http://www.ylptlb.cn 】, 免友鏈快審服務(50元/站),

點擊這里在線咨詢客服
新站提交
  • 網站:51998
  • 待審:31
  • 小程序:12
  • 文章:1030137
  • 會員:747

很多學習前端開發的小伙伴都會遇到這樣的問題:在JAVAScript中全局變量經常會引起命名沖突,甚至有時侯重寫變量不是按照想像中的順序來。避免全局變量名沖突的最好辦法還是創建命名空間,接下來千鋒廣州Web培訓老師就給大家分享在JavaScript中創建命名空間的幾種常用方法。

JavaScript的執行環境由各種各樣的全局變量構成,這些全局變量先于函數執行環境而創建、這些全局變量都掛載于“全局對象”下。當名稱有沖突時就會產生一些不可控的問題,比如命名沖突、代碼的脆弱性、難以測試等。

前端開發入門知識:JavaScript命名空間常用方法

 

?在編程開發中合理的使用命名空間可以避免相同的變量或對象名稱產生的沖突,而且命名空間也有助于組織代碼有更強的可維護性和可讀性。JavaScript中雖然沒有提供原生的命名空間支持,但我們可以使用其他的方法(對象和閉包)實現類似的效果。

1、單一全局變量

JavaScript中一個流行的命名空間模式是選擇一個全局變量作為主要的引用對象,因為每個可能的全局變量都成為唯一全局變量的屬性,也就不用再創建多個全局變量,也就避免了和其他聲明的沖突。不過單一全局變量模式已經在不少的JavaScript類庫中使用,如:YUI定義了唯一的YUI全局對象,jQuery定義了$和jQuery,$由其他類庫使用時使用jQuery等。示例如下:

var myApplication = (function() {

function() {

// ***

},

return {

// **

}

})();

2、命名空間前綴

命名空間前綴模式其思路非常清晰,就是選擇一個獨特的命名空間,然后在其后面聲明聲明變量、方法和對象。示例如下:

var = myApplication_propertyA = {};

var = myApplication_propertyA = {};

function myApplication_myMethod() {

// ***

}

從某種程度上來說,它確實減少了命名沖突的發生概率,但其并沒有減少全局變量的數目,在使用這種模式時一定要特別注意。

3、對象字面量表示法

對象字面量模式可以認為是包含一組鍵值對的對象,每一對鍵和值由冒號分隔,鍵也可以是代碼新的命名空間。示例如下:

var myApplication = {

// 可以很容易的為對象字面量定義功能

getInfo:function() {

// ***

},

// 可以進一步支撐對象命名空間

models:{},

views:{

pages:{}

},

collections:{}

};

對象字面量為我們提供了優雅的鍵/值語法,我們可以非常便捷的組織代碼封裝不同的邏輯或功能,而且可讀性、可維護性、可擴展性極強。

4、嵌套命名空間

嵌套命名空間模式可以說是對象字面量模式的升級版、它也是一種有效的避免沖突模式、因為即使一個命名空間存在、它也不太可能擁有同樣的嵌套子對象、示例如下:

var myApplication = myApplication || {};

// 定義嵌套子對象

myApplication.routers = myApplication.routers || {};

myApplication.routers.test = myApplication.routers.test || {};

當然、我們也可以選擇聲明新的嵌套命名空間或屬性作為索引屬性、如:

myApplication[´routers´] = myApplication[´routers´] || {};

使用嵌套命名空間模式可以使代碼易讀且有組織性,而且相對安全、不易產生沖突,其弱點是如果我們的命名空間嵌套過多會增加瀏覽器的查詢工作量。

5、立即調用的函數表達式

立即調用函數(IIFE)實際上就是匿名函數,被定義后立即被調用。IIFE是用于封裝應用程序邏輯的常用方法,以保護它免受全局名稱空間的影響。示例如下:

// 命名空間和undefined作為參數傳遞,確保:

// 1.命名空間可以在局部修改,不重寫函數外部上下文

// 2.undefined 的參數值是確保undefined,避免ES5規范里定義的undefined

(function (namespace, undefined) {

// 私有屬性

var foo = "foo";

bar = "bar";

// 公有方法和屬性

namespace.foobar = "foobar";

namespace.sayHello = function () {

say("Hello World!");

};

// 私有方法

function say(str) {

console.log("You said:" str);

};

})(window.namespace = window.namespace || {});

可擴展性是任何可伸縮命名空間模式的關鍵,使用IIFE可以輕松實現這一目的,我們可以再次使用IIFE給命名空間添加更多的功能。

6、命名空間注入

命名空間注入是IIFE的另一個變體,從函數包裝器內部為一個特定的命名空間“注入”方法和屬性,使用this作為命名空間代理,這種模式的優點是可以將功能行為應用到多個對象或命名空間。示例如下:

var myApplication = myApplication || {};

myApplication.utils = {};

(function () {

var value = 5;

this.getValue = function () {

return value;

}

// 定義新的子命名空間

this.tools = {};

}).apply(myApplication.utils);

(function () {

this.diagnose = function () {

return "diagnose";

}

}).apply(myApplication.utils.tools);

// 同樣的方式在普通的IIFE上擴展功能,僅僅將上下文作為參數傳遞并修改,而不是僅僅使用this,如果你經常被全局變量沖突困擾,一定要牢記JavaScript命名空間知識點。

分享到:
標簽:命名 JavaScript
用戶無頭像

網友整理

注冊時間:

網站:5 個   小程序:0 個  文章:12 篇

  • 51998

    網站

  • 12

    小程序

  • 1030137

    文章

  • 747

    會員

趕快注冊賬號,推廣您的網站吧!
最新入駐小程序

數獨大挑戰2018-06-03

數獨一種數學游戲,玩家需要根據9

答題星2018-06-03

您可以通過答題星輕松地創建試卷

全階人生考試2018-06-03

各種考試題,題庫,初中,高中,大學四六

運動步數有氧達人2018-06-03

記錄運動步數,積累氧氣值。還可偷

每日養生app2018-06-03

每日養生,天天健康

體育訓練成績評定2018-06-03

通用課目體育訓練成績評定