js 在项目中的一些应用

 一、js 结构管理方案

    1.在我们的项目中为了更好的管理js,设计了一套新的js 结构管理方案,如图

 

 

     在js 文件夹下有许多小的文件夹例如other,Index , 那是用来存放各个模块js 的文件夹。其中Pub是用来存放公用js  的。各个模块js  的命名一般是用模块业务页面名来命名。通过不同的模块和具体业务页面就可以很方便的找到该业务的 js。

 

      2.为了统一管理js 的引用,在页面的基类封装了一个公用js 的注册方法，对于那些公用的js ,可以通过这个方法统一注册，有些页面需要引用一些私有的js ,在基类中也提供了注册的方法。

      这种方式解决了在每个页面中重复引用公用js 的问题。把 js 的注册封装到后台，更好的将业务与页面分离，从而实现系统的可维护性

 

      3.在目前的结构中，解决了我们js 文件的管理。一个设计的好坏在于它应用的场景和深度。也可以用一个xml 文件或者用一个动态加载函数去管理js 的注册，解决用户二次开发带来的js 注册问题。

 

 二、可扩展的外框架平台 

 

     1.如果把管理软件比作一个人，那么外框架就好比是它的外表。外表的好看和结实，关系到整个软件的使用。为此基于jquery开发了一套实用性很强的外框架。

 

      该框架目前支持所有主流浏览器。看过许多别人的框架，当标签页过多时一般处理形式是在标签条左右两边放置一个按钮，点击后显示隐藏的标签。在我们的标签条中加入一个更多，用来存放隐藏的标签页。标签页显示的个数是根据页面的宽度自适应的。

      当同时打开多个标签页是不会有性能影响的。如果打开多个标签页，只有当前显示的标签页才会去加载，其他的标签页只是创建了一个空标签.

 

     2.框架实现机制是构建一个存放IFRAME 的数组。当用户点击左侧菜单时会创建一个展示的IFRAME  页面。当框架加载时会去判断当前窗口可容纳的标签数，当标签数超过可容纳数将以隐藏方式放入更多。

 

     3.好的框架必须考虑到与其他系统的集成。目前考虑增加一个自定义菜单的功能，这样可以通过URL 的形式把其他系统集成进来。增强左侧导航栏后台或js 的数据绑定的功能。因为微软树控件性能不是很好，考虑增加一个后台树控件。

 

三、兼容性js框架的选择

     1.在开发过程中，常常会为浏览器的兼容问题而苦恼。为了解决浏览器的兼容问题，我们选择了一款优秀的js 框架  jquery , 这也是目前比较主流的。将jquery做为我们的底层库，基于它去构建我们的业务库。

     2.在我们的开发中，为了更好的处理一些页面对象。会封装一些jquery 插件，也就是对Jquery做一些扩展。一般分为基于对象和基于类级别的扩展。在实现的过程中一般我们会用闭包的形式去扩展。这样不会与外界函数和变量产生冲突。

 

四、合理的js 库规划

 

     1.在开发过程中如果每个人都有一个自己的实现库，那么这套系统将会臃肿不堪。为了规划好js 库我们设计了一套方案。

公共管理库Jle.js，提供命名空间（例如可命名为Jle）和一些公用的功能。其他的库例如表单验证库，弹出层库等都可以基于Jle这个命名空间去扩展。命名可以参考Jle_功能名.js  ,例如弹出层库Jle_Layer.js 基于Jle的原型去扩展。对于弹出一个层的调用  如：  Jle.Layer.Show(object1,object2);  这样就可以通过统一的命名空间去管理我们的js 库了。

   

五、无刷新通信技术

 

     1. 在有些数据的处理上，需要用到无刷新技术。一般常用的有AJAX ,IFRAME提交，ASP.ENT 的回调机制，ajax.DLL 。以前我们用的是ajax.dll，虽然写法上会很轻松，但是可控性太差，所以舍弃了AJAx.DLL,换成 jquery  内置的AJAX 请求去处理我们的服务器请求，数据的交互则用json 去处理。

 

     2.用JSON 进行通信是一个很好的方式。和其他通信格式相比，json 拥有格式小，解析速度快(json是Javascript对象序列化形式的一种)，当JSON  数据包含数组而不是对象时，与大多数服务器端语言的编解码库之间有着很好的互操作性。

 

六、Js 性能调优

 

     1.如何才能让我们的代码更具有健壮性。需要对我们的程序做一些必要的优化。对于js 的优化，对于大的模块库我推荐最好以闭包的形式去扩展(小的库基于库名对象扩展就行了,闭包的持久性会占用过多内存)；用jquery 去操作Dom 元素，规避浏览器兼容性问题；用json作为数据通信格式，jquery 可以高效，方便的处理json数据；对于其他业务页面中js 函数的声明用直接量或者静态的形式去定义；如果需要类的继承时，最好用构造函数和原型混合形式去继承。

 

     2.对于团队开发而言，最好有自己的js规范和错误共享知识库，从而去规避程序员经验不足而导致的错误。

 

转载于:https://www.cnblogs.com/cbi360/archive/2012/12/24/2831291.html