全文共2218字，预计学习时长7分钟

javascript条件语句的用法（小技巧在JavaScript中如何用let和const有效替换var关键字）(1)

来源：Pexels

javascript条件语句的用法（小技巧在JavaScript中如何用let和const有效替换var关键字）(2)

对`const` 和`let`的介绍

大家都始于初学者。我学到在JavaScript中用关键词var来声明变量，这是一个简单且有效的方法，但如今我已做出改变。

若你还在编写类似var x = 5的代码，那你需要停下来。说实话，你不必停止，但应该如此。

人们常常将编程语言视作视为一系列金科玉律。但事实上编程语言就像任何一个口头语言一样，是不断变化发展的。

现在我用关键词const和let在JavaScript中声明所有变量，你也应该这么做。

让我们一起学习如何且为什么要这么做。

javascript条件语句的用法（小技巧在JavaScript中如何用let和const有效替换var关键字）(3)

声明真正的常量

变量，顾名思义即变化的值。虽然声明和不接触变量并没有什么问题，但是如果想要编写具有语义的代码，则应该区分变量和常量。

常量与变量相反，是声明的不变值。历史上，人们用大写所有的字母来定义一个常数，例如有毒的动物身上的鲜艳颜色。

不用依赖惯例，const关键字的引入为人们提供了一个明确的选项，用于声明哪个值不会更改。

要使用const关键字，只需将var替换为const，就无法修改该值了。

// the old way // var sales_tax = 0.06; // the new way const sales_tax = 0.06; sales_tax = 0.08; // "TypeError: Assignment to constant variable.

实现方式非常简单，原理也非常简单。使用const甚至不用动脑，但什么时候用才合适呢？

诸如税率或单位之间的转换的数字比率可作为选择。另外还会在使用箭头符号声明函数时使用const。

const myFunction = (x,y) => { // Do stuff }myFunction(1,2)

这样函数就不会被覆盖了。

javascript条件语句的用法（小技巧在JavaScript中如何用let和const有效替换var关键字）(4)

来源：Pexels

javascript条件语句的用法（小技巧在JavaScript中如何用let和const有效替换var关键字）(5)

修复JavaScript的异常范围

JavaScript缺乏范围清晰性，常导致开发和故障排除的失败。以下是JavaScript范围异常的摘要：

· 一个变量可以使用两次var（重声明）

· 默认情况下，顶级变量是全局变量（全局对象）

· 可以在声明前使用变量（提升）

· 循环中的变量重复使用同样的引用（闭包）

使用let可以澄清和解决许多这些异常。来仔细看看吧。

重声明

这很简单，由let构成的变量是无法重声明的。

var x = 0; let y = 0; var x = 1; let y = 1; // "SyntaxError: Identifier 'y' has already been declared

全局对象

由var定义的顶级变量会作为系统属性被自动添至全局变量，但由let定义的变量就不会。

var x = 0; let y = 0; console.log(window.x); // 0 console.log(window.y); // undefined

提升

由let定义的变量只能在其块级作用域内访问，而由var定义的变量会被提升至函数级别。

// Using var console.log(i); // undefined for(var i=0; i<4; i ) { console.log(i); } console.log(i); // 4// Using let console.log(j); // "ReferenceError: j is not defined for(let j=0; j<4; j ) { console.log(j); } console.log(j); // "ReferenceError: j is not defined

闭包

如果闭包对你来说是一个新概念的话，那可能会难以理解，但是闭包是引用自由变量的函数。

当闭包中带有var时，该引用会被记住，当循环中的变量发生变化时，会造成麻烦。

var functions = [];for (var i = 0; i < 3; i ) { functions[i] = () => { console.log(i); }; } for (var j = 0; j < 3; j ) { functions[j](); }// 3 3 3

如果使用let，每次都会创建新的引用。

var functions = []; for (let i = 0; i < 3; i ) { functions[i] = () => { console.log(i); }; } for (var j = 0; j < 3; j ) { functions[j](); }// 0 1 2

说到底，即使不是100％出于这些原因以及它们为何按其工作方式工作，切换到let还将产生更明确的代码，这些代码的行为始终如一，并且更易于故障排除和维护。

javascript条件语句的用法（小技巧在JavaScript中如何用let和const有效替换var关键字）(6)

告诫

javascript条件语句的用法（小技巧在JavaScript中如何用let和const有效替换var关键字）(7)

来源：Pexels

尽管let和const应该可以有效替换var关键字，但是一切并不总是那么简单。

由于这些关键字是在ECMAScript2015（ES6）中引入的，因此，如果你使用的平台不允许使用该关键字，那就很不幸了。此外，还要确保你的代码可以在目标受众群体的浏览器中正常运行。

javascript条件语句的用法（小技巧在JavaScript中如何用let和const有效替换var关键字）(8)

留言点赞关注

我们一起分享AI学习与发展的干货

如转载，请后台留言，遵守转载规范

,