JS代码规范
JS代码规范
空格
二元运算符两侧必须有一个空格,一元运算符与操作对象之间不允许有空格。
var a = !arr.length;
a++;
a = b + c;
复制代码
用作代码块起始的左花括号 { 前必须有一个空格。
// good
if (condition) {
}
function funcName() {
}
// bad
if (condition){
}
function funcName(){
}
复制代码
if / else / for / while / function / switch / do / try / catch / finally 关键字后,必须有一个空格。
// good
if (condition) {
}
while (condition) {
}
(function () {
})();
// bad
if(condition) {
}
while(condition) {
}
(function() {
})();
复制代码
在对象创建时,属性中的 : 之后必须有空格,: 之前不允许有空格。
// good
var obj = {
a: 1,
b: 2,
c: 3
};
// bad
var obj = {
a : 1,
b:2,
c :3
};
复制代码
函数声明、具名函数表达式、函数调用中,函数名和 ( 之间不允许有空格。
// good
function funcName() {
}
var funcName = function funcName() {
};
funcName();
// bad
function funcName () {
}
var funcName = function funcName () {
};
funcName ();
复制代码
, 和 ; 前不允许有空格。
// good
callFunc(a, b);
// bad
callFunc(a , b) ;
复制代码
单行声明的数组与对象,如果包含元素,{} 和 [] 内紧贴括号部分不允许包含空格。
// good
var arr1 = [];
var arr2 = [1, 2, 3];
var obj1 = {};
var obj2 = {name: 'obj'};
var obj3 = {
name: 'obj',
age: 20,
sex: 1
};
// bad
var arr1 = [ ];
var arr2 = [ 1, 2, 3 ];
var obj1 = { };
var obj2 = { name: 'obj' };
var obj3 = {name: 'obj', age: 20, sex: 1};
复制代码
行尾不得有多余的空格。
换行
每个独立语句结束后必须换行。
运算符处换行时,运算符必须在新行的行首。
// good
if (user.isAuthenticated()
&& user.isInRole('admin')
&& user.hasAuthority('add-admin')
|| user.hasAuthority('delete-admin')
) {
// Code
}
var result = number1 + number2 + number3
+ number4 + number5;
// bad
if (user.isAuthenticated() &&
user.isInRole('admin') &&
user.hasAuthority('add-admin') ||
user.hasAuthority('delete-admin')) {
// Code
}
var result = number1 + number2 + number3 +
number4 + number5;
复制代码
对于 if...else...、try...catch...finally 等语句,推荐使用在 } 号后添加一个换行 的风格,使代码层次结构更清晰,阅读性更好。
if (condition) {
// some statements;
}
else {
// some statements;
}
try {
// some statements;
}
catch (ex) {
// some statements;
}
复制代码
语句
在 if / else / for / do / while 语句中,即使只有一行,也不得省略块 {...}。
// good
if (condition) {
callFunc();
}
// bad
if (condition) callFunc();
if (condition)
callFunc();
复制代码
函数定义结束不允许添加分号。
// good
function funcName() {
}
// bad
function funcName() {
};
// 如果是函数表达式,分号是不允许省略的。
var funcName = function () {
};
复制代码
命名
注* :
Camel命名法:驼峰命名法如 myFirstName
Pascal命名法:帕斯卡命名法如 FirstName、LastName
变量 使用 Camel命名法。
var loadingModules = {};
复制代码
常量 使用 全部字母大写,单词间下划线分隔 的命名方式。
var HTML_ENTITY = {};
复制代码
函数 使用 Camel命名法。
function stringFormat(source) {
}
复制代码
函数的 参数 使用 Camel命名法。
function hear(theBells) {
}
复制代码
类 使用 Pascal命名法。
function TextNode(options) {
}
复制代码
类的 方法 / 属性 使用 Camel命名法。
function TextNode(value, engine) {
this.value = value;
this.engine = engine;
}
TextNode.prototype.clone = function () {
return this;
};
复制代码
原著GitHub地址 : styleguide
转载于:https://juejin.im/post/5cac1259f265da0360238de1
JS代码规范的更多相关文章
- JavaScript必备:Google发布的JS代码规范(转)
[翻译]关于Google发布的JS代码规范,你需要了解什么? 翻译 | WhiteYin 译文 | https://github.com/WhiteYin/translation/issues/10 ...
- 谷歌与Airbnb的JS代码规范
谷歌JS代码规范 规范代码原因:代码规范是为了保持源代码编写模式一致,便于维护代码,可读性高. 1.使用空格代替tab 规范随后指出应该使用2个,而不是4个空格带实现缩进.(除了每一行的终止符序列,A ...
- 前端规范之JS代码规范(ESLint + Prettier)
代码规范是软件开发领域经久不衰的话题,几乎所有工程师在开发过程中都会遇到或思考过这一问题.而随着前端应用的大型化和复杂化,越来越多的前端团队也开始重视代码规范.同样,前段时间,笔者所在的团队也开展了一 ...
- 浅谈js代码规范
要放假了 后天就可以 回家,心里很高兴,忙里偷闲写篇博客吧!!!! 声明:这是我自己总结的,如果有不对的地方请大家不要较真 一 .变量声明 对所有的变量声明,我们都应该指定var,如果没有指定var ...
- dataway_代码规范
无论何时无论何地,只要写代码,请遵从这样的规范. ----------------------------------------------------------------- css代码规范. ...
- 也谈谈规范JS代码的几个注意点
也谈谈规范JS代码的几个注意点 写JS代码差不多也有两年了吧,从刚开始的“初生牛犊不怕虎”乱写一通到后来也慢慢知道去规范一下自己写的代码.这种感觉就像是代码是你的作品,你希望它保持一份不仅干净而且也优 ...
- 代码规范和常用的js插件以及测试工具
1.代码规范 .model层 1.1.1database file_proerty 1.1.2java fileProperty. 1.2.字段要有空指针 1.3.不创建爱数据库外键约束 1.4.已知 ...
- js学习笔记-编写高效、规范的js代码-Tom
编写高效.规范的js代码: 1.变量命名空间问题,尽量使用局部变量,防止命名冲突(污染作用域中的全局变量):全局空间命名的变量可以在对应的文档域任意位置中使用window调用. 2.尽量使用单var定 ...
- JS代码的几个注意点规范
也谈谈规范JS代码的几个注意点 也谈谈规范JS代码的几个注意点 写JS代码差不多也有两年了吧,从刚开始的“初生牛犊不怕虎”乱写一通到后来也慢慢知道去规范一下自己写的代码.这种感觉就像是代码是你的作品, ...
随机推荐
- php数据库应用程序建议
一.保持独立的读写连接 开始就创建两个数据库连接是一个好的方法,一个用于读取,一个用于写入,并且允许不同的数据库服务器连接他们.如果只有一个服务器,则将它们设置彼此相同. 当操作为INSERT, UP ...
- android的volley学习
更简单的一种方式是在build.gradle中引入依赖[推荐这种方式] compile 'com.android.volley:volley:1.1.1' StringRequest的用法接下来我们看 ...
- css3新的选择器
CSS3新的选择器 ele[att^="val"] /*属性att的值以val开头的元素*/ ele[att$="val"] /*属性att的值以val结尾的元 ...
- javascript 入门 之 bootstrap 第一个程序
<table data-toggle="table"> <thead> <tr> <th>Item ID</th> &l ...
- scala_spark实践1
/** * scala模型的main(args:Array[String])是业务执行入口 * org.apache.spark.{SparkConf, SparkContext} * val spa ...
- Blazor WebAssembly 3.2.0 Preview 4 如期发布
ASP.NET团队如期3.16在官方博客发布了 Blazor WebAssembly 3.2.0 Preview 4:https://devblogs.microsoft.com/aspnet/bla ...
- 006-循环结构(下)-C语言笔记
006-循环结构(下)-C语言笔记 学习目标 1.[掌握]do-while循环结构 2.[掌握]for循环结构 3.[掌握]嵌套循环 一.do-while循环结构 do-while语法: 1 2 ...
- 05-移动web之流式布局
一.视口 1.常见屏幕知识 设备 解释 描述 宽 屏幕的宽度 - (单位:英寸) 屏幕的宽度 高 屏幕的高度 -(单位:英寸) 屏幕的高度 对角线 屏幕的对角线的长度 英寸 一般说手机尺寸 是指以屏幕 ...
- 利用Ajax实现异步请求
Ajax 1.课程引入 静态网站和动态网站都是同步的,但同步方式有缺点:页面请求响应式阻塞,影响用户体验 为了解决这个问题,可以通过变通的手段实现页面的局部更新(隐藏帧),由于隐藏 ...
- 【题解】P3349 [ZJOI2016]小星星 - 子集dp - 容斥
P3349 [ZJOI2016]小星星 声明:本博客所有题解都参照了网络资料或其他博客,仅为博主想加深理解而写,如有疑问欢迎与博主讨论✧。٩(ˊᗜˋ)و✧*。 题目描述 小 \(Y\) 是一个心灵手巧 ...