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代码规范的更多相关文章

  1. JavaScript必备:Google发布的JS代码规范(转)

    [翻译]关于Google发布的JS代码规范,你需要了解什么? 翻译 | WhiteYin 译文 | https://github.com/WhiteYin/translation/issues/10 ...

  2. 谷歌与Airbnb的JS代码规范

    谷歌JS代码规范 规范代码原因:代码规范是为了保持源代码编写模式一致,便于维护代码,可读性高. 1.使用空格代替tab 规范随后指出应该使用2个,而不是4个空格带实现缩进.(除了每一行的终止符序列,A ...

  3. 前端规范之JS代码规范(ESLint + Prettier)

    代码规范是软件开发领域经久不衰的话题,几乎所有工程师在开发过程中都会遇到或思考过这一问题.而随着前端应用的大型化和复杂化,越来越多的前端团队也开始重视代码规范.同样,前段时间,笔者所在的团队也开展了一 ...

  4. 浅谈js代码规范

    要放假了  后天就可以 回家,心里很高兴,忙里偷闲写篇博客吧!!!! 声明:这是我自己总结的,如果有不对的地方请大家不要较真 一 .变量声明 对所有的变量声明,我们都应该指定var,如果没有指定var ...

  5. dataway_代码规范

    无论何时无论何地,只要写代码,请遵从这样的规范. ----------------------------------------------------------------- css代码规范. ...

  6. 也谈谈规范JS代码的几个注意点

    也谈谈规范JS代码的几个注意点 写JS代码差不多也有两年了吧,从刚开始的“初生牛犊不怕虎”乱写一通到后来也慢慢知道去规范一下自己写的代码.这种感觉就像是代码是你的作品,你希望它保持一份不仅干净而且也优 ...

  7. 代码规范和常用的js插件以及测试工具

    1.代码规范 .model层 1.1.1database file_proerty 1.1.2java fileProperty. 1.2.字段要有空指针 1.3.不创建爱数据库外键约束 1.4.已知 ...

  8. js学习笔记-编写高效、规范的js代码-Tom

    编写高效.规范的js代码: 1.变量命名空间问题,尽量使用局部变量,防止命名冲突(污染作用域中的全局变量):全局空间命名的变量可以在对应的文档域任意位置中使用window调用. 2.尽量使用单var定 ...

  9. JS代码的几个注意点规范

    也谈谈规范JS代码的几个注意点 也谈谈规范JS代码的几个注意点 写JS代码差不多也有两年了吧,从刚开始的“初生牛犊不怕虎”乱写一通到后来也慢慢知道去规范一下自己写的代码.这种感觉就像是代码是你的作品, ...

随机推荐

  1. 安装elasticsearch-head(源码安装方式)

    gitHub 地址 https://github.com/mobz/elasticsearch-head 克隆到本地 进行npm 安装运行 git clone git://github.com/mob ...

  2. Spring Taco Cloud——design视图的创建(含thymeleaf模板遇到的一些小问题)

    先来看下综合前两篇内容加上本次视图的成果   可能不是很美观,因为并没有加css样式,我想等整个项目有个差不多的功能实现后再进行页面优化,请谅解 下面我贴上自己定义修改过的Taco的design视图代 ...

  3. yii2框架学习笔记

    1.去掉yii2模版默认的头部和脚部的两种方法: (1) 第一种 $this->layout = false; $this->render('index'); (2) 第二种(partia ...

  4. Java第三十三天,IO操作(续集),字符转换流

    计算机都是以二进制码格式存储文件的,但是在读写文件的过程中,每个应用程序都有自己的编码格式.FileWrite和FileRead类是通过查询系统默认码表进行读写的,因此在自己的系统上能够实现编码的智能 ...

  5. WordPress文章阅读量统计和显示(非插件, 刷新页面不累加)

    本文已同步到专业技术网站 www.sufaith.com, 该网站专注于前后端开发技术与经验分享, 包含Web开发.Nodejs.Python.Linux.IT资讯等板块. WordPress文章阅读 ...

  6. PHP中debug基本方法

    一.检查是否有语法错误 php -l test.php 二.基本调试基本调试 API: var_dump($var);print_r($var);echo $var; 基本的配置: display_e ...

  7. Google 浏览器 离线包下载方式

    最近因工作需要,需要安装google浏览器,并且安装在系统固定目录,用360软件管理下载后发现默认安装在C:\Users\administrator\AppData\Local\Google\Chro ...

  8. python3(二十六)slots

    """ """ __author__ = 'shaozhiqi' # python是动态语言,所以定义类后,我们可以动态的给类绑定属性和方法 ...

  9. 钩子函数 Function类

    Function 为 com.google.common.base包下接口类: public interface Function<F, T> { @Nullable T apply(@N ...

  10. Thinking in Java,Fourth Edition(Java 编程思想,第四版)学习笔记(二)之Introduction to Objects

    The genesis of the computer revolution was a machine. The genesis of out programming languages thus ...