20条学习javascript的编程规范的建议


Posted in Javascript onNovember 28, 2014

1、使用js文件管理代码

所有代码尽量放在js文件中,然后再html文件中使用script引入,引入时注意放在body标签后面,并且不使用type或者language。

2、书写缩进

使用4个空白格缩进,注意不要使用tab键进行缩进。

3、断句

注意行长,每行不超过80个字符,超过时要进行适当断句,断句应该再操作符后面进行,最理想的是在逗号(,)后面进行断句,断句后下一行使用8格缩进。

4、注解

一般使用单行注释,块注释一般用于文档。

5、变量声明

所有变量使用之前先声明,未声明的变量会自动作为全局变量。全文应少使用全局变量。
最好把所有变量声明用一个var实现,并且每个声明单独放一行,并添加注释说明,如果可以所有声明变量按照字符顺序列出,如下:

var currentEntry,      //当前选择表项目

    level;          //缩进级别

在函数体内顶部定义所有变量,则var出现在函数体首行。

6、函数声明

所有函数使用前应该先声明,并且在变量之后进行-------有助于查看作用域。
函数名和括号直接不应该有空格;右括号(和函数参数之间不应该有空格;左括号)和函数体括号{之间有一个空格;函数体缩进4个空格;函数体结束括号}和函数声明关键字function首字符对齐。如下代码:

function outer(c,d) {

    var e = c * d;
    function inner(a,b) {

        return (e * a ) + b;

    }
    return inner(0,1);

}

函数和对象可以被放在任何允许放表达式的地方。
匿名函数关键字function和左括号(之间有一个空格。
尽量少使用全局函数。
对于立即执行函数,整个调用表达式应放在一对个括号()里面,以明确变量的值是函数执行结果而不是函数本身。如下代码:
var result = (function () {

    var key = "";

    return {

        get: function () {

            return key;

        },

        set: function (key) {

            key = key;

        }

    };

}());

7、命名

以字母、数字、下划线命名,避免使用国际字符、美元符号$、反斜杠\。
不要使用下划线作为名称的首位字符。
大多数变量和函数使用小写字母开头命名。
构造函数必须使用大写字母开头,在js中省略new不会报错(编译或者运行错误),但最好不要省略。
全局变量应用全部大写命名(js中没有宏和常量的概念)。

8、语句

简单语句

每行最多一条语句,并且使用分号;结尾,注意以函数字面量和对象字面量赋值的语句也要使用分号;。
js允许任何一个变量作为一条语句,但是在插入分号的时候可能会引起某些错误,因此一般使用表达式的语句是赋值或者函数调用语句(这句英文原文我大概理解了,但是不知道怎么翻译出来比较好)

复合语句(包含在一对{}之间的语句)

内部语句缩进4个空格。

左括号{应该在开始语句行的末尾。
右括号应该在最后单独一行,并且与左括号所在行的首字符对齐。
当语句在控制语句(例如for、if等)中时,应该使用花括号{}将语句包围起来,即使只有一条语句,这样可以保证在添加语句时不产生bug。

9、标签(这一部分的理解感觉不是很对)

要使用label的语句是有选择性的,只有下面几种:while、for、do、switch。

10、返回语句

返回的值应该用圆括号括起来,且返回表达式应该和return关键字在同一行(避免换行插入分号)。

11、if语句

遵循如下格式:

if (condition) {

    statements

}
if (condition) {

    statements

} else {

    statements

}
if (condition) {

    statements

} else if (condition) {

    statements

} else {

    statements

}

12、for语句

遵循如下格式:

for (initiliazation; condition; update) {

    statements

}
for (variable in object) {

    if (filter) {

        statements

    }

}

第一种循环格式用于数组和可以判断迭代次数的变量。
第二中用于对象遍历
注:此处提到了在对象原型中添加的属性是可以枚举的,因此要使用hasOwnProperty方法进行筛选,但是我用for in代码测试的时候,没有显示,这里不知道问题出在了哪里。

13、while语句

遵循如下格式:

while (condition) {

    statements

}

14、do-while语句

遵循如下格式:

do {

    statements  

} while (condition);

语句结尾要添加分号。

15、switch语句

遵循如下格式:

switch (expression) {

case expression:

    statements

default:

    statements

}

每一个case都要和switch对齐,避免过分缩进,只有case标签不是语句,应该不应该缩进。
每个case语句(除了default)必须要以break或return或throw结尾。

16、try语句

遵循如下格式:

try {

    statements

} catch (variable) {

    statements

}

try {

    statements

} catch (variable) {

    statements

} finally {

    statements

}

17、continue语句

避免使用continue语句。

18、with语句

不应该使用with语句。

19、空格使用

通过设置空行来分割逻辑相关的代码段,以增强代码可读性。
在以下情况下设置空格:
关键字之后跟随左括号(要使用空格,例如:
while (true) {
不能在函数参数和左括号(之间使用空格。
除了点号(.)、左圆括号(()、方括号([)以外的二元运算符都要使用一个空格来和操作数分割开。
除了typeof以外的一元操作符和他的操作数之间不应有空格。
for语句控制块()中每个分号;之后有一个空格。
每个逗号后面要有一个空格。

20、额外建议

[]和{}
当成员名称是连续整数时使用数组,当成员名称是任意字符串和名称时使用对象。
使用{}代替new object(),使用[]代替new Array()。
逗号,操作符
避免使用逗号,操作符(这一规定不适用于对象字面量、数组字面量定义和var声明语句以及参数列表)
块级作用域
除了符合语句不使用语句块,js没有块级作用域,只有函数作用域。
赋值表达式
while和if语句中条件判断部分避免使用赋值语句。
===和!==
判定相等使用全等符号(===和!==),避免使用强制类型相等转换符号(==和!=)。
若一个数字加(或者-)一个带有符号(+或者-)的数字,或者带有(++或--)的数字,则需要将带有符号或者(++或--)的数字括起来。
eval是恶魔(eval的滥用l)
eval有相同情况,不应使用Function构造函数,不向setTimeout或setInterval函数传递字符串。

以上20条建议都是本人在项目中总结出来的,对于新手学习javascript应该是小有帮助的,都是个人经验,难免有不全面的地方,如果发现了,还请告之,这里抛砖引玉,大家共同进步。

Javascript 相关文章推荐
FormValidate 表单验证功能代码更新并提供下载
Aug 23 Javascript
JavaScript 语法集锦 脚本之家基础推荐
Nov 15 Javascript
JavaScript面向对象之静态与非静态类
Feb 03 Javascript
js中函数调用的两种常用方法使用介绍
Jul 17 Javascript
浅谈angular2 组件的生命周期钩子
Aug 12 Javascript
React中上传图片到七牛的示例代码
Oct 10 Javascript
JS开发中基本数据类型具体有哪几种
Oct 19 Javascript
jQuery实现获取form表单内容及绑定数据到form表单操作分析
Jul 03 jQuery
JS中call()和apply()的功能及用法实例分析
Jun 28 Javascript
JavaScript 作用域scope简单汇总
Oct 23 Javascript
原生JavaScript之es6中Class的用法分析
Feb 23 Javascript
JavaScript分页组件使用方法详解
Jul 26 Javascript
20个实用的JavaScript技巧分享
Nov 28 #Javascript
js获取浏览器基本信息大全
Nov 27 #Javascript
jQuery实现多按钮单击变色
Nov 27 #Javascript
jQuery的ready方法详解
Nov 27 #Javascript
javascript 面向对象封装与继承
Nov 27 #Javascript
javascript制作坦克大战全纪录(2)
Nov 27 #Javascript
javascript制作坦克大战全纪录(1)
Nov 27 #Javascript
You might like
针对初学PHP者的疑难问答(2)
2006/10/09 PHP
自动把纯文本转换成Web页面的php代码
2009/08/27 PHP
PHP 抓取新浪读书频道的小说并生成txt电子书的代码
2009/12/18 PHP
PHP获取youku视频真实flv文件地址的方法
2014/12/23 PHP
php获取twitter最新消息的方法
2015/04/14 PHP
Zend Framework教程之前端控制器Zend_Controller_Front用法详解
2016/03/07 PHP
thinkphp3.x连接mysql数据库的方法(具体操作步骤)
2016/05/19 PHP
PHP从零开始打造自己的MVC框架之类的自动加载实现方法详解
2019/06/03 PHP
javascript事件模型代码
2007/07/01 Javascript
js 发个判断字符串是否为符合标准的函数
2009/04/27 Javascript
javascript下高性能字符串连接StringBuffer类
2010/08/16 Javascript
js定时调用方法成功后并停止调用示例
2014/04/08 Javascript
BootStrap CSS全局样式和表格样式源码解析
2017/01/20 Javascript
jquery easyui dataGrid动态改变排序字段名的方法
2017/03/02 Javascript
面试常见的js算法题
2017/03/23 Javascript
angular或者js怎么确定选中ul中的哪几个li
2017/08/16 Javascript
IE11下CKEditor在Bootstrap Modal中下拉问题的解决
2019/09/25 Javascript
React实现类似淘宝tab居中切换效果的示例代码
2020/06/02 Javascript
[17:36]VG战队纪录片
2014/08/21 DOTA
[02:20]DOTA2亚洲邀请赛 EHOME战队出场宣传片
2015/02/07 DOTA
python批量提取word内信息
2015/08/09 Python
使用rst2pdf实现将sphinx生成PDF
2016/06/07 Python
Python实现抓取网页生成Excel文件的方法示例
2017/08/05 Python
python3 flask实现文件上传功能
2020/03/20 Python
彻底理解Python中的yield关键字
2019/04/01 Python
Python装饰器限制函数运行时间超时则退出执行
2019/04/09 Python
Python读写文件模式和文件对象方法实例详解
2019/09/17 Python
Python: tkinter窗口屏幕居中,设置窗口最大,最小尺寸实例
2020/03/04 Python
Pycharm安装第三方库失败解决方案
2020/11/17 Python
在css3中background-clip属性与background-origin属性的用法介绍
2012/11/13 HTML / CSS
幼儿园教师培训方案
2014/02/04 职场文书
大学生村官演讲稿
2014/04/25 职场文书
2015年园林绿化工作总结
2015/05/23 职场文书
2016大一新生入学教育心得体会
2016/01/23 职场文书
MySQL索引是啥?不懂就问
2021/07/21 MySQL
Mysql关于数据库是否应该使用外键约束详解说明
2021/10/24 MySQL