新手入门必学的JavaScript代码规范详解

编写JavaScript代码时首先要记住的是编写代码的规则。

这一次,我将介绍JavaScript常用的基本规则,例如如何在代码中插入空格和换行符以及如何编写注释。

区分大小写

JavaScript区分大写和小写字母。

以下示例是将变量“hello”打印到控制台的两种模式。

let hello = 'hello';

console.log(hello); // 'hello'

console.log(Hello); // 错误

如果你写“console.log(hello);”,“hello”将毫无问题地输出。

另一方面,如果你写“console.log(Hello);”,H是大写的,所以变量“Hello”为未定义并发生错误。

因此,在命名变量时,或者在调用已经定义好的变量名时,必须使用正确的大小写。

代码中的空格

表达式和语句包含空格和换行符。基本上可以自由地插入到表达式和句子中。

以下两个在单词“const”、“id”、“=”和“1”之间有不同大小的空格。

它们的行为与表达式完全相同,通常情况下用一个空格填充。

const id = 1; //1个空格
const   id  =  1; //2个空格

需要注意的是在单词的中间放置空格会导致错误。

const i d = 1; //错误

新手入门必学的JavaScript代码规范详解

代码换行和缩进

换行符用于块语句和长代码语句。

以下两个 if 语句含义相同,但分别用不带换行符的模式和带换行符的模式表示。

// 无换行符
if (true) console.log('Hello'); //'Hello'

// 有换行符
if (true) { 
  console.log('Hello'); // 'Hello'
}

像上面这样的简单代码可以写成没有换行符的单行格式,但是判断使用带换行符的代码块更容易阅读。

另外,换行后的行使用缩进在逻辑上表示代码。缩进请使用2或4空格或tab键。

// 2空格
if (true) {
  console.log('Hello'); // 'Hello'
}

// 4空格
if (true) {
    console.log('Hello'); // 'Hello'
}

缩进多少空间并不重要,这完全取决于个人喜好。

当你有更多机会看到各种代码时,可以找到适合自己的写作风格,或者如果你有团队项目,可以根据团队的编码规则进行更改。

即使对于单个函数,在很多情况下也可以按功能分解函数的内容。

在这种情况下,如果每一个换行都进行缩进,则层次会越来越深,可读性也会变低。因此,在不缩进的情况下,插入新行使代码更容易阅读。

function getNum() {
  let count = 0; // 有缩进
  //
  for (let i = 0; i < 5; i++) { //无缩进
    count++; //有缩进
  }
  //
  return count; //无缩进
}

console.log(getNum()); // 5

代码分隔符

在JavaScript中,分号 ; 被添加到语句的末尾以分隔语句。

let hi = 'Hi!'; //分号;

const sayHi = function() {
  console.log(hi); //分号;
}; //分号;

sayHi(); // 'Hi!'

根据编程语言的不同,如果语句末尾没有分号,严格的语言会导致错误,还有其它灵活的语言,可以自由选择是否使用分号。

在JavaScript中,如果在不带分号的情况下对语句进行了换行,则语句可能会在不希望的位置被中断。严格地说,某些例外情况下,JavaScript也可以不使用分号,但为了避免意外错误的可能性,最好对语句使用分号。

注释

在编写代码的过程中我们可以在程序中留下注释作为备忘录。你可能已经注意到我们在示例代码中使用了注释。

注释主要用于描述代码。如果你留下注释,注释的有效部分将不会被识别为程序代码。

使用“//”一次写一行注释。“//”之后到行尾的所有内容都被识别为注释。

// 一行注释
// 注释不被识别为程序代码

如果要留下多行注释,请使用“/**/”。由“/* ”和“* /”包围的部分被识别为注释。

/*
多行注释
其中的注释不被识别为程序代码
*/

你也可以注释掉已经写好的代码。

例如想暂时禁用你怀疑会导致程序发生故障的代码。此类注释称为“已注释掉”。

let hi = 'Hi!'; 

/*
  const sayHi = function() {
    console.log(hi); 
  }; 

  sayHi(); 
*/

通过注释掉疑似有问题的代码,你可以在禁用代码的同时保存代码。修复错误后,可以通过删除注释来恢复代码。

结语

本文我们学习了JavaScript中常用的基本规则。

了解基本规则不仅可以帮助我们正确编写代码,还可以帮助我们避免错误。