首页 > 代码库 > JavaScript解决命名冲突的一种方法

JavaScript解决命名冲突的一种方法

过程化编码

   过程化编码, 表现为 定义若干函数,然后调用定义函数,

随着页面交互逻辑变化, 从简单到复杂, 定义的所有函数、和变量 都挂在 window对象上,

window对象 编程者子自定义变量名称 规模会愈来愈额庞大,在后面开发和维护的过程中,

很容易导致函数名称冲突,引起意想不到问题。 

  例如, 之前有个同事定义了 一个 sample 函数, N长时间后,

另一个同事又定义了一个含义不同的同名函数sample,则前以同事的代码就有问题了。

 

模块化方法一则

  JS函数内部相当于一个小的程序空间, 其中可以定义局部化的私有 变量 和 函数, 并组织函数的调用,

调用的函数或者变量如果跟全局变量重名, 也没有关系, 调用还是函数内部的,

同时不妨碍函数内部对函数外部全局变量的访问, 然后将函数执行下,就可以保证原有一块逻辑相关性代码的执行,

并与全局变量 和 其他用使用 类似方法执行的相关代码 的对应 变量 和 函数 毫不相干, 

真正实现, 各个 名称空间的纯洁性。

  这种方法, 叫做 立即执行函数:

(function(){    // your code})();

 

 

模块化JS举例

下例子,全局 和 各个模块 函数名称相同,互不影响。

<html><head>        <script type="text/javascript" src="./JQuery.js"></script>        <style>        </style></head><body>         <script type=‘text/javascript‘>/* 模块化编程测试 */// A同事,添加全局函数function test(){    console.log("A test called");}test();//B同事 添加局部函数(function(){    function test()    {        console.log("B test called");    }       test();})();// C同事(function(){    function test()    {        console.log("C test called");    }       test();})();        </script></body></html>