javascript全局變量封裝模塊實現(xiàn)代碼
更新時間:2012年11月28日 11:19:27 作者:
javascript全局變量封裝模塊的應用,本文將詳細介紹,需要了解更多的朋友可以參考下
下面的代碼是我的測試代碼,注釋很重要:
/*global window,jQuery,validate_email,masterUI,$,rest*/
/** Enable ECMAScript "strict" operation for this function. See more:
* http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/
* http://stackoverflow.com/questions/5020479/what-advantages-does-using-functionwindow-document-undefined-windo
* Q1: Why are window and document being fed instead of just being accessed normally?
* A1: Generally to fasten the identifier resolution process, having them as local variables can help (although IMO the performance improvements may be negligible).
* A2: Passing the global object is also a widely used technique on non-browser environments, where you don't have a window identifier at the global scope, e.g.:
* (function (global) {
* //..
* })(this); // this on the global execution context is the global object itself
* A3: Passing window and document allows the script to be more efficiently minified
*
* Q2: Why the heck is undefined being passed in?
* A1: This is made because the undefined global property in ECMAScript 3, is mutable, meaning that someone could change its value affecting your code, for example:
* undefined = true; // mutable
* (function (undefined) {
* alert(typeof undefined); // "undefined", the local identifier
* })(); // <-- no value passed, undefined by default
* If you look carefully undefined is actually not being passed (there's no argument on the function call),
* that's one of the reliable ways to get the undefined value, without using the property window.undefined.
*
*/
(function(window, document, undefined) {
"use strict";
window.test = {
init: function () {
"use strict";
alert("ok");
}
};
})(window, document);// no undefined parameter here to avoid using mutable window.undefined changed by other guy
1.說明,參考了一篇文章和stackoverflow上的一個帖子
2.(function(){})() 這種代碼寫在獨立的js文件里,當js文件被html加載的時候,該函數(shù)就會執(zhí)行。實際上創(chuàng)建了windows.text對象。
以后html代碼就可用test.init的形式調用方法。
測試html部分代碼如下:
[plain] view plaincopyprint?
<head>
<title>AppEngine SDK</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../../master/script/third_party/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="../../master/plugin/jquery-validation-1.9.0/jquery.validate.js"></script>
<script type="text/javascript" src="../../master/plugin/artDialog4.1.6/jquery.artDialog.js"></script>
<script type="text/javascript" src="../../master/script/app/test.js"></script>
<script type="text/javascript">
$(document).ready(function() {
test.init();
})
</script>
</head>
3.Jslint會報兩個問題,一是關于undefined的,沒找到什么好方法,任它抱怨吧。另一格式最后調用方式要改成:
[javascript] view plaincopyprint?}(window, document)); }(window, document));
無所謂了,就任由它吧。只要功能正常就行。
復制代碼 代碼如下:
/*global window,jQuery,validate_email,masterUI,$,rest*/
/** Enable ECMAScript "strict" operation for this function. See more:
* http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/
* http://stackoverflow.com/questions/5020479/what-advantages-does-using-functionwindow-document-undefined-windo
* Q1: Why are window and document being fed instead of just being accessed normally?
* A1: Generally to fasten the identifier resolution process, having them as local variables can help (although IMO the performance improvements may be negligible).
* A2: Passing the global object is also a widely used technique on non-browser environments, where you don't have a window identifier at the global scope, e.g.:
* (function (global) {
* //..
* })(this); // this on the global execution context is the global object itself
* A3: Passing window and document allows the script to be more efficiently minified
*
* Q2: Why the heck is undefined being passed in?
* A1: This is made because the undefined global property in ECMAScript 3, is mutable, meaning that someone could change its value affecting your code, for example:
* undefined = true; // mutable
* (function (undefined) {
* alert(typeof undefined); // "undefined", the local identifier
* })(); // <-- no value passed, undefined by default
* If you look carefully undefined is actually not being passed (there's no argument on the function call),
* that's one of the reliable ways to get the undefined value, without using the property window.undefined.
*
*/
(function(window, document, undefined) {
"use strict";
window.test = {
init: function () {
"use strict";
alert("ok");
}
};
})(window, document);// no undefined parameter here to avoid using mutable window.undefined changed by other guy
1.說明,參考了一篇文章和stackoverflow上的一個帖子
2.(function(){})() 這種代碼寫在獨立的js文件里,當js文件被html加載的時候,該函數(shù)就會執(zhí)行。實際上創(chuàng)建了windows.text對象。
以后html代碼就可用test.init的形式調用方法。
測試html部分代碼如下:
復制代碼 代碼如下:
[plain] view plaincopyprint?
<head>
<title>AppEngine SDK</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../../master/script/third_party/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="../../master/plugin/jquery-validation-1.9.0/jquery.validate.js"></script>
<script type="text/javascript" src="../../master/plugin/artDialog4.1.6/jquery.artDialog.js"></script>
<script type="text/javascript" src="../../master/script/app/test.js"></script>
<script type="text/javascript">
$(document).ready(function() {
test.init();
})
</script>
</head>
3.Jslint會報兩個問題,一是關于undefined的,沒找到什么好方法,任它抱怨吧。另一格式最后調用方式要改成:
復制代碼 代碼如下:
[javascript] view plaincopyprint?}(window, document)); }(window, document));
無所謂了,就任由它吧。只要功能正常就行。
您可能感興趣的文章:
- 基于JavaScript 聲明全局變量的三種方式詳解
- javascript中局部變量和全局變量的區(qū)別詳解
- Javascript全局變量var與不var的區(qū)別深入解析
- javascript中運用閉包和自執(zhí)行函數(shù)解決大量的全局變量問題
- JavaScript中全局變量、函數(shù)內變量以及常量表達式的效率測試
- 理運用命名空間讓js不產生沖突避免全局變量的泛濫
- 淺談JavaScript的全局變量與局部變量
- JS全局變量和局部變量最新解析
- js隱式全局變量造成的bug示例代碼
- Javascript學習之談談JS的全局變量跟局部變量(推薦)
- 探討JavaScript中聲明全局變量三種方式的異同
- JavaScript防止全局變量污染的方法總結
相關文章
JavaScript基礎進階之數(shù)組方法總結(推薦)
下面小編就為大家?guī)硪黄狫avaScript基礎進階之數(shù)組方法總結(推薦)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
詳解解決小程序中webview頁面多層history返回問題
這篇文章主要介紹了詳解解決小程序中webview頁面多層history返回問題,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2019-08-08
js實現(xiàn)圖片旋轉 js滾動鼠標中間對圖片放大縮小
這篇文章主要為大家詳細介紹了js實現(xiàn)圖片旋轉,滾動鼠標中間對圖片放大縮小等效果,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-07-07

