es6 之前如何实现模块

2019-02-25  本文已影响0人  gis杭州

es6之前,js并没有模块。随着代码复杂度提升,开发者们为了应对难以维护的代码而考虑使用js现有的特性去实现模块化。

模块要求:

1隐藏内部实现
2提供调用接口


函数内部的变量是私有对外不可见的,借用该特点可以实现隐藏内部实现的需要。

function ff(){
  var a=123;
  var b="abcdef";
}
console.log(a)//错误,a未定义
image.png

利用函数的返回对象,通过函数闭包特性,实现对内部数据对访问,间接实现了调用接口。
通过该接口,我们可以方便的使用模块内的功能,例如ffobj.f0();

function ff(){
  var a=123;
  var b="abcdef";
  var f0 = function(){
      console.log("a is :"+a);
  }
  
  return {a:a,b:b,f0:f0}
}

var ffobj = ff();

ffobj.f0()
image.png

简化定义与调用步骤,直接改为立即执行函数即可

const ffobj1 = function(){
  var a=123;
  var b="abcdef";
  var f0 = function(){
      console.log("a is :"+a);
  }
  
  return {a:a,b:b,f0:f0}
}();
image.png
上一篇下一篇

猜你喜欢

热点阅读