JS-01 书写规范
此部分内容整理自私教指导和自我体会:(持续更新...)
1.运算符左右两边留空格 (webstorm快捷键ctrl+alt+l);
2.判断值是否相等尽量用“===” 严格等于 ;
3.编程中,可有可无的变量不要有,这样代码才能精简,编程不要做多余的事情
精简 准确 细致
①比如下面这个,getsum就是一个可有可无的变量
function sum(arr) { var getsum= arr.reduce(function(prev,cur){ return prev+cur; }); return getsum; }
修改后如下,这样就省了一个变量,看着也更精简了
function sum(arr) { return arr.reduce(function(prev,cur){ return prev+cur; }); }
②尽量预存选择器,不然每次都要重新查询所有DOM,很伤
修改前:
<input type="button" value="设置样式" id="btn"> <div id="dv"></div> <script src="common.js"></script> <script> my$("btn").onclick = function () { my$("dv").style.width = "200px"; my$("dv").style.height = "200px"; my$("dv").style.backgroundColor = "hotpink"; }; </script>
JS部分修改后:
<input type="button" value="设置样式" id="btn"> <div id="dv"></div> <script src="common.js"></script> <script> var oDv=my$("dv"); my$("btn").onclick = function () { oDv.style.width = "200px"; oDv.style.height = "200px"; oDv.style.backgroundColor = "hotpink"; }; </script>
4.当代码写完后,某个功能没有实现,浏览器也没有报错,这时先去检查该功能对应的函数有无调用,再确认代码有无写错
5. if-else语句和return的使用注意
function fizzBuzz(num) { if(num%3===0 && num%5===0){ return "fizzbuzz"; }else if(num%3===0){ return "fizz"; }else if(num%5===0){ return "buzz"; } else if(num===null||isNaN(Number(num))){ return false; }else { return num; } } //写if else会预载整个判断链,浪费,换种写法 function fizzBuzz(num) { if(num%3===0 && num%5===0){ return "fizzbuzz"; } if(num%3===0){ return "fizz"; } if(num%5===0){ return "buzz"; } if(num===null||isNaN(Number(num))){ return false; } return num; }
6.json格式的数据最后一行不加逗号,如果加了可能会报错
[ { "user" : "蜡笔小新", "email" : "xiaoxin@163.com", "date" : "2020-01-01" }, { "user" : "蜡笔中新", "email" : "xiaoxin@163.com", "date" : "2020-01-01" }, { "user" : "蜡笔大新", "email" : "xiaoxin@163.com", "date" : "2020-01-01" } ]
持续总结分享中。。。