<< Write maintainable javascript>> to avoid using global variables

I. Reasons to avoid global variables

Avoid creating global variables in JS first, avoid naming conflicts, and avoid creating global variables to make your code brittle, and creating global variables makes your code difficult to test.

Ii. several ways to avoid creating global variables

Avoid global variables to avoid naming conflicts//1. The namespace of a single global variable var yourglobal = {namespace:function (ns) {var parts = ns.split ("."), Object = This,i, len;for (I=0,len=parts.length;i < Len; i++) {if (!object[parts[i]]) {Object[parts[i]] = {};} Object = Object[parts[i]];} return object;}}; Yourglobal.namespace ("Books.maintainablejavascript"); YourGlobal.Books.MaintainableJavaScript.author = "Youyi"; Yourglobal.namespace ("Books.highperformancejavascript");// Keep the above YourGlobal.Books.MaintainableJavaScript intact YourGlobal.Books.HighPerformanceJavaScript.name = "Wangbaoqiang"; Console.log (YourGlobal.Books.MaintainableJavaScript.author);//youyiconsole.log ( YourGlobal.Books.HighPerformanceJavaScript.name);//Wangbaoqiang//Add the property yourglobal.namespace ("Books") to it immediately after the method call. Anewbook = {};//2. The module//yui module of a single global variable is a combination of module and namespace Concepts Yui.add ("My-module", function (Y) {//Add command space Y.namespace (" Person.maintainablejavascript "); Y.person.maintainablejavascript.author = "Xiaoma";}, "1.0.0", {requires:["Dependency1", "Dependency2"]});//yui (). Use () Pass in Module Yui () using the module name that you want to load. "My-module", "anotheR-module ", function (Y) {console.log (y.person.maintainablejavascript.author);}); /Async Module Amddefine ("My-module2", ["Dependency1", "Dependency2"],function (dependency1,dependency2) {var Books = {}; Books.maintainablejavascript = {Author: "Zhang Xinyi"};return Books;}); The/AMD module can be anonymous, the module loader can use the JavaScript file name as the module name, so if there is a file called My-module2.js, the module can only be loaded via the module loader define (["Dependency1", " Dependency2 "],function (dependency1,dependency2) {var Books = {}; Books.maintainablejavascript = {Author: "Zhang Xinyi"};return Books;}); /module Loader//1. Using the AMD module requires a compatible module loader (dojo), which can be loaded with dojo to the following//dojo also encapsulates the AMD module var books = Dojo.require ("My-module2"); Console.log (books. Maintainablejavascript.author);//2.requirejs Specifies the dependency and callback functions//jquery and dojo can use Requirejs to load the AMD module require (["My-module2"] , function (books) {Console.log (books. Maintainablejavascript.author);}); /0 Global variables//special cases will be used only if the script is short and does not require interaction with other code (function (Win) {//"use strict" strict mode, avoid creating global variable var doc = win.document;//Other variables// Other relevant code});

　　

<< Write maintainable javascript>> to avoid using global variables