2018-10-10 18:03:03 -04:00
|
|
|
---
|
|
|
|
id: 587d7b87367417b2b2512b3f
|
2021-03-14 21:20:39 -06:00
|
|
|
title: 探索 var 和 let 关键字之间的差异
|
2018-10-10 18:03:03 -04:00
|
|
|
challengeType: 1
|
2020-08-04 15:13:35 +08:00
|
|
|
forumTopicId: 301202
|
2021-01-13 03:31:00 +01:00
|
|
|
dashedName: explore-differences-between-the-var-and-let-keywords
|
2018-10-10 18:03:03 -04:00
|
|
|
---
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
# --description--
|
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
使用 `var` 关键字声明变量的最大问题之一是你可以轻松覆盖变量声明:
|
2020-08-04 15:13:35 +08:00
|
|
|
|
|
|
|
```js
|
2021-11-06 08:56:52 -07:00
|
|
|
var camper = "James";
|
|
|
|
var camper = "David";
|
2020-08-04 15:13:35 +08:00
|
|
|
console.log(camper);
|
|
|
|
```
|
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
在上面的代码中,`camper` 变量最初声明为 `James`,然后被覆盖为 `David`。 然后控制台显示字符串 `David`。
|
2021-03-14 21:20:39 -06:00
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
在小型应用程序中,你可能不会遇到此类问题。 但是随着你的代码库变大,你可能会意外地覆盖一个你不打算覆盖的变量。 由于此行为不会引发错误,因此搜索和修复错误变得更加困难。
|
2020-08-04 15:13:35 +08:00
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
ES6 中引入了一个名为 `let` 的关键字,这是对 JavaScript 的一次重大更新,以解决与 `var` 关键字有关的潜在问题。 你将在后面的挑战中了解其他 ES6 特性。
|
2020-08-04 15:13:35 +08:00
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
如果将上面代码中的 `var` 替换为 `let` ,则会导致错误:
|
2020-08-04 15:13:35 +08:00
|
|
|
|
|
|
|
```js
|
2021-11-06 08:56:52 -07:00
|
|
|
let camper = "James";
|
|
|
|
let camper = "David";
|
2020-08-04 15:13:35 +08:00
|
|
|
```
|
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
该错误可以在你的浏览器控制台中看到。
|
|
|
|
|
|
|
|
所以不像 `var`,当你使用 `let` 时,同名的变量只能声明一次。
|
2021-03-14 21:20:39 -06:00
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
# --instructions--
|
2018-10-10 18:03:03 -04:00
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
更新代码,使其仅使用 `let` 关键字。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
# --hints--
|
2018-10-10 18:03:03 -04:00
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
`var` 不应存在于代码中。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
```js
|
2022-02-25 00:11:18 +05:30
|
|
|
assert.notMatch(code, /var/g);
|
2018-10-10 18:03:03 -04:00
|
|
|
```
|
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
`catName` 应该是字符串 `Oliver`。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
|
|
```js
|
2022-02-25 00:11:18 +05:30
|
|
|
assert.equal(catName, 'Oliver');
|
2018-10-10 18:03:03 -04:00
|
|
|
```
|
|
|
|
|
2021-11-06 08:56:52 -07:00
|
|
|
`catSound` 应该是字符串 `Meow!`
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
|
|
```js
|
2022-02-25 00:11:18 +05:30
|
|
|
assert.equal(catSound, 'Meow!');
|
2018-10-10 18:03:03 -04:00
|
|
|
```
|
2020-08-04 15:13:35 +08:00
|
|
|
|
2021-01-13 03:31:00 +01:00
|
|
|
# --seed--
|
|
|
|
|
|
|
|
## --seed-contents--
|
|
|
|
|
|
|
|
```js
|
2021-11-06 08:56:52 -07:00
|
|
|
var catName = "Oliver";
|
|
|
|
var catSound = "Meow!";
|
2021-01-13 03:31:00 +01:00
|
|
|
```
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
# --solutions--
|
|
|
|
|
2021-01-13 03:31:00 +01:00
|
|
|
```js
|
2021-11-06 08:56:52 -07:00
|
|
|
let catName = "Oliver";
|
|
|
|
let catSound = "Meow!";
|
2021-01-13 03:31:00 +01:00
|
|
|
```
|