导读:代码风格,不仅仅是个性的体现,更有利于你的成果的传播。是的,如果你甘愿做一个劳动者,而非共享多赢,那么不用管。
可以先看看这2篇文章,阮一峰的日志,Crockford's coding style,简单罗列了一下我当前接受的并加入自己的见解:
1 表示区块起首的大括号,不要另起一行。不管是毛语言,我都这么做了。
2 调用函数的时候,函数名与左括号之间没有空格。
3 函数声明时,函数名和参数列表之间,没有空格。以上这2点,至于原因,那是由于() 的作用导致的,没办法,程序员除了踏实,有时很固执。
4 永远略句末的分号,它并不会占用你多少空间。说实话,最看不惯没有;的js代码,每读完一句,都感觉心里欠欠的不完整。
5 不要使用with。而且,with只是好看少写了代码,效率是低的。
6 只是用 === 和 !== ,而不要使用 == 和 !=。似乎有些偏执,但是,由于==的类型自动转换,避免人脑计算的失误。
7 不要多等赋值,乱合并。不要搞基哦,嘻嘻。
8 在使用函数前定义它,变量在函数头部声明。因为js是块级解释语言。这还会和效率有关。
9 new和object.create。在使用OO和效率之间,一种难言的平衡。我还不知道如何取舍。new效率低。
10 吹毛求疵一下,每行代码不要超过4/5你的屏幕——现在程序员的屏幕通常都是17‘、19’(我预计下半年自己配一个22‘的,小愿望)。
11 给自己的js文件(通常做法就是放置在外部单独的js文件)加上版本号,或是时间,或是你自己喜好的做法,方便强制更新客户端。
12 使用单行注释于解释行后。至少这是我现在的做法,自我感觉良好。
13 讨厌使用$在变量命名开始,让我和PHP混淆。当然了,如果是故意这么做,那也没办法。
14 使用 var obj = {}; 不要使用new。(和第9点,反正我是没用那个create)
15 使用 var foo = function () { }; 定义函数,不要使用function foo(){}; 。这和js代码解释器的解释顺序有关,用时前声明、执行。
下面是我上个月加班时候写的一个js文件,
$(function() { (function() { var mkey_login = { check: function(eid) { var ret = true; if ("" == $("#" + eid).val()) { mkey_login._show_err(eid, "blank"); ret = false; } return ret; }, _show_err: function(who, type) { var err = $("#msg"); if ("blank" == type) { switch (who) { case "ppt": err.html("").html("通行证不能为空"); break; case "pwd": err.html("").html("密码不能为空"); break; case "xyz": err.html("").html("验证码不能为空"); break; } } else if ("fuckyou" == type) { err.html("").html("抱歉,绑定功能暂停!"); } else if ("wrong" == type) { err.html("").html("用户名或密码错误"); } else if ("record" == type) { err.html("").html("(*^__^*) 您已经绑定了"); } else if ("xyz_err" == type) { err.html("").html("验证码错误"); } else if ("not_b_m" == type) { err.html("").html("您还未绑定手机"); } else if ("no_right" == type) { err.html("").html("您无此次体验资格"); } else { err.html(""); } }, success: function(ret) { $("#before_login").hide(100); $("#after_login").show(100); $("#mkey").html("").html(ret['mkey']); $("#p2a").removeClass("p2bg").addClass("p2bg3"); $("#p2a2").removeClass("p2bg2").addClass("p2bg4"); }, change_code: function() { $("#_code").attr('src', 'http://zt.xoyo.com/jx3/mkey/check_login.php?type=xyz&' + Math.random()); }, submit: function() { if (mkey_login.check("ppt") && mkey_login.check("pwd") && mkey_login.check("xyz")) { var ppt = $("#ppt").val(); var pwd = $("#pwd").val(); var xyz = $("#xyz").val(); $.ajax({ type: "POST", url: "check_login.php?type=login", data: "ppt=" + ppt + "&pwd=" + pwd + "&xyz=" + xyz, dataType: "json", success: function(ret) { if ("s" == ret['flag']) { mkey_login._show_err("", ""); // 置空错误信息提示 mkey_login.success(ret); } else if ("fuckyou" == ret['flag']) { mkey_login._show_err("", "fuckyou"); mkey_login.change_code(); } else if ("x" == ret['flag']) { mkey_login._show_err("", "xyz_err"); mkey_login.change_code(); } else if ("n" == ret['flag']) { mkey_login._show_err("", "not_b_m"); mkey_login.change_code(); } else if ("a" == ret['flag']) { mkey_login._show_err("", "record"); mkey_login.change_code(); } else if ("w" == ret['flag']) { mkey_login._show_err("", "wrong"); mkey_login.change_code(); } else if ("f" == ret['flag']) { mkey_login._show_err("", "no_right"); mkey_login.change_code(); } else { mkey_login._show_err("", ""); mkey_login.change_code(); } } }); } } }; var mkey_bind = { check: function() { var ret = true; var code = $(".c-code").val(); var sn = $(".c-sn").val(); var ua = confirm("请您确认:\n您所填写的“序列号“:玲珑密保锁(客户端)显示的不会随时间更换的“7”位数字串(在客户端底部的小号字体),“动态密码”:玲珑密保锁(客户端)显示的随时间每30秒更换一次的大号字体的“6”位数字串(在客户端中部的大号字体)。\n确认无误后点击【确认】按钮,重填点击【取消】按钮。"); if (ua) { if (sn.length < 7 || sn.length > 12 || code.length != 6) { alert("温馨提示:\n请正确填写客户端显示的动态密码(6位数字,左边输入框)和序列号(7位数字,右边输入框)"); ret = false; } } return ret; }, success: function() { $('form').remove(); $(".bind").append("<p style='font-size:16px;font-weight:bolder;color:#D7FB19; margin-top:6px'>(*^__^*) 恭喜您,绑定成功!</p>"); }, bind: function() { if (mkey_bind.check()) { var code = $(".c-code").val(); var sn = $(".c-sn").val(); var mkey = $("#mkey").text(); $.ajax({ type: "POST", url: "do_bind.php?mkey=" + mkey, data: "sn=" + sn + "&code=" + code, success: function(ret) { console.log(ret); if ("s" == ret) { mkey_bind.success(); } else if ("b" == ret) { alert("温馨提示:\n请重新输入正确的动态密码,然后重新点击按钮【绑定】"); } else if ("r" == ret) { alert("温馨提示:\n绑定失败,请重新点击按钮【绑定】"); } else if ("i" == ret) { alert("温馨提示:\n请重新输入正确的序列号,然后重新点击按钮【绑定】"); } else if ("h" == ret) { alert("温馨提示:\n您已经绑定过了"); } else { alert("温馨提示:\n绑定失败,请重新点击按钮【绑定】"); } } }); } } }; $("#s_btn").bind("click", function() { mkey_login.submit(); }); $(".b-sub").bind("click", function() { mkey_bind.bind(); }); $("#_code").bind("click", function() { $(this).attr('src', 'http://zt.xoyo.com/jx3/mkey/check_login.php?type=xyz&' + Math.random()); }); $("#change_code").bind("click", function() { $("#_code").attr('src', 'http://zt.xoyo.com/jx3/mkey/check_login.php?type=xyz&' + Math.random()); }); })(); });
唉,不堪回首:如何改进呢?