学好WEB前端之javascript规范

JavaScript 是一门弱类型语言，正因如此导致写法五花八门，这里整理了一些在编写代码时需要注意的事项

通用规范

文件编码

为了避免内容乱码，统一使用 UTF-8 编码保存。

在文件结尾处，保留一个空行。

代码检测

开启 eslint 代码规范和错误检查。

在严格模式模式下编码

'use strict';

类型规范

• js 数据类型有 string、number、boolean、null、undefined、array、function 和 object 这几种，不同数据类型有不同的存储方式，也对应有不用的使用方法，对于数据赋值要注意以下几点

  • 初始值类型要明确
  • 不要随意变换类型

• 类型检测优先使用 typeof。对象类型检测使用 instanceof。null 或 undefined 的检测使用 == null。

• 字符串开头和结束使用单引号 '...string...'

命名规范

• 变量命名采用小驼峰命名，如:addUser password studentID

• 常量命名采用单词所有字母大写,并用下划线分隔，如：FORM_NAME

• 对于对象、函数、和实例采用小驼峰（camelCase）命名法

  // 对象
  let isObject = {};
  // 函数
  function isFun(){
   ...
  };
  // 实例
  let myBbj = new Object();
  
  

• 对于类命名或者构造函数，采用大驼峰命名 User() DateBase()

  // 类
  class Point {
    ...
  };
  
  // 构造函数
  function User(options) {
    this.name = options.name;
  }
  
  let myBbj = new User({
    name: 'yup'
  });
  
  

代码规范

缩进

统一使用两个空格缩进，不推荐使用 tap 缩进。

引号

统一使用单引号。

换行

每个独立语句结束后必须换行。

分号

不得省略语句结束的分号

代码块

使用花括号包裹所有的多行代码块。

单行 if 语句也必须使用花括号括住

// 推荐
if (true) {
  // TODO ...
}

// 不推荐
if (true) // TODO ...

使用全等符号

在等号表达式中使用类型严格的 ===和!==。使用 === 可以避免等于判断中隐式的类型转换。

// 推荐
if (age === 30) {
  // ......
}

// 不推荐
if (age == 30) {
  // ......
}

注释规范

单行注释

使用 // 作为单行注释。在评论对象上面另起一行使用单行注释。在注释内容前插入一个空格。

// 单行注释

多行注释

以/*开头，*/结尾，注释内容前后加一个空格

/*
 * 第一行注释
 * 第二行注释
 */

/* 另外一种写法 */

方法注释

函数(方法)注释也是多行注释的一种，但是包含了特殊的注释要求，关键方法必须加注释。

/**
 * 方法功能描述
 * @param {*} 参数
 * @param {*} 参数
 * @param {*} 参数
 * @param {*} 参数
 * @return 返回值
 */

TODO 注释

使用 // TODO: 标注问题的解决方式。

function Calculator() {
  // TODO: total should be configurable by an options param
}

如果有想一起学习web前端，想制作酷炫的网页，可以来一下我的前端群：731771211，从最基础的HTML+CSS+JavaScript【炫酷特效，游戏，插件封装，设计模式】到移动端HTML5的项目实战的学习资料都有整理好友都会在里面交流，分享一些学习的方法和需要注意的小细节，每天也会准时的讲一些前端的项目实战，及免费前端直播课程学习