本文共 973 字，大约阅读时间需要 3 分钟。

网页中，如果引用了许多JS，尤其是动态加载，那么其中的变量、函数名称就很容易冲突。虽然每个名称加上前缀可以解决这个问题，但未免太烦琐了。应该尽量用函数将它们包裹起来。面向对象三大特性之一是封装，对私有变量和方法进行保护，javascript没有类，只有函数。幸运的是，JS的函数是万能的，可以用来封装。

一、构造实例

例子：

var f = new function(){
     let _i = 0;  //这里的this，应该是指向f  this.hi = function(){
       alert(_i);  };  this.go = function(){
       _i = add(_i);  };    function add(i){
     	return ++i;  }};f.hi();//0f.go();f.hi();//1

这个例子里面，封装了私有变量_i和私有方法：add()，对外只暴露了hi()和go()。对于重名问题，我们只需控制 f 这个变量就行了，冲突机会大大下降。

二、静态类库

所谓静态类库，实质上就是一个JSON，元素是函数。

var f2 = (function(){
     var _i = 0;    return {
   //返回一个JSON    hi:hi,    go:go  };    function hi(){
       alert(_i);  }  function go(){
       _i = add(_i);  }  function add(i){
       return ++i;  }})();  f2.hi();f2.go();f2.hi();

也能达到相同的效果。但是，这种方式的封装性比不上第一种，体现在其变量，一定要用"var"进行声明，并且要放在函数头部，否则无法使用；私有函数则没有限制。

三、执行块

如果无须考虑复用，只避免重名，那么可以将语句用函数包裹并即时执行，这种方式同样也有良好的封装性：

(function(){
     let _i = 0;  _i = add(_i);  alert(_i);    function add(i){
       return ++i;  }})();

转载地址：https://leftfist.blog.csdn.net/article/details/103809002 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！