Javascript 编码约定(编码规范)


Posted in Javascript onMarch 11, 2018

1、使用 strict 模式

在一个作用域(包括函数作用域、全局作用域)中,可以使用

"use strict";

来开启 strict 模式。

2、缩进

用 Tab 键进行代码缩进,以节约代码大小,使用4个空格的宽度来进行缩进(JSLint 建议)。

3、符号

1) 大括号

与语句放同一行,放于最后面;仅有一行语句,也使用大括号:

if (true) {
  //true
} else {
  //false
}
while (true) {
  //alert(1);
}

2) 空格

在逗号、分号、冒号后加空格
在操作符前后加空格
在大括号开始符之前
在大括号结束符和 else、while 或 catch 之间
在 for 的各个部分
如:

var a = [1, 2, 3];
var obj = {
  name: 'name',
  value: 'value'
};
for (var i = 0; i < 10; i++) {}
function func(a, b, c) {}

c = a + b;
if (a && b || c) {
  //if
} else {
  //else
}

try {
  //try
} catch(err) {
  //catch
}

3) 所有语句结束后,使用 ; 号结束

4、命名

对象:使用驼峰式,如:MyClass
方法、变量:使用混合式,如:getName(), myName
常量:大写加下划线,如:MY_NAME

5、单一 var 模式

只使用一个 var 在函数顶部进行变量声明,作用如下:

1) 提供一个单一的地址已查找到函数需要的所有局部变量
2) 防止出现变量在定义前就被使用的逻辑错误
3) 帮助牢记要声明变量,尽可能少地使用全局变量
4) 更少的编码

function func() {
  var a = 1,
    b = 2, 
    sum = a + b,
    obj = {
      name: 'name',
      value: 'value'
    },
  $btn = $('#btn');
  //函数体
}

6、循环

1) for 循环

var i, arr = [];
for (i = arr.length; i--;) {
  //arr[i];
}

注:

for (var i = 0; i < document.getElementsByName().length; i++) {
  //document.getElementsByName()[0];
}

这种方式每次对 i 进行长度比较的使用对会进行 document 的查询,而通常 DOM 操作是非常耗时的。

2) while 循环

var arr = [], 
  i = arr.length;
while (i--) {
  //处理
}

3) for-in 循环

var i,
  hasOwn = Object.prototype.hasOwnProperty;
for (i in man) {
  if (hasOwn.call(man, i)) { //过滤
    console.log(i, ':', man[i]);
  }
}

7、switch 选择

switch (num) {
case 0:
  //do something
  break;
case 1:
  //do something
  break;
...
default:
  //do default
}

建议使用:

var obj = {
  '0': function() {
    //do somethins
  },
  '1': function() {
    // do somethis
  }, ...
}
if (obj.hasOwnProperty(num)) {
  obj[num]();
} else {
  //do default
}

8、使用 parseInt() 的数值约定

1) 每次都具体指定进制参数:

var month = '09', day = '08';
month = parseInt(month, 10); //不加进制参数便会转换为八进制
day = parseInt(day, 10);

2) 其他常用的将字符串转换为数值的方法:

+'08';
Number('08');

9、字面量模式

不建议使用构造函数来定义:

// built in constructors (avoid)
var o = new Object();
var a = new Array();
var re = new RegExp('[a-z]', 'g');
var s = new String();
var n = new Number();
var b = new Boolean();
throw new Error('message');

建议使用更优的字面量模式:

// literals and primitives (prefer)
var o = {};
var a = [];
var re = /[a-z]/g;
var s = '';
var n = 0;
var b = false;
throw {
  name: 'Error',
  message: 'message'
}

10、其他

1) 变量内的简写单词如果在开头则全小写:xmlDocument,如果不在开头则全大写:loadXML
2) 变量必须是有意义的英文,禁止拼音

Javascript 相关文章推荐
一个对于Array的简单扩展
Oct 03 Javascript
Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]
Sep 26 Javascript
去掉gridPanel表头全选框的小例子
Jul 18 Javascript
jquery检测input checked 控件是否被选中的方法
Mar 26 Javascript
Javascript中的call()方法介绍
Mar 15 Javascript
在Javascript中处理数组之toSource()方法的使用
Jun 09 Javascript
jQuery Easyui实现左右布局
Jan 26 Javascript
谈一谈javascript闭包
Jan 28 Javascript
jQuery中ajax错误调试分析
Dec 01 Javascript
微信小程序出现wx.navigateTo页面不跳转问题的解决方法
Dec 26 Javascript
vue插槽slot的理解和使用方法
Apr 03 Javascript
vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法
Oct 30 Javascript
JavaScript获取移动设备型号的实现代码(JS获取手机型号和系统)
Mar 10 #Javascript
js经验分享 JavaScript反调试技巧
Mar 10 #Javascript
webpack打包node.js后端项目的方法
Mar 10 #Javascript
webpack external模块的具体使用
Mar 10 #Javascript
webpack组织模块打包Library的原理及实现
Mar 10 #Javascript
浅谈webpack组织模块的原理
Mar 10 #Javascript
Vuex实现计数器以及列表展示效果
Mar 10 #Javascript
You might like
php设计模式 Delegation(委托模式)
2011/06/26 PHP
浅谈PHP正则中的捕获组与非捕获组
2016/07/18 PHP
详解配置 Apache 服务器支持 PHP 文件的解析
2017/02/15 PHP
JavaScript实际应用:innerHTMl和确认提示的使用
2006/06/22 Javascript
Chrome中JSON.parse的特殊实现
2011/01/12 Javascript
Js如何判断客户端是PC还是手持设备简单分析
2012/11/22 Javascript
jQuery中对节点进行操作的相关介绍
2013/04/16 Javascript
JS防止用户多次提交的简单代码
2013/08/01 Javascript
JS页面延迟执行一些方法(整理)
2013/11/11 Javascript
写JQuery插件的基本知识
2013/11/25 Javascript
JavaScript中的getTimezoneOffset()方法使用详解
2015/06/10 Javascript
jQuery实现简单下拉导航效果
2015/09/07 Javascript
JavaScript门道之标准库
2018/05/26 Javascript
在微信小程序中使用图表的方法示例
2019/04/25 Javascript
基于Vue实现电商SKU组合算法问题
2019/05/29 Javascript
vue App.vue中的公共组件改变值触发其他组件或.vue页面监听
2019/05/31 Javascript
JS控制GIF图片的停止与显示
2019/10/24 Javascript
[01:33:07]VGJ.T vs Newbee Supermajor 败者组 BO3 第一场 6.6
2018/06/07 DOTA
[48:37]EG vs OG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
在Python中处理字符串之isdigit()方法的使用
2015/05/18 Python
Python中字符串的常见操作技巧总结
2016/07/28 Python
python numpy元素的区间查找方法
2018/11/14 Python
基于python实现的百度新歌榜、热歌榜下载器(附代码)
2019/08/05 Python
Python中socket网络通信是干嘛的
2020/05/27 Python
python 生成器需注意的小问题
2020/09/29 Python
澳大利亚在线时尚精品店:Hello Molly
2018/02/26 全球购物
介绍一下Java的安全机制
2012/06/28 面试题
linux面试题参考答案(1)
2016/01/22 面试题
如何写一个Java类既可以用作applet也可以用作java应用
2016/01/18 面试题
公司寄语大全
2014/04/10 职场文书
幼儿园端午节活动方案
2014/08/25 职场文书
再婚婚前财产协议书范本
2014/10/19 职场文书
股权转让协议书
2014/12/07 职场文书
SQL基础查询和LINQ集成化查询
2022/01/18 MySQL
Python+OpenCV实现图片中的圆形检测
2022/04/07 Python
Java 死锁解决方案
2022/05/11 Java/Android