JavaScript
-
可以直接取到基本类型的值，（但是在不能原生支持Symbol类型的环境中，不应该使用该类型）；复杂类型赋值获取的是引用
-
对于不会改变初始值的赋值都使用const，需要重新赋值就用let，let，const是块级作用域，var是函数级作用域
-
使用字面量创建对象，创建一个带动态属性名的对象时，用计算后属性名
const obj = {id:1,[getKey('enabled')]: true,'name'：123}; // getKey('enabled') 动态属性名；使用属性值缩写；对象的方法属性采用缩写形式，缩写放在对象生命的开始方便知道哪些属性用了缩写；对无效的标识使用引号-主观上易读，优化了代码高亮并且更容易被JavaScript引擎压缩；不要直接调用对象原型上的方法，因为在一些有问题的对象上这些方噶可能会被屏蔽掉；获取对象指定的几个属性时或对象浅拷贝是推荐使用扩展运算符； -
数组
- 用字面量赋值
- 用push代替直接向数组中添加一个值
- 用扩展运算符做数组浅拷贝
- 用扩展运算符而非
Array.from来将一个可迭代对象转换成数组 Array.from将一个类数组对象转换成一个数组，用于遍历可以避免创建一个临时数组- 在数组方法的回调函数中使用return，如果函数体由一条返回一个表达式的语句组成并且这个表达式没有副作用时可以忽略return
- 如果一个数组有多行，在数组的 【后 】前断行
-
Destructuring 结构赋值
- 用对象的解构赋值来获取和使用对象某个或多个属性值（结构保存了这些属性的临时值/引用）
- 多个返回值使用对象的结构而非数据结构，这样可以在新加属性或变换变量顺序时不会打破原有的调用
-
string
- 使用单引号
- 超过100个字符的字符串不应该使用string串联成多行，直接一行显示，被折断的字符串不易被搜索且效果差
- 用字符串模板来拼接可编程字符串，因为模板字符串更具可读性，语法简洁、字符串串插入参数
- 不要在字符串中使用eval
- 反斜线可读性差，只有在必须使用时才出现
-
function
- 用命名函数表达式而不是函数生命；因为函数声明时作用域被提升
-
箭头函数
-
类和构造函数
-
模块化
-
迭代器和生成器
- 不要使用迭代器，用JavaScript高阶函数代替for-in, for-of；数组的迭代方法（map / every / filter / forEach / find / findIndex / reduce / some …）；对象的处理方法（Object.keys / Object.values / Object.entries ）产生一个数组来遍历对象
- 现在不要使用generator兼容性不好，如果一地要用要确保 function* [name] {}
-
属性
- 访问属性时使用点符号
- 获取的属性为变量时使用[]
- 做幂运算时用** (2**10 代替 Math.pow(2,10))
-
变量
- 优先使用const let 声明变量
- 每个变量单独使用一个const 或let
- const放一起， let放一起
- 新变量放置在合理的位置，比如在需要时分配
- 不要使用连续变量分配，因为连接变量分配创建隐式全局变量 （let a=b=c=1; let只对变量a起作用，变量b,c都变成了全局变量，let a = 1; let b = a; let c = a;）
- 不要使用一元递增、递减运算符（++ --）,因为会收到自动分号插入的影响可能会导致应用程序中的值递增或递减的静默错误，用 num += 1来替代 num++
- 避免在 = 前后换行，如果语句超过最大长度，用（）将该值包裹起来再换行
- 不允许有未使用的变量
-
提升
- var 被提升，const let声明不会发生提升，且有临时作用域的概念
- 匿名函数表达式和var情况相同
- 已命名函数表达式提升它的变量名，而不是函数名或函数体
- 函数声明则提升函数名和函数体
-
比较运算符和等号
- 使用
===代替== - if 条件语句会强制转换为布尔值
- switch case 中，在 case 和default分句中使用{}创建一个块
- 三元表达式不应该嵌套，用单行表达式形式
- 避免不需要的三元表达式
- 混合操作符要放在（）中，当它们是标准的算术运算符(±*/&)且优先级显而易见时可以不用
- 使用
-
块
- 使用{}包裹多行代码
- else和if的}保持在一行
- 如果if语句都要使用return返回则else可以省略；如果if块中包含return且else if中也包含return 可以拆开成两个if判断
-
控制语句
- 当控制语句if while等太长或超出最大长度限制时可以把每个判断条件放在单独一行，逻辑运算符放在首行
- 不要用选择操作符（&&）代替控制语句
-
注释
- 多行注释使用/** …*/
- 单行注释// 放在被注释区域上方，如果注释不是在第一行就在注释前面加一个空行
- 所有注释开头加一个空格方便阅读
- 在注释前加FIXME TODO前缀，有助于其他开发人员快速理解你所指出的问题或你所建议的问题的解决方案
-
空白
- {} 前加空格
- 在控制语句if while等的() 前空一格，在函数调用和定义时，函数名和()之间不空格
- 用空格来隔开运算符
- 文件结尾空一行，避免出现多个空行
- 当出现长的方法链时换行，用点开头强调该行是一个方法的调用而不是一个新的语句
- 在一个代码块之后，下一条语句之前空一行
- () [ ] 里不要加空格, { }中要加空格
- 避免一行代码超过100个字符
- ，前避免空格，，后要空格
- 在对象属性，键值之间要有空格 const a = { b: 1, c: 2 }
- 行末不要空格
-
逗号
- 不要前置逗号
- 结尾是否要逗号看团队习惯
-
分号
- 明确的使用分号，避免JavaScript自动加分号带来的异常行为
-
类型转换和强制类型转换
- 在声明开头执行强制类型转换
- 在注释中解释为什么要使用位移运算（parseInt导致运行慢）
-
命名规则
- 让命名更加语义化
- 使用小驼峰命名对象函数实例
- 使用大驼峰命名类
- 不要使用前置或后置下划线
- 不要保存this的引用使用箭头函数或硬绑定
- 文件名应与默认导出的名称完全匹配
- 默认导出一个函数时，函数名，文件名同一
- 当导出一个构造函数、类、单例、函数库对象时使用大驼峰
- 简称或首字母缩写应该使用全部大写或全部小写
- 用全大写来定义导出的常量
-
存储器
- 不需要使用属性的访问器函数
- 不要使用JavaScript的getters/setters，因为他们会产生副作用，并且难以测试、维护和理解，如果必要可以使用getVal()/setVal()去构建
- 如果属性或方法是一个布尔值，用isVal() / hasVal()
- 可以使用 get() set()函数，但要保持一致
-
事件
- 给对象或其他传递数据时，不直接使用原始值而是通过对象包装，这样在未来需要增加或减少参数更方便
React
polyfill 是一块代码，通常是web上的JavaScript用来为旧浏览器提供它没有原生支持的较新的功能
基本原则
- 每个文件只包含一个React组件，（无状态 或 Pure组件可以一个文件中包含多个）
- 使用JSX语法
- 不要使用React.createElement方法，除非初始化APP的文件不是JSX格式
class React.createClass stateless
- 如果组件拥有内部的state或refs时，推荐使用
class extends React.Component，除非有理由使用mixin - 如果组件没有内部state或refs， 则函数组件比类组件的写法好
命名
- react组件使用.jsx扩展名
- 文件名使用帕斯卡命名，
- 引用实例采用驼峰命名
- 组件名称应该和文件名一致
声明
- 不要使用 displayName属性来命名组件，应该使用类的引用名称
对齐
- 如果组件的属性可以放在一行就保持在当前一行中，多行属性采用缩进
引号
- JSX属性都采用双引号，其他JS都使用单引号
空格
- 始终在自闭合标签前加一个空格
属性
- 属性名称始终采用小驼峰命名法
- 当属性值为true时，省略该属性的赋值
括号
- 用（）包裹多行JSX标签
标签
- 当标签没有子元素时使用自闭合标签
- 如果控件有多行属性，关闭标签要另起一行
方法
- render中事件的回调函数应该在构造函数中进行bind绑定（render方法中的bind调用每次render时都会创建一个全新的函数）
- react组件的内部方法名称不要使用下划线前缀
排序
static静态方法
constructor
getChildContext
componentWillMount
componentDidMount
componentWillReceiveProps
shouleComponentUpdate
componentWillUpdate
componentDidUpdate
componentWillUnmount
点击回调或事件回调
render函数中的getter方法
可选的render方法
render
362
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
