命名空间

咩咩得亿
162 阅读6分钟

将相关的函数和变量放在一个对象中，已创建命名空间是一种有效的方式，可以避免直接在全局作用域中定义过多的变量和函数，从而减少命名冲突的风险。这种方式有助于组织代码，还能提高代码的可维护性和复用性。

一、创建命名空间:

// 定义一个全局对象作为命名空间
var MyNamespace = MyNamespace || {};

var MyNamespace = MyNamespace || {};
这行代码是一个常见的JavaScript惯用法，用于确保 MyNamespace 变量只被定义一次，并且在多次加载或执行同一段脚本时不会覆盖原有的值。具体来说，这段代码的作用如下：

解释:

  • MyNamespace || {}：这是逻辑或操作符(||)的一个典型应用。它的工作原理是：

  1. 首先检查 MyNamespace 是否已经存在（即是否为真值）。

  2. 如果 MyNamespace 已经存在并且不是假值（如 null, undefined, 0, false, NaN, 或空字符串 ""），则使用现有的 MyNamespace 值。

  3. 如果 MyNamespace 不存在（即为 undefined），或者它的值是上述的任何一个假值，则使用一个新的空对象 {}。

  • var MyNamespace = ...：这行代码将结果赋值给变量 MyNamespace。如果 MyNamespace 已经存在于当前作用域中，则不会重新声明它；如果它不存在，则会创建一个新的全局变量或局部变量。

示例：

var MyNamespace = MyNamespace || {}; 
MyNamespace.utils = { 
    add: function(a, b) { 
        return a + b; 
    } 
};

当你第一次加载这个文件时，MyNamespace 是未定义的，因此 MyNamespace || {} 的结果是一个新的空对象 {}，所以 MyNamespace 被初始化为一个新对象，并添加了一个 utils 属性。

如果你再次加载同一个文件（可能是通过动态加载脚本或其他方式），MyNamespace 已经存在了，因此 MyNamespace || {} 的结果就是现有的 MyNamespace 对象，而不是一个新的空对象。这意味着不会覆盖已有的 MyNamespace 及其属性。

实际用途

这种模式通常用于：

  • 避免重复定义命名空间：确保你的命名空间只被初始化一次，即使脚本被多次加载。
  • 模块化开发：在没有使用现代模块系统（如ES6模块）的情况下，这种方法可以帮助你在全局作用域下组织代码，同时避免与其他库或脚本发生冲突。

总结
var MyNamespace = MyNamespace || {};
是一种安全地定义和初始化命名空间的方式，确保即便在同一环境中多次执行也不会丢失之前的数据或配置。这种方法在大型项目或多脚本协作中特别有用。

二、命名空间的用法：

1、简单命名空间：

// 定义一个全局对象作为命名空间 
var MyNamespace = MyNamespace || {}; 
// 在命名空间中添加属性和方法 
MyNamespace.utils = { 
    add: function(a, b) { 
        return a + b; 
    }, 
    subtract: function(a, b) { 
        return a - b; 
    } 
}; 
// 使用命名空间中的方法 
console.log(MyNamespace.utils.add(5, 3)); // 输出: 8 console.log(MyNamespace.utils.subtract(5, 3)); // 输出: 2

在这个例子中，MyNamespace是一个全局对象，它被用来作为所有相关函数和变量的容器。这样做的好处是所有的功能都被封装在MyNamespace之下，减少了与其他代码发生名称冲突的可能性。

2、更复杂的命名空间结构：分类组织方法

var MyApp = MyApp || {}; 

MyApp.MathOperations = { 
    add: function(a, b) { 
        return a + b; 
    }, 
    subtract: function(a, b) { 
        return a - b; 
    } 
}; 

MyApp.StringOperations = { 
        concatenate: function(str1, str2) { 
            return str1 + str2; 
        }, 
        repeat: function(str, times) { 
            return new Array(times + 1).join(str); 
        } 
}; 
// 使用命名空间中的方法 
console.log(MyApp.MathOperations.add(10, 20)); // MathOperations.add 输出: 30 
console.log(MyApp.MathOperations.subtract(20, 10)); // MathOperations.subtract 输出: 10 
console.log(MyApp.StringOperations.concatenate('Hello, ', 'World!')); // StringOperations.concatenate 输出: Hello, World! 
console.log(MyApp.StringOperations.repeat('-', 10)); // StringOperations.repeat 输出: ----------

这里，我们进一步细分了命名空间，将数学运算和字符串操作分别放在不同的子命名空间下。这使得代码更加清晰、易于管理和扩展。
补充：
在这段代码中，MathOperations 和 StringOperations 并没有特殊的语言层面的含义或用法，它们只是你自己定义的对象名称，用于组织和分类不同的功能。 不过，通过这种方式来命名对象确实是一种良好的实践，有助于提高代码的可读性和可维护性。

3、使用立即调用函数表达式(IIFE) 保护私有成员

为了进一步增强封装性，你可以使用IIFE来创建一个闭包，从而保护内部的私有成员，仅暴露必要的公共接口：
公共方法、私有变量
这段代码展示的是如何使用立即调用函数表达式（IIFE, Immediately Invoked Function Expression）来创建一个模块，从而增强封装性。让我们逐步解析这段代码，并解释它是如何工作的以及为什么这样做可以增强封装性。

var MyModule = (function() { 
    // 私有变量和函数 
    var privateVariable = '我是私有变量'; 
    function privateFunction() { 
        console.log(privateVariable); 
    } 
    // 返回的对象定义了公开的API 
    return { 
        publicMethod: function() { 
            console.log('这是公共方法'); 
            privateFunction(); // 可以访问私有成员 
        } 
    }; 
})(); 
// 使用公共方法 
MyModule.publicMethod(); // 输出: 这是公共方法 和 我是私有变量 
// 尝试访问私有成员会导致错误 
console.log(MyModule.privateVariable); // undefined

分段来解析上述段代码：

1、立即调用函数表达式

(function() { 
    // 函数体 
})();
  • 这是一个匿名函数表达式，它在定义后立即执行。
  • 使用IIFE的好处是可以创建一个新的作用域，避免变量污染全局命名空间。

2、私有变量和函数

var privateVariable = '我是私有变量'; 
function privateFunction() { 
    console.log(privateVariable); 
}
  • privateVariable 和 privateFunction 是在这个IIFE内部定义的变量和函数。
  • 因为它们是在函数内部定义的，所以它们不能从外部直接访问，这就是所谓的“私有”成员。

3、公共API

return { 
    publicMethod: function() { 
        console.log('这是公共方法'); 
        privateFunction(); // 可以访问私有成员 
    } 
};
  • IIFE返回了一个对象，这个对象包含了你希望暴露给外部使用的公共方法或属性。
  • 在这个例子中，publicMethod 是唯一一个可以从外部访问的方法。
  • publicMethod 内部可以访问 privateVariable 和 privateFunction，因为它们都在同一个闭包（closure）中。

如果要访问私有成员就必须通过 返回对象 暴露的方法和属性才能被外部调用。
例： publicMethod是返回对象

MyModule.publicMethod(); // 输出：这是公共方法 和 我是私有变量

如果直接访问私有对象只会输出undefined，因为任何未通过返回对象暴露的变量和函数都对外部不可见。
例：

console.log(MyModule.privateVariable); // 输出: undefined

运行上述全部代码之后得到：

这是公共方法 
我是私有变量 
undefined

这表明：

  • publicMethod 成功调用了 privateFunction 并打印了 privateVariable 的值。
  • 直接访问 MyModule.privateVariable 返回 undefined，证明它是私有的，无法从外部访问。

通过这种方式，你可以有效地组织代码并保护其内部状态，同时仅暴露需要公开的功能。

avatar
文章
阅读
粉丝