• 团队合作,如何避免 JavaScript 冲突?
  • Cvlrt 发表于 2016/3/2 10:18:00 | 分类标签: javascript教程 性能优化
  •  1、团队合作,如何避免 JavaScript 冲突?

    为了让 JavaScript 不产生冲突,需要避免全局变量的泛滥,合理使用命名空间以及为代码添加必要的注释。

    (1)避免全局变量的泛滥:使用匿名函数将脚本包起来,让变量的作用域控制在匿名函数之内。使用 (function(){})() 这种形式,先定义一个匿名函数,然后立即执行:

    (function() {
      //编写代码
    })();
    

    (2)合理的使用命名空间:

    • 使用普通的变量作为全局变量,扩展性会非常差,使用一个 {} 对象作为全局变量,然后可以将多个变量作为该全局变量的属性。推荐使用 GLOBAL 作为全局变量的变量名,即 var GLOBAL = {};

    • 在不同的匿名函数中,根据功能声明一个不同的命名空间,然后每个匿名函数中 GLOBAL 对象的属性直接挂在匿名函数的命名空间下,即 GLOBAL.Namespace = {};

    GLOBAL.Namespace.variable = value;

    (3)为代码添加合理的注释:

    • 公共组件都要在文件头部加上注释说明:

    /\*
    * 文件用途说明
    * 作者姓名
    * 联系方式
    * 制作日期
    *\*/
    

    • 大的模块注释方法:

    //===============
    
    // 代码用途
    
    //===============
    

    • 小的注释,单独占一行,不要在代码后加注释:

    //代码说明
    

    2、给程序一个统一的入口——window.onload 和 DOMReady

    • 由于 JavaScript 是种脚本语言,浏览器下载到哪就会执行到哪,所以对页面的代码模块提供一个统一的入口很有必要,从而可以避免一些不必要的错误。推荐使用 jQuery 框架的 (document).ready(function(){}) 或者 (function(){}) 作为程序的统一入口。

    3、JavaScript 优化问题

    (1)由于 HTML 是按顺序加载,但 JavaScript 代码比较复杂时,会导致页面短暂时间的空白。为了更好的提高用户的体验,建议将:CSS 放页头,JavaScript 放页尾。

    (2)JavaScript 编译——文件压缩

    • 流行的 JavaScript 压缩工具有 Packer 和 YUI Compressor

    • 为了方便维护,源文件的文件名和压缩后文件的文件名应建立对应关系。如:src.js,压缩后为src.min.js

    4、JavaScript 分层概念

    • 一般将 JavaScript 分成三层:base.js + common.js + page.js

    (1)base 层,位于最低层,主要功能是:封装不同浏览器下 JavaScript 的差异,提供统一的接口;扩展 JavaScript 语言底层提供的借口,让它提供更为一用的借口。建议使用 jQuery 框架来作为 base 层。

    (2)common 层,位于中间层,主要功能是:提供可供复用的组建,对一些常用的功能进行封装,为 page 层提供组件。

    (3)page 层,位于最高层,与页面的具体功能需求直接相关,完成页面内的功能需求。

  • 请您注意

    ·自觉遵守:爱国、守法、自律、真实、文明的原则

    ·尊重网上道德,遵守《全国人大常委会关于维护互联网安全的决定》及中华人民共和国其他各项有关法律法规

    ·严禁发表危害国家安全,破坏民族团结、国家宗教政策和社会稳定,含侮辱、诽谤、教唆、淫秽等内容的作品

    ·承担一切因您的行为而直接或间接导致的民事或刑事法律责任

    ·您在编程中国社区新闻评论发表的作品,本网站有权在网站内保留、转载、引用或者删除

    ·参与本评论即表明您已经阅读并接受上述条款

  • 感谢本文作者
  • 作者头像
  • 昵称:Cvlrt
  • 加入时间:2013/5/22 0:00:00
  • TA的签名
  • 这家伙很懒,虾米都没写
  • +进入TA的空间
  • 以下内容也很赞哦
分享按钮