合理使用前端开发工具来避免不必要的错误

前端开发工作中，难免会因为自身的一些粗心大意而照成一些错误，比如说 单词拼写、路径引用、符号写错等等，对于这些问题往往自己很难发现，然而通过给前端IDE添加插件是可以解决的。

   

顺便总结一下常见代码问题（待更新）：

     1. json和数组为空判断（不要直接判断是否为空）

1 //json 2 var a = {}; 3 a && Object.keys(a).length 4 //array，特别是接口返回数组数据时不要直接判断其长度 5 var a = []; 6 a && a.length

　　2. undefined 和 null需要同时判断，严格区分的时候

var a; var b = null; a === undefined b === null

　　3. if判断只写一个“=”号，导致变量再判断时直接被赋值　　4. 文件命名和文件引用，单词拼写不一致，导致编译无法通过　　5. 函数、变量引用时，单词多/少个字母　　6. 函数、变量定义使用关键字或保留字　　7. 缩进未统一，和其他开人员不一致，当启用代码检查后，导致构建失败　　8. 变量连等定义

1 var a = b = 0; 2 //等同于 3 var a = 0; 4 window.b = 0; 5 //当b改变时，a并没有改变

　　9. 避免在变量声明之前引用变量（变量申明提升）　　10. 函数调用时漏传参数　　11. 组件（比如vue、reactjs）生命周期结束时未卸载绑定的事件  

实用插件

　　1. emmet语法提示，提高代码开发效率　　2. 特殊文件（如less、sass、jade、jsx、vue等）高亮，方便阅读，提高代码可读性、可维护性　　3. **代码检查**（htmlhint，jshint、csslint、sasshints等），可严格按照代码规范进行实时检查并提示　　4. **获取当前文件的相对路径**，可快速复制路径    　　1) sublime text3 -> "Copy Relative Path"    　　2) brackets      -> "Get Current File Path"　　　　5. 代码格式化，格式化不规范代码　　6. 缩进辅助线，提高代码的清晰度   　　7. 图片hover显示   　　 1) sublime text3 -> "hover image preview"    　　2) brackets      -> "Inline Image CSS or HTML Image Tag"　　8. 代码提示(原生js、第三方库)

 

转载于:https://www.cnblogs.com/d-xs/p/6926119.html

相关资源：JAVA上百实例源码以及开源项目