二十五岁时我们都一样愚蠢、多愁善感,喜欢故弄玄虚,可如果不那样的话,五十岁时也就不会如此明智。
标题:JavaScript编码习惯
你所有的JavaScript项目总是使用相同的编码习惯
JavaScript编码习惯
编码约定是编程的样式指南。他们通常包括:
- 变量和函数的命名和声明规则.
- 使用空白、缩进和注释的规则
- 编程实践与原则
编码协议安全质量:
- 提高了代码的可读性
- 使代码维护更容易
编码规则可以被记录为团队遵循的规则,或者只是你的个人编码实践
变量名
在编程字典,我们使用驼峰命名标识符(变量和函数)
所有名字以字母开头.
在这个页面的底部,你会发现关于命名规则的更广泛的讨论.
firstName = "John"; lastName = "Doe"; price = 19.90; tax = 0.20; fullPrice = price + (price * tax);
操作符周围的空格
总是在操作器周围,和逗号之后,放置空格 ( = + - * / ), :
var x = y + z; var values = ["Volvo", "Saab", "Fiat"];
代码缩进
总是使用4个空格缩进代码块:
function toCelsius(fahrenheit) { return (5 / 9) * (fahrenheit - 32); }不要使用tab缩进。不同的编辑器解释不同的tab.
语句规则
简单语句的一般规则:
- 简单语句的最后总是添加一个分号.
var values = ["Volvo", "Saab", "Fiat"]; var person = { firstName: "John", lastName: "Doe", age: 50, eyeColor: "blue" };复合语句的一般规则:
- 在第一个的末尾放左大括号
{
- 左大括号
{
前面使用一个空格- 另起一行放右括号
}
,前面没有空格.- 不要用分号结束复合语句.
function toCelsius(fahrenheit) { return (5 / 9) * (fahrenheit - 32); }for (i = 0; i < 5; i++) { x += i; }if (time < 20) { greeting = "Good day"; } else { greeting = "Good evening"; }
对象的规则
对象定义的一般规则:
- 将开括号放置在与对象名称相同的行上.
- 使用冒号加上一个空格在每个属性及其值之间.
- 字符串使用引号,数字不使用
- 在最后一个属性值对后不要添加逗号.
- 将关闭括号放置在新的一行上,无前导空格.
- 总是以分号结束一个对象定义
var person = { firstName: "John", lastName: "Doe", age: 50, eyeColor: "blue" };短的对象可以被压缩,在一行,只在属性之间使用空格,像这样:
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
行长度 < 80
出于可读性,避免超过80个字符的行.
如果一个JavaScript语句不适合在一行上,换行的地方最好,是一个操作符或一个逗号之后
document.getElementById("demo").innerHTML = "Hello Dolly.";
命名规范
始终为所有代码使用相同的命名约定。例如:
- 变量和函数的名字写成camelCase
- 全局变量用大写字母
- 常数(如PI)大写
你应该使用中划线 hyp-hens, 驼峰命名camelCase, 或者下划线under_scores命名变量?
这是程序员经常讨论的问题。答案取决于你问谁:
在HTML和CSS中使用中划线:
HTML5 属性可以使用 data- 打头 (data-quantity, data-price).
CSS 属性使用中划线 property-names (font-size).
中划线可以被误认为是减法。JavaScript中使用中划线是不允许.
下划线:
许多程序员喜欢使用下划线 (date_of_birth), 尤其是在SQL数据库中.
下划线经常使用在PHP文件中.
PascalCase命名法:
PascalCase通常是C程序员的首选.
camelCase:
JavaScript通常使用camelCase命名法, 像jQuery,和其他JavaScript库.
不要用$符号开始名称。它会使你和很多JavaScript库名称冲突.
在HTML加载JavaScript
使用简单的语法加载外部脚本 (type属性不是必需的):
<script src="myscript.js"></script>
访问HTML元素
使用"不规范的"HTML样式, 可能导致JavaScript错误.
这两个JavaScript语句会产生不同的结果:
var obj = getElementById("Demo") var obj = getElementById("demo")如果可能的话,使用相同的命名约定.
文件扩展名
HTML文件有一个.html 扩展名 (而不是 .htm).
CSS 文件有一个 .css 扩展名.
JavaScript 文件有一个 .js 扩展.
使用小写文件名
大多数Web服务器(Apache,UNIX)是关于文件名小写写敏感:
london.jpg 不能被作为 London.jpg 使用.
其他Web服务器(微软的IIS)是不区分大小写:
london.jpg 能作为 London.jpg 或者 london.jpg访问.
如果你使用大小写混合的情况下,你必须非常一致.
如果您从不敏感的情况下移动到一个区分大小写的服务器,即使是小错误也可能破坏您的网站。.
为了避免这些问题,总是使用小写文件名(如果可能的话).
性能
计算机不使用编码约定。大多数规则对程序执行的影响很小。.
在小脚本中缩进和额外空格不重要.
对于开发中的代码,可读性应该优先考虑。较大的生产脚本应该被压缩.