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 相关文章推荐
Javascript+CSS实现影像卷帘效果思路及代码
Oct 20 Javascript
javascript学习笔记整理(概述、变量、数据类型简介)
Oct 25 Javascript
概述一个页面从输入URL到页面加载完的过程
Dec 16 Javascript
JS实现的自动打字效果示例
Mar 10 Javascript
详解探索 vuex 2.0 以及使用 vuejs 2.0 + vuex 2.0 构建记事本应用
Jun 16 Javascript
protractor的安装与基本使用教程
Jul 07 Javascript
使用store来优化React组件的方法
Oct 23 Javascript
Vue中使用vee-validate表单验证的方法
May 09 Javascript
微信小程序中转义字符的处理方法
Mar 28 Javascript
了解javascript中变量及函数的提升
May 27 Javascript
JS使用for in有序获取对象数据
May 19 Javascript
Vuex的热更替如何实现
Jun 05 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读取mssql的ntext字段返回值为空的解决方法
2014/12/30 PHP
php解析字符串里所有URL地址的方法
2015/04/03 PHP
CI(CodeIgniter)框架中URL特殊字符处理与SQL注入隐患分析
2019/02/28 PHP
微信推送功能实现方式图文详解
2019/07/12 PHP
JavaScript Array Flatten 与递归使用介绍
2011/10/30 Javascript
jQuery创建平滑的页面滚动(顶部或底部)
2013/02/26 Javascript
解决json日期格式问题的3种方法
2014/02/02 Javascript
jquery下div 的resize事件示例代码
2014/03/09 Javascript
IE中图片的onload事件无效问题和解决方法
2014/06/06 Javascript
ajaxFileUpload.js插件支持多文件上传的方法
2014/09/02 Javascript
12个超实用的JQuery代码片段
2015/11/02 Javascript
详解jquery事件delegate()的使用方法
2016/01/25 Javascript
让图片跳跃起来  javascript图片轮播特效
2016/02/16 Javascript
PHP捕捉异常中断的方法
2016/10/24 Javascript
vue-resource 拦截器使用详解
2017/02/21 Javascript
WebSocket实现简单客服聊天系统
2017/05/12 Javascript
Vue微信项目按需授权登录策略实践思路详解
2018/05/07 Javascript
Vue.js 实现数据展示全部和收起功能
2018/09/05 Javascript
快速搭建Node.js(Express)用户注册、登录以及授权的方法
2019/05/09 Javascript
Python使用Flask框架获取当前查询参数的方法
2015/03/21 Python
Python 创建子进程模块subprocess详解
2015/04/08 Python
Python中文竖排显示的方法
2015/07/28 Python
python处理xml文件的方法小结
2017/05/02 Python
python判断设备是否联网的方法
2018/06/29 Python
Python 窗体(tkinter)按钮 位置实例
2019/06/13 Python
python 经典数字滤波实例
2019/12/16 Python
Python自动发送和收取邮件的方法
2020/08/12 Python
巴基斯坦购物网站:Goto
2019/03/11 全球购物
房地产销售大学生自我评价分享
2013/11/11 职场文书
国贸专业个人求职信范文
2014/01/08 职场文书
查环查孕证明
2014/01/10 职场文书
五水共治捐款倡议书
2014/05/14 职场文书
2015国庆66周年宣传语
2015/07/14 职场文书
如何用Navicat操作MySQL
2021/05/12 MySQL
Pytorch中expand()的使用(扩展某个维度)
2022/07/15 Python
win10蓝屏0xc0000001安全模式进不了怎么办?win10出现0xc0000001的解决方法
2022/08/05 数码科技