如何推行 JS 编码规范

@CSS魔法

2017. 09. 29

• 编码规范是什么？
• 如何落实编码规范？
• 工具与集成
• 典型规则解析

编码规范是什么？

• 统一代码风格
• 防止错误
• 促进最佳实践

编码规范的 “目的” 是什么？

• 文档
• 工具

编码规范需要包含哪些内容？

• 开发阶段
• CI 阶段 / 部署阶段

如何落实编码规范？

“JSLint will hurt your feelings.”

—— www.jslint.com

1. 编写文档
2. 部署工具
3. 达成一致

如何落实编码规范？

如何设计一套可落地的编码规范？

• 简单、易用
• 务实

• 考虑现状（既有代码、写法、人）
• 不挑起无意义的争论

• 要么过，要么不过
• 尽可能宽松
• 不关心代码风格
• 只关心 “可能有问题” 的代码

设计思路：

工具与集成

• JSLint
• JSHint
• JSCS
• ESLint

常见的 JS 校验工具：

• CLI
• IDE 插件 / 内置
• Gulp: gulp-eslint
• Webpack: eslint-loader

ESLint 如何集成到现有工作流？

如何设置 CLI ？

如何设置 IDE ？

如何设置 IDE ？

典型规则解析

• no-undef

• eqeqeq

• no-use-before-define

• no-loop-func

• no-extra-boolean-cast
• no-constant-condition
• no-implicit-coercion
• no-used-expressions
• curly

最容易撞的线：

Q & A

Thank You!