最新的Web开发教程
 

JavaScript风格指南和编码约定

❮上一页 下一页章❯

始终使用您所有的JavaScript项目相同的编码约定。

JavaScript编码约定

编码约定编程风格指南 。 他们通常包括：

  • 命名和申报规则变量和函数。
  • 规则使用空格，缩进和评论。
  • 编程实践和原则

编码规范安全质量 ：

  • 提高代码的可读性
  • 使代码维护更轻松

编码约定可以记录规则，团队跟随，或者只是你个人的编程习惯。

本页面描述了w3ii使用的通用JavaScript代码约定。
你也应该阅读下一章“最佳实践”，并学会如何避免编码陷阱。

变量名

在w3ii我们使用驼峰的标识符名称（变量和函数）。

所有名称以字母开头 。

在这个页面的底部，你会发现有关命名规则的更广泛的讨论。

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);
}

不要缩进使用制表符（制表）。 不同的编辑解释标签不同。

声明规则

对于简单的语句一般规则：

  • 始终以分号结束一个简单的语句。

例子：

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.";
试一试»

命名约定

始终使用所有的代码相同的命名约定。 例如：

  • 变量和函数名写为驼峰
  • 写大写全局变量（我们不这样做，但它是很常见的）
  • 常量（如PI）写成大写

如果您使用HYP-母鸡 ， 驼峰 ，或under_scores在变量名？

这是一个问题的程序员经常讨论。 答案取决于你问谁：

连字符的HTML和CSS：

HTML5属性可以使用数据 - （数据量，数据价格）开始。

CSS使用的财产的名称（字号）连字符。

连字符可以被误认为企图减法。 连字符在JavaScript的名字不允许的。

强调：

许多程序员喜欢使用下划线（DATE_OF_BIRTH），尤其是在SQL数据库。

下划线往往PHP文档中使用。

PascalCase：

PascalCase往往是由C程序员首选。

驼峰：

驼峰是由JavaScript本身的jQuery和其他JavaScript库使用。

不要用$符号开头的名称。 这将让你在冲突中有许多JavaScript库的名称。

在HTML中加载JavaScript

使用简单的语法，用于加载外部脚本（type属性是没有必要的）：

<script src="myscript.js">

访问HTML元素

使用“凌乱”HTML样式的后果，可能会导致JavaScript错误。

这两个JavaScript语句会产生不同的结果：

var obj = getElementById("Demo")

var obj = getElementById("demo")

如果可能的话，使用HTML相同的命名约定（如JavaScript）。

访问HTML风格指南 。

文件扩展名

HTML文件应该有一个.html扩展名（不热媒 ）。

CSS文件应该有一个扩展名为.css。

JavaScript文件应该有一个.js扩展。

使用小写文件名

大多数Web服务器（Apache的，UNIX）的有关文件名大小写敏感：

london.jpg不能作为访问London.jpg 。

其他Web服务器（微软，IIS）是不区分大小写：

london.jpg可以作为被访问London.jpg或london.jpg 。

如果使用大小写混合，你必须非常一致。

如果你从一个不敏感的情况下，要区分大小写的服务器移动，甚至小错误可以打破你的网站。

为了避免这些问题，始终使用小写的文件名（如果可能）。

性能

编码约定不使用的计算机。 大多数规则对程序的执行没有什么影响。

缩进和多余的空格不小的脚本显著。

对于开发代码，可读性应该是首选。 较大的生产脚本应该精缩。


❮上一页 下一页章❯