资讯专栏INFORMATION COLUMN

浅述编写模块化的 JavaScript

mumumu / 2869人阅读

摘要:模块化,就是字面意思的模块化。比如模块化一个表单验证,模块化一个轮播图等。但是这样的编写还存在一个问题,对象中的函数或者属性对外部是可见的,并且是可修改的。

模块化,就是字面意思的模块化。比如模块化一个表单验证,模块化一个轮播图等。

在平常 JavaScript 代码的编写中,我们一般是保持着这样一个顺序。

1. 无脑式自然编写
function a() {
  alert("a")
}

function b() {
  alert("b")
}

a()
b()

这样的写法在每个人的学习初级阶段都是存在的,当代码量比较少的时候显然是没有什么问题的。但是当工程量比较大的时候,就会出现一些列的不可控,因为这里出现的变量都是全局变量,处处埋藏着炸弹。

2. 进阶式装 X 编写

在写了稍微多的代码后只要是个正常的人都会意识到这个问题,然后可能就会出现下面的写法。

var A = {}
var B = {}

A.a = function() {
  //do
}
A.b = function() {
  //do
}

B.a = function() {
  //do
}
B.b = function() {
  //do
}

在这样子的编写中,我们首先创建了不同的对象,然后在各自的对象里面声明 名字是同样的函数 a 和 b, 所以不会产生冲突。相比较第一种写法,显然在冲突这件事情上会好很多很多。

但是这样的编写还存在一个问题,对象中的函数或者属性对外部是可见的,并且是可修改的。外部不经意或者故意的修改就会让原本的功能瘫痪,显然这样是存在一定的安全隐患的。

3. 稍高层立即执行函数

这个时候可能是多多少少用过一些 jQuery 库之类的东西,可能就会这样

(function() {
  // private code

  var a = function() {
     
  }
  
  window.a = a;
})();

这样写的话可以有私立的 private 类型变量,然后将局部的函数提升到 windows 下面,可以让其他地方使用。

据说 jQuery 就是使用这种写法让 windows 有了 $ 这个方法。

当然,也可以写一个立即执行函数,然后返回一个对象,让其他模块去调用,比如这样

var A = (function(){
  //private code
  
  var a = function() {
    //do
  }
  
  return {a: a}
})()

A.a()

道理和上面的没有太大的区别

4. 现有高级通用写法

未知。。。。

requeryJs...

AMD...

原文链接:http://life.rccoder.net/webpre/1157.html

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/86173.html

相关文章

  • 浅述Promise用法(一)

    摘要:概述是异步编程的一种解决方案,很好的解决了传统异步编程中的回调地狱问题。语法中阐述,有三种状态,分别是进行中已完成已失败。方法使用要使用方法我们首先要创建实例,也就是说我们要一个对象。 1. Promise概述 promise是异步编程的一种解决方案,很好的解决了传统异步编程中的回调地狱问题。同时我们可以把promise可以理解为一个容器,这个容器里面存放着一些未来才会结束的事件(通常...

    BakerJ 评论0 收藏0
  • 浅述APM采样与端到端

    摘要:主题大纲浅述采样与端到端何为何为端到端何为采样的做法与弊端嘉宾介绍高驰涛,官方开发组成员,作者,云智慧高级架构师。 极牛技术实践分享活动 极牛技术实践分享系列活动是极牛联合顶级VC、技术专家,为企业、技术人提供的一种系统的线上技术分享活动。 每期不同的技术主题,和行业专家深度探讨,专注解决技术实践难点,推动技术创新,每两周的周三20点正式开课。欢迎各个机构、企业、行业专家、技术人...

    seasonley 评论0 收藏0
  • 前端每周清单半年盘点之 JavaScript

    摘要:前端每周清单专注前端领域内容,以对外文资料的搜集为主,帮助开发者了解一周前端热点分为新闻热点开发教程工程实践深度阅读开源项目巅峰人生等栏目。背后的故事本文是对于年之间世界发生的大事件的详细介绍,阐述了从提出到角力到流产的前世今生。 前端每周清单专注前端领域内容,以对外文资料的搜集为主,帮助开发者了解一周前端热点;分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎...

    Vixb 评论0 收藏0
  • 基于Python+DjangoKubernetes集群管理平台

    摘要:浅述集群日常管理维护中的一些痛点较为庞大的集群规模及容器数量维护管理。同时为了便于分类管理,避免端口冲突和资源合理利用。测试环境维护管理问题。测试版是基于与的运维管理系统。 原文出自【听云技术博客】:http://blog.tingyun.com/web/a...时至今日,接触kubernetes也有一段时间了,而我们的大部分业务也已经稳定地运行在不同规模的kubernetes集群上,...

    animabear 评论0 收藏0
  • JavaScript 编程精解 中文第三版 十、模块

    摘要:来源编程精解中文第三版翻译项目原文译者飞龙协议自豪地采用谷歌翻译编写易于删除,而不是易于扩展的代码。模块之间的关系称为依赖关系。用于连接模块的最广泛的方法称为模块。模块的主要概念是称为的函数。 来源:ApacheCN『JavaScript 编程精解 中文第三版』翻译项目原文:Modules 译者:飞龙 协议:CC BY-NC-SA 4.0 自豪地采用谷歌翻译 编写易于删除,而不是易于扩...

    justjavac 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<