本规范是针对javascript函数式编程风格与公司严重依赖于jQuery进行编码的现实制定出来。

禁止使用eval,with与caller(ecma262 v5 的use strict要求)。eval只允许在加密时机器生成。

声明变量必须加上 var 关键字,除了在for(;;)循环等语句中,原则上不允许使用连续声明。因为连 续声明的效率不如分开声明高,而且很容易手误致其暴露到全局作用域下。

常量,全部大写。

变量名,不能使用拼音,英文单词以驼峰风格组织起来。

分号,能加的地方都加(基本上除了for, function, if, switch, try, while外),防止因为这个问题导致压缩失败。

自定义类,只能用于UI库的构建,业务代码不准私自定义类。

原则上不允许使用伪对象(String, Number,Boolean),直接用其字面量。

原则上不允许使用Array与Object,直接用其字面量[], {}。

谨慎处理this,防止绑定失效,指向window,建议使用that引用它。

若想调用函数自身,禁止使用命名函数表达式,在目标函数的第一行编写以下代码实现,详解请google 《命名函数表达式揭秘》:

var self = arguments.callee;

禁止扩展原生对象的原型,特别是Object.prototype。

禁止在页面上对某个元素绑定事件,即下面的代码风格:

<a href="www.nowamagic.net" jump="bbb" onclick="goto(this.jump)">简明现代魔法</a>

禁止使用IE的条件注释,一压缩就没有了。

var f = function () {
/*@cc_on if (@_jscript) { return 2* @*/ 3; /*@ } @*/
};

禁止块内函数声明,详解请google《命名函数表达式揭秘》。

if (x) { //ng
function foo() {}
} if (x) {
var foo = function() {}
}

for-in 循环只能用于object。

禁止使用多行字符串,因为在编译时, 不能忽略行起始位置的空白字符; "\" 后的空白字符会产生奇 怪的错误; 虽然大多数脚本引擎支持这种写法, 但它不是 ECMAScript 的标准规范。

var myString = 'A rather long string of English text, an error message \
actually that just keeps going and going -- an error \
message to make the Energizer bunny blush (right through \
those Schwarzenegger shades)! Where was I? Oh yes, \
you\'ve got an error and all the extraneous whitespace is \
just gravy. Have a nice day.';

原则上不允许字符串拼接HTML代码,请使用前台模板或后台模板。

字符串字面量,使用 ' 优于 "。

注释,使用JSDoc。

每一行不宜过长,写完一段代码后请用IDE把它格式化一下。

为元素添加自定义变量,统一使用"data-"前缀,放便与HTML5的"data-*"机制相衔接。

禁止jQuery使用一行以上的链式操作,非常难读。

元素的选择,多使用ID选择器,类选择器,标签选择器,慎用子元素结构伪类与位置伪类(nth- child,:first,:eq,:gt)

在已有jQuery对象搜找附近的元素节点,不建议用使用多级的find寻找,而使用相关的遍历函数。

JavaScript程序应尽量放到外部的JS文件中,以便压缩与缓存。

标准特性优于非标准特性(如果类库有提供,优先使用类库中的函数)。

$("XXXX").find("YYYY").find("ZZZZ"); //ng
$("XXXX").next() //或者nextUntil, nextAll, prev, prevAll, prevUntl, children, closest, .siblings

为元素添加事件时,考虑的顺序是delegate > live > bind。

jQuery在以下事件中存在问题 change resize mouseenter mouseleave mousewheel,大体上用不了事件代理,像mousewheel事件只能借助于插件。

不在JS文件中留下未来确定不再使用的代码片段。

凡是被jQuery引用到的ID或类名都应该用js_作为前缀,警示其他人在调整样式时把它误删了。

JS代码必须置于$$命名空间对象之内,所有函数的执行从main函数开始。

     ;;;$(function(){
//...其他用到的变量
var $$ = window.$$ = {
//本页面私有的辅助函数1
_assist1:function(){ },
//本页面私有的辅助函数2
_assist2:function(){ },
//本页面私有的辅助函数3
_assist3:function(){ },
//本页面私有的辅助函数4
_assist4:function(){ },
//本页面私有的辅助函数5
_assist5:function(){ },
//....更多的私有函数
//功能1
feature1:function(){ },
//功能2
feature2:function(){ },
//功能3
feature3:function(){ },
//功能4
feature4:function(){ },
//功能5
feature5:function(){ },
//从后台获取的JSON数据统一放到这个对象中,以便其他函数调用
jsons:{},
//....更多需求,一个需求对应一个函数
main:function(){
$$.feature1();
$$.feature2();
$$.feature3();
$$.feature4();
//....在main主函数中调用它们。
}
}
$$.main();
});

从后台获取JSON数据的格式统一为

$.getJSON(url,params,function(json){
if(json && json.status === "1"){
$.flash(json.msg);
$$.jsons["xxxx"] = json;//将JSON保存起来
}else{
$.flash(json.msg,"error")
}
});
$.post(url,params,function(json){
if(json && json.status === "1"){
$.flash(json.msg);
$$.jsons["xxxx"] = json;
}else{
$.flash(json.msg,"error")
}
},"json");

为了实现请求与执行回调相分离,我们使用dependBy函数,这样就有效避免多层嵌套的回调,让代码的易懂性大大提高。

$.dependBy(["list_configs"],$$.jsons,function(){
var json = $$.jsons.ist_configs;
//......其他代码
});

JavaScript的团队编程规范的更多相关文章

  1. javascript模块化编程规范

    一.javascript模块化编程规范: 二.关于commenjs规范和AMD规范: 根本不同:前者用于服务器端同步加载模块:后者是客户端异步加载模块. 同点:两者都有一个全局函数require(), ...

  2. Javascript模块化编程-规范[2]

    实现Javascript模块化,固然很重要,但是怎样才能实现国际上都能认可的模块化呢?模块化编程规范随应运而生. 目前Javascript模块化规范主要有两种:CommonJS和AMD. Common ...

  3. JavaScript编程规范

    最近看NodeJS中,有一部分写JS约定俗成的编程规范(附录B,详情参考附件),感觉在实际工作中能用到, 大致意思分享给大家,详情参考附件: 1.缩进:建议两空格 作为Node.js代码的缩进标记: ...

  4. 翻译连载 | 第 9 章:递归(下)-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇

    原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...

  5. SAP官方发布的ABAP编程规范

    最近有朋友在公众号后台给我留言,"Jerry啊,你最近写的都是一些SAP研究院里面用到的新技术,能不能写点SAP传统的开发技术比如ABAP相关的东西"? 其实Jerry在刚开始写这 ...

  6. 各大厂 C/C++ 编程规范详解

    来吧!各大厂知名规范体系~ 各有特点各有侧重~ Google C++ Style Guide Google C++ Style Guide,[中文版],简称 GSG,谷歌的 C++ 编程规范,在国内有 ...

  7. Batsing的网页编程规范(HTML/CSS/JS/PHP)

    特别注意!!!我这里的前端编程规范不苟同于Bootstrap的前端规范. 因为我和它的目的不同,Bootstrap规范是极简主义,甚至有些没有考虑到兼容性的问题. 我的规范是自己从编程实践中总结出来的 ...

  8. 【转】JavaScript 风格指南/编码规范(Airbnb公司版)

    原文转自:http://blog.jobbole.com/79484/ Airbnb 是一家位于美国旧金山的公司,本文是其内部的 JavaScript 风格指南/编码规范,在 Github 上有 11 ...

  9. 使Eclipse符合Java编程规范

    编程规范是很重要的东西,能让团队的代码易于阅读和维护,也便于日后的功能扩展. 工欲善其事必先利其器!作为一个Java程序员,与Eclipse打交道可能是一辈子的事情.将Eclipse设置为符合公司编程 ...

随机推荐

  1. python基础数据类型之列表,元组操作

    一.列表的索引和切片1.列表的索引列表和字符串一样样拥有索引 lst = ["a","b","c"] print(lst[0]) # 获取第 ...

  2. spring框架中@PostConstruct的实现原理

    在spring项目经常遇到@PostConstruct注解,首先介绍一下它的用途: 被注解的方法,在对象加载完依赖注入后执行. 此注解是在Java EE5规范中加入的,在Servlet生命周期中有一定 ...

  3. PHP常用180函数总结

    数学函数 1.abs(): 求绝对值 <span style="font-size: 14px;">$abs = abs(-4.2); //4.2<br>& ...

  4. <Docker学习>5. docker数据管理

    当我们创建了一个tomcat容器,如何简单部署一个web应用?如何将war包放入到容器中?也就是说怎么样把文件从宿主机中 "放入" 到容器中? docker cp命令可以将宿主机本 ...

  5. Python全栈day 06

    Python全栈day 06 一.数据类型补充完整 1. 列表(list) 反转reverse list1 = [1,2,3,4,5,6,7,8,9] list1.reverse() print(li ...

  6. 最短路径之迪杰斯特拉算法(Java)

    1)Dijkstra算法适用于求图中两节点之间最短路径 2)Dijkstra算法设计比较巧妙的是:在求源节点到终结点自底向上的过程中,源节点到某一节点之间最短路径的确定上(这也是我之前苦于没有解决的地 ...

  7. Postgres常用命令之增、删、改、查

    增.删.改.查: postgres=# \password postgres 为postgres进行密码设置: postgres=# CREATE USER test WITH PASSWORD '1 ...

  8. CF797E. Array Queries

    a is an array of n positive integers, all of which are not greater than n. You have to process q que ...

  9. JMeter学习笔记(十一) 关于 CSV Data Set Config 的 Sharing mode 对取值的影响

    关于 CSV Data Set Config 的一些介绍之前已经梳理过了,可以参考: https://www.cnblogs.com/xiaoyu2018/p/10184127.html . 今天主要 ...

  10. 板载raid 安装Ubuntu 黑屏

    最近有碰到过产线反馈supermicro x10主板板载raid安装ubuntu桌面版 ,出现安装完成后黑屏,现象是能正常识别faker raid 但是第一次重启,就会出现黑屏,只有左上角广光标在闪, ...