Javascript编码规范

Posted 2022-01-10 hrrm

一个人的一生应该是这样度过的：当他回首往事的时候，他不会因为虚度年华而悔恨，也不会因为碌碌无为而羞耻；这样，在临死的时候，他就能够说：“我的整个生命和全部精力都已经献给世界上最壮丽的事业——为人类的解放而斗争。” ——《钢铁是怎样炼成的》

作为一名程序开发人员，我觉得规范和良好的编码习惯有非常有必要的。每次看到不规范的编码，总是忍不住想动手改过来。所以就想着写一篇js编码规范的文章，一来方便自己不断总结，二是希望有不足的地方能被指正。

• 变量名

变量名使用驼峰法（camelCase）命名

var firstName = 'Tom';  // 推荐
var firstname = 'Tom';  // 不推荐
var Firstname = 'Tom';  // 不推荐

尽量用let取代var，如果可以用const代替let
const用来定义常量
命名语义化，变量是名词，函数是动词

let username = 'Jack';  // 推荐
let sayHello = 'hello';  // 不推荐

function username()           // 不推荐
    alert('my name is Jack');

function sayHello()           // 推荐
    alert('hello world');

• 空格与运算符

运算符前后留一个空格

let x = a + b;  // 推荐
for (let i = 0; i <= 10; i++)     // 推荐
    console.log(i);

for (let i=0;i<=10;i++)     // 不推荐
    console.log(i);

let y=c+d;  // 不推荐

• 语句规则
  一条语句通常以分号作为结束符

let list = ['a', 'b', 'c'];
const Person = 
    firstName: "John",
    lastName: "Doe",
    age: 50,
    eyeColor: "blue"
;

复杂语句规则：

• 将左花括号放在第一行的结尾。
• 左花括号前添加一空格。
• 将右花括号独立放在一行。
• 不要以分号结束一个复杂的声明。

// 函数
function toCelsius(fahrenheit) 
    return (5 / 9) * (fahrenheit - 32);


// 循环
for (i = 0; i < 5; i++) 
    x += i;


// 条件语句
if (time < 20) 
    greeting = "Good day";
 else 
    greeting = "Good evening";

• 判断
  尽量使用精确判断

name === 'Tom'    // 推荐
code !== '200'    // 推荐
name == 'Tom'    // 不推荐
code != '200'    // 不推荐

• 字符串
  静态字符串使用反引号或单引号，不使用双引号。动态字符串使用反引号

// bad
const a = "foobar";
const b = 'foo' + a + 'bar';

// acceptable
const c = `foobar`;

// good
const a = 'foobar';
const b = `foo$abar`;

• 使用箭头函数

对一些简单的函数使用箭头函数替代

setTimeout(() => 
    alert('hello');
, 1000)

使用箭头函数绑定this

const _this = this;
const sayHello = function() 
    return _this.a;


// 使用箭头函数替代
const sayHello = () => ( this.a )

• 构造函数和类名首字母大写

function Person() 
    ...


class Person() 
  ...

尽量使用class

更多关于ES6的编程风格：http://es6.ruanyifeng.com/#docs/style
菜鸟教程javascript编码规范：https://www.runoob.com/w3cnote/javascript-coding-standard.html