《编写可维护的 JavaScript》编程风格 - 第 4 章变量、函数、运算符

电玩女神 2022-10-12 04:11 153阅读 0赞

# 编程风格 - 第 4 章 变量、函数、运算符 #

> 《编写可维护的 JavaScript》—— Nicholas C. Zakas

JavaScript 编程的本质是编写一个个函数来完成任务。

在函数内部，变量和运算符可以通过移动、操作字节来使某件事发生。

关注如何使用函数、变量、运算符来减少复杂度和增强可读性就显得十分重要。

## 1. 变量声明 ##

用 `var` 声明的变量会提前到函数顶部。

变量声明提前意味着：在函数内部任意地方定义变量和在函数顶部定义变量是完全一样的。

建议将所有的局部变量的定义作为函数内第一条语句。

## 2. 函数声明 ##

函数声明也会提前。

推荐先声明函数再使用。

此外，函数声明不应当出现在语句块之内，如下

if (true) {
        
      function doSomething() {
        
        alert('Hi!');
      }
    } else {
        
      function doSomething() {
        
        alert('Hello!');
      }
    }

大多数浏览器会使用第二个声明，Firefox 会根据条件判断使用第一个声明。

## 3. 函数调用间隔 ##

一般情况下，对于函数调用写法推荐的风格是：在函数名和左括号之间没有空格。  
这样做是为了将它和块语句区分开来。

// 好的写法
    doSomething(item);
    
    // 不好的写法
    doSomething (item);
    
    // 块语句
    while (item) {
        
      // ...
    }

## 4. 立即调用的函数 ##

JavaScript 中允许声明匿名函数（没有命名的函数），并将匿名函数赋值给变量或属性。

var doSomething = function() {
        
      // ...
    }

这种匿名函数可以在最后加一对圆括号来立即执行并返回一个值，然后将这个返回值赋值给变量。

// 不好的写法
    var value = function() {
        
      return 100;
    }();

这种模式的问题在于会让人误以为将一个匿名函数赋值了这个变量。  
除非看到最后一行的那对圆括号，否则你不会知道是将函数赋值给变量，还是将函数的执行结果赋值给变量。  
这种困惑会影响代码的可读性。

为了一眼就能看出是立即执行的函数，可以将它用一对圆括号整个包起来。

// 好的写法
    var value = (function() {
        
      return 100;
    }());

## 5. 严格模式 ##

ES5 引入了严格模式（strict mode），希望通过这种方式来谨慎地解析执行 JavaScript，以减少错误。

'use strict';

尽管看起来像一个没有赋值给变量的字符串，但 ES5 JavaScript 引擎会将其识别为一条指令，以严格模式来解析代码。

这条编译指令（pragma）不仅用于全局，也适用于局部（如函数内）。

不建议将 `use strict` 用在全局作用域，这会让文件中的所有代码都以严格模式来解析。  
如果将 10 个文件合并为一个文件时，当其中一个文件在全局作用域使用了 `use strict`，则所有代码都将以严格模式解析。

由于严格模式中的运算规则和非严格模式下的情形有很大不同，  
因此其他文件中的（非严格模式下）代码很可能会报错。

## 6. 相等 ##

由于 JavaScript 具有强制类型转换机制，使用 `==` 或 `!=` 会产生意料之外的结果，如下

5 == '5'; // true
    
    1 == true; // true
    0 == false; // true
    
    null == undefined; // true

推荐使用 `===` 或 `!==`

### 6.1. `eval()` ###

`eval()` 可以将传入的字符串当做代码来执行，  
使用 `Function` 构造函数、`setTimeout()`、`setInterval()` 也可以将字符串当做代码来执行。

一个通用的原则是，  
严禁使用 `Function`，只有在万不得已的情况下使用 `eval()`，往 `setTimeout()` 里传入函数而非字符串。

### 6.2. 原始包装类型 ###

JavaScript 有 3 种原始包装类型：`String`、`Boolean`、`Number`。

var name = 'Nicholas';
    console.log(name.toUpperCase());

`name` 是一个字符串，是原始类型而不是对象，但可以使用 `toUpperCase()` 之类的方法，即将字符串当做对象来对待。

这行代码的背后 JavaScript 引擎创建了 `String` 类型的新实例，调用完方法后就销毁掉了。

推荐避免使用包装类型。  
开发者的思路常常会在对象和原始值之间跳来跳去，这样会增加 bug 的概率，从而使开发者陷入困惑。

发表评论取消回复

表情：

评论列表（有 0 条评论，153人围观）

还没有评论，来说两句吧...

相关阅读

相关《编写可维护的 JavaScript》编程实践 - 第 12 章浏览器嗅探

编程实践 - 第 12 章浏览器嗅探 > 《编写可维护的 JavaScript》—— Nicholas C. Zakas 浏览器嗅探在 Web 开发领域始终是个热点话

妖狐艹你老母/ 2022年10月19日 05:38/ 0 赞/ 153 阅读

相关《编写可维护的 JavaScript》编程实践 - 第 9 章分离可配置的数据

编程实践 - 第 9 章分离可配置的数据 > 《编写可维护的 JavaScript》—— Nicholas C. Zakas 代码无非是定义一些指令的集合，让计算机来

梦里梦外;/ 2022年10月13日 02:39/ 0 赞/ 148 阅读

相关《编写可维护的 JavaScript》编程实践 - 第 8 章避免“空比较”

编程实践 - 第 8 章避免“空比较” > 《编写可维护的 JavaScript》—— Nicholas C. Zakas 在 JavaScript 中，我们常常会看

港控/mmm°/ 2022年10月12日 12:29/ 0 赞/ 121 阅读

相关《编写可维护的 JavaScript》编程实践 - 第 7 章事件处理

编程实践 - 第 7 章事件处理 > 《编写可维护的 JavaScript》—— Nicholas C. Zakas 在所有 JavaScript 应用中事件处理都非

╰半夏微凉°/ 2022年10月12日 12:17/ 0 赞/ 164 阅读

相关《编写可维护的 JavaScript》编程实践 - 第 6 章避免使用全局变量

编程实践 - 第 6 章避免使用全局变量 > 《编写可维护的 JavaScript》—— Nicholas C. Zakas JavaScript 执行环境在很多方面

水深无声/ 2022年10月12日 05:51/ 0 赞/ 166 阅读

相关《编写可维护的 JavaScript》编程风格 - 第 4 章变量、函数、运算符

编程风格 - 第 4 章变量、函数、运算符 > 《编写可维护的 JavaScript》—— Nicholas C. Zakas JavaScript 编程的本质是编写

电玩女神/ 2022年10月12日 04:11/ 0 赞/ 153 阅读

相关《编写可维护的 JavaScript》编程风格 - 第 3 章语句和表达式

编程风格 - 第 3 章语句和表达式 > 《编写可维护的 JavaScript》—— Nicholas C. Zakas 所有的块语句(block statement

冷不防/ 2022年10月12日 01:48/ 0 赞/ 140 阅读

相关《编写可维护的 JavaScript》编程风格 - 第 2 章注释

编程风格 - 第 2 章注释 > 《编写可维护的 JavaScript》—— Nicholas C. Zakas 打开一个没有任何注释的文件就好像趣味冒险，但如果给你

青旅半醒/ 2022年10月12日 00:44/ 0 赞/ 145 阅读

相关《编写可维护的 JavaScript》编程风格 - 第 1 章基本的格式化

编程风格 - 第 1 章基本的格式化 > 《编写可维护的 JavaScript》—— Nicholas C. Zakas 编程风格指南的核心是基本的格式化规则（for

Bertha 。/ 2022年10月11日 13:31/ 0 赞/ 160 阅读

相关《编写可维护的 JavaScript》第一部分编程风格

第一部分编程风格 > 《编写可维护的 JavaScript》—— Nicholas C. Zakas 程序是写给人读的，只是偶尔让计算机执行以下。编程嗜好：每

骑猪看日落/ 2022年10月11日 01:17/ 0 赞/ 200 阅读