最近接触了一些JavaScript开发的例子,在这里与大家一起分享一下:

例子:当我们一个团队在写Js文件的时候,你一个人写的JS代码自己可以看懂也可以维护,但是别人想对你的JS进行扩展的话,如果都在同一个JS文件上写的话,那样可能会很乱,造成维护上极其不方便,这时我们可以通过JS模块化开发

1.假如这是   JsHelperOne.js

//沙箱模式  防止污染外部变量
; (function (window) {
//定义一个对象 假如这个对象已存在与window下,那么我们就可以直接使用
var Cloud = window.Cloud || {};
//在这个对象上定义属性,而这个属性是一个对象
Cloud.PageStringHelper = {
StringCut: function (value,maxLength,sign) {
if (value.length <= maxLength)
return value;
else
return value.substr(0, maxLength) + sign;
}
};
//使外部只有Cloud可以被访问
window.Cloud = Cloud;
})(window);

2.假如B同学想对这个JS进行扩展的话,那么他就可以

;(function (window) {
var Cloud = window.Cloud || {};
Cloud.PageStringSplitHelper = {
stringSplit: function (value,sign) {
return value.split(sign);
}
};
window.Cloud = Cloud;
})(window);

在前台页面进行调用

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<script src="JsHelperTwo.js"></script>
<script src="JsHelperOne.js"></script> <script type="text/javascript">
console.log(Cloud.PageStringHelper.StringCut("asdasdasd", 5, "..."));
console.log(Cloud.PageStringSplitHelper.stringSplit("1,2,3",","));
</script>
</body>
</html>

这样的话,每个人对自己开发的一块非常熟悉,维护上也非常方便

JavaScript模块化开发实例的更多相关文章

  1. Javascript模块化开发-轻巧自制

    Javascript模块化开发-轻巧自制 一.前言现在javascript的流行,前端的代码越来越复杂,所以我们需要软件工程的思想来开发前端.模块化是必不可少的,这样不仅能够提高代码的可维护性.可扩展 ...

  2. javaScript 面向对象开发实例

    javaScript 面向对象开发实例 这个是结合require的模块化开发,首先创建构造函数: //test.js 1 function Test(lists) { var config={ nam ...

  3. Javascript模块化开发,使用模块化脚本加载工具RequireJS,提高你代码的速度和质量。

    随着前端JavaScript代码越来越重,如何组织JavaScript代码变得非常重要,好的组织方式,可以让别人和自己很好的理解代码,也便于维护和测试.模块化是一种非常好的代码组织方式,本文试着对Ja ...

  4. Javascript 模块化开发上线解决方案

    最近又换部门了,好频繁地说...于是把这段时间搞的小工具们简单整理了一下,作了一个小的总结.这次用一个简单业务demo来向大家介绍一下Javascript模块化开发的方式和自动化合并压缩的一些自己的处 ...

  5. JavaScript模块化开发整理

    在网上已经有很多关于模块化开发的文章了,这里还是按照自己的理解来整理一下. 随着项目文件的越来越大和需求的越来越贴近现实(我发现现在客户不如:一个领导说我要审批你们报上来的资料,系统发布以后用的还不错 ...

  6. Layui 弹出层组件——layer的模块化开发实例应用

    Layui 弹出层组件——layer的模块化开发实例应用 1.首先在package.json中引入layer组件依赖 2.在源码中应用这个依赖 3.在源码中编写代码应用此组件 4.效果验证:点击日历上 ...

  7. JavaScript模块化开发的那些事

    模块化开发在编程开发中是一个非常重要的概念,一个优秀的模块化项目的后期维护成本可以大大降低.本文主要介绍了JavaScript模块化开发的那些事,文中通过一个小故事比较直观地阐述了模块化开发的过程. ...

  8. 详解JavaScript模块化开发

    什么是模块化开发? 前端开发中,起初只要在script标签中嵌入几十上百行代码就能实现一些基本的交互效果,后来js得到重视,应用也广泛起来了,jQuery,Ajax,Node.Js,MVC,MVVM等 ...

  9. (转)详解JavaScript模块化开发

    https://segmentfault.com/a/1190000000733959 什么是模块化开发? 前端开发中,起初只要在script标签中嵌入几十上百行代码就能实现一些基本的交互效果,后来j ...

随机推荐

  1. Nginx代码调试——gdb工具

    参考网上的资料,写了一个configprint模块,其功能为打印输出location配置内容,并计数访问次数. 代码链接如下:https://github.com/PaulWeiHan/nginx_m ...

  2. OPTIMIZE TABLE

    INNODB 不支持 mysql> OPTIMIZE TABLE t; +--------+----------+----------+----------------------------- ...

  3. iostat来对linux硬盘IO性能进行了解

    http://www.php-oa.com/2009/02/03/iostat.html

  4. §12 循环101-while循环

    §12   循环101-while循环 While和for具有一定的可替换性.语法如下: while test body continue终止当次循环,break退出整个循环. 注意while之后要用 ...

  5. Sql Server 与CLR集成

    .NET编程和SQL Server ——Sql Server 与CLR集成   一.SQL Server 为什么要与CLR集成 1. SQL Server 提供的存储过程.函数等十分有限,经常需要外部 ...

  6. 针对wordpress的二次开发

    0.基础nginx\mysql\php\html\css\js 1. 搭建环境mac + nginx + mysql + wordpresshttp://segmentfault.com/a/1190 ...

  7. Servlet单实例多线程模式

    http://kakajw.iteye.com/blog/920839 前言:Servlet/JSP技术和ASP.PHP等相比,由于其多线程运行而具有很高的执行效率.由于Servlet/JSP默认是以 ...

  8. ns2出现Client: Handoff Attempt的情况解决

    找到mac/mac-802_11.cc,这是系统本身一个bug,对于adhoc网络无需进行切换尝试. > if (*rcount == 3 && handoff == 0) {& ...

  9. NewtonSoft.json 序列化和反序列化实例

    在百度 API Store 找个旅游的 API 来当成本次 Demo 的例子 接口地址:http://apis.baidu.com/apistore/attractions/spot AIPKEY: ...

  10. 在 ServiceModel 客户端配置部分中,找不到引用协定“PmWs.PmWebServiceSoap”的默认终结点元素

    System.Exception: ConfigManager.LoadConfigurationFromDb ServiceFactory.GetPmWebService 在 ServiceMode ...