命名冲突
全局变量会绑定到 window 上,不同的javascript文件如果使用了相同的全局变量,或者定义了相同名字就的顶层函数,都会造成命名冲突,并且很难被发现。
减少冲突的一个办法,把自己的所有变量和函数全部绑定到一个全局变量中:
<script type="text/javascript">
var MYAPP = {}; // 定义全局唯一的变量MYAPP
MYAPP.name = 'haha'; // 定义自己的变量
// 定义自己的方法
MYAPP.foo = function() {
return 'Foo';
};
// 调用方法
ret = MYAPP.foo();
alert(ret);
alert(MYAPP.name);
</script>
说明:
这里我们将变量和方法封存在 全局唯一变量 MYAPP中,在调用其中的属性和方法的时候,必须加上唯一变量名。
这样即使内部属性和方法同名,只要前面的唯一变量名不同名,都能正常执行,不回存在命名冲突。
解决方法验证
当我们将属性和方法封存在全局 唯一变量 中,然后外面直接调用:
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
<script type="text/javascript"> var MYAPP = {}; // 定义全局唯一的变量MYAPP MYAPP.name = 'haha'; // 定义自己的变量 // 定义自己的方法 MYAPP.foo = function() { return 'Foo'; }; // 调用方法 ret = foo(); console.log(ret); // 报错 r = name; console.log(r); // 报错 </script>
说明:
结果报错!
定义两个全局唯一变量,然后里面属性和方法同名,通过全局唯一变量名进行调用:
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
<script type="text/javascript"> // 定义全局唯一的变量MYVAR01,并定义自己的属性和方法 var MYVAR01 = { name: 'xxx', foo: function() { return 'xxxx'; }, }; // 定义全局唯一的变量MYVAR02,并定义自己的属性和方法 var MYVAR02 = { name: 'ooo', foo: function() { return 'oooo'; } }; // 调用MYVAR01的方法 r1 = MYVAR01.name; console.log(r1); r2 = MYVAR01.foo(); console.log(r2); // 调用MYAVAR02的方法 r3 = MYVAR02.name; console.log(r3); r4 = MYVAR02.foo(); console.log(r4); </script>
结果:
xxx
xxxx
ooo
oooo
注意:
在变量中写方法和在变量外面写方法,方式是不一样的。注意区分写法。