feat(curriculum): introduce let and const earlier (#43133)
* fix: move "Explore Differences Between..." to basic JS, update seed and tests * fix: resequence "Declare String Variables" * fix: move "Declare a Read-Only Variable..." to basic JS, update seed and tests * fix: revert changes to non-English "Explore Differences Between..." test text * fix: revert test strings, solutions, and seeds for non-English challenges * fix: update "Declare String Variables" description * fix: sync quotation marks in description and seed * fix: modify note in "Declare a Read-Only..." challenge * fix: update operator and compound assignment challenges * fix: update string challenges * fix: update array and array method challenges * fix: update function and scope challenges, resequence slightly * fix: "Word Blanks" solution * fix: add spacing to seed * fix: concatenating += challenge spacing * fix: appending variables to strings spacing * fix: find the length of a string spacing * fix: removed instances of removedFromMyArray = 0 * fix: switch challenges * fix: function argument and param spacing * fix: update counting cards, object challenges, and record collection * fix: finish rest of Basic JS section * fix: introducing else statements solution * fix: update spacing and wording * fix: update wording for const challenge * fix: update functional programming challenges * fix: intermediate algorithms and cert challenges * fix: revert some spacing and remove comments for fp challenge solutions * feat: add notes with links to moved let and const challenges in first two es6 challenges * fix: update es6 intro text * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator.md Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript.md Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions.md Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop.md Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop.md Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype.md Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/basic-javascript/declare-a-read-only-variable-with-the-const-keyword.md Co-authored-by: Shaun Hamilton <shauhami020@gmail.com> * fix: concatenating strings with plus operator seed * fix: add comments back to Declare a Read-Only Variable... seed * feat: add es6 to basic javascript redirect tests for let and const challenges * fix: revert "Concatenating Strings with Plus Operator" seed * fix: move test file to cypress/integration/learn/redirects, separate redirect tests Co-authored-by: Shaun Hamilton <shauhami020@gmail.com>
This commit is contained in:
committed by
GitHub
parent
71b555ab16
commit
bcc9beff1f
@ -0,0 +1,89 @@
|
||||
---
|
||||
id: 587d7b87367417b2b2512b41
|
||||
title: 用 const 关键字声明只读变量
|
||||
challengeType: 1
|
||||
forumTopicId: 301201
|
||||
dashedName: declare-a-read-only-variable-with-the-const-keyword
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
`let` 并不是唯一的新的声明变量的方式。 在 ES6 里面,你还可以使用 `const` 关键字来声明变量。
|
||||
|
||||
`const` 拥有 `let` 的所有优点,不同的是,通过 `const` 声明的变量是只读的。 这意味着通过 `const` 声明的变量只能被赋值一次,而不能被再次赋值。
|
||||
|
||||
```js
|
||||
const FAV_PET = "Cats";
|
||||
FAV_PET = "Dogs";
|
||||
```
|
||||
|
||||
控制台将由于给 `FAV_PET` 重新赋值而显示错误。
|
||||
|
||||
可见,尝试给用 `const` 声明的变量重新赋值会报错。 你应该使用 `const` 关键字来声明所有不打算再次赋值的变量。 这有助于避免给一个常量进行额外的再次赋值。 一个最佳实践是对所有常量的命名采用全大写字母,并在单词之间使用下划线进行分隔。
|
||||
|
||||
**注意:**通常,开发者会用大写字母作为常量标识符,用小写字母或者驼峰命名作为变量(对象或数组)标识符。 后面的挑战会涉及到在数组中使用小写变量标识符。
|
||||
|
||||
# --instructions--
|
||||
|
||||
改变以下代码,使得所有的变量都使用 `let` 或 `const` 关键词来声明。 当变量将会改变的时候使用 `let` 关键字,当变量要保持常量的时候使用 `const` 关键字。 同时,对使用 `const` 声明的变量按照最佳实践重命名,变量名中的字母应该都是大写的。
|
||||
|
||||
# --hints--
|
||||
|
||||
代码中不应有 `var`。
|
||||
|
||||
```js
|
||||
(getUserInput) => assert(!getUserInput('index').match(/var/g));
|
||||
```
|
||||
|
||||
`SENTENCE` 应该是使用 `const` 声明的常量。
|
||||
|
||||
```js
|
||||
(getUserInput) => assert(getUserInput('index').match(/(const SENTENCE)/g));
|
||||
```
|
||||
|
||||
`i` 应该是使用 `let`声明的。
|
||||
|
||||
```js
|
||||
(getUserInput) => assert(getUserInput('index').match(/(let i)/g));
|
||||
```
|
||||
|
||||
`console.log` 应该修改为用于打印 `SENTENCE` 变量。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
assert(getUserInput('index').match(/console\.log\(\s*SENTENCE\s*\)\s*;?/g));
|
||||
```
|
||||
|
||||
# --seed--
|
||||
|
||||
## --seed-contents--
|
||||
|
||||
```js
|
||||
function printManyTimes(str) {
|
||||
|
||||
// Only change code below this line
|
||||
|
||||
var sentence = str + " is cool!";
|
||||
for (var i = 0; i < str.length; i+=2) {
|
||||
console.log(sentence);
|
||||
}
|
||||
|
||||
// Only change code above this line
|
||||
|
||||
}
|
||||
printManyTimes("freeCodeCamp");
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
function printManyTimes(str) {
|
||||
|
||||
const SENTENCE = str + " is cool!";
|
||||
for (let i = 0; i < str.length; i+=2) {
|
||||
console.log(SENTENCE);
|
||||
}
|
||||
|
||||
}
|
||||
printManyTimes("freeCodeCamp");
|
||||
```
|
@ -0,0 +1,91 @@
|
||||
---
|
||||
id: 587d7b87367417b2b2512b3f
|
||||
title: 探索 var 和 let 关键字之间的差异
|
||||
challengeType: 1
|
||||
forumTopicId: 301202
|
||||
dashedName: explore-differences-between-the-var-and-let-keywords
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
使用 `var` 关键字来声明变量,会出现重复声明导致变量被覆盖却不会报错的问题。
|
||||
|
||||
```js
|
||||
var camper = 'James';
|
||||
var camper = 'David';
|
||||
console.log(camper);
|
||||
```
|
||||
|
||||
这里控制台将显示字符串 `David`。
|
||||
|
||||
在上面的代码中,`camper` 变量的初始值为 `James`,然后又被覆盖成了 `David`。 在小型的应用中,你可能不会遇到这样的问题。但是当你的代码规模变得更加庞大的时候,就可能会在不经意间覆盖了之前定义的变量。 因为这样的情况不会报错,所以搜索和修复 bug 会变得非常困难。
|
||||
在 ES6 中引入了新的关键字 `let` 来解决 `var` 关键字带来的潜在问题。 如果你在上面的代码中使用 `let` 关键字来代替 `var` 关键字,结果会是一个报错。
|
||||
|
||||
```js
|
||||
let camper = 'James';
|
||||
let camper = 'David';
|
||||
```
|
||||
|
||||
你可以在浏览器的控制台里看见这个错误。 与 `var` 不同的是,当使用 `let` 的时候,同一名字的变量只能被声明一次。 请注意 `"use strict"`。 这代表着开启了严格模式,用于检测常见的代码错误以及“不安全”的行为, 例如:
|
||||
|
||||
```js
|
||||
"use strict";
|
||||
x = 3.14;
|
||||
```
|
||||
|
||||
这将显示一个错误 `x is not defined`。
|
||||
|
||||
# --instructions--
|
||||
|
||||
请更新这段代码,只使用 `let` 关键字。
|
||||
|
||||
# --hints--
|
||||
|
||||
代码中不应有 `var`
|
||||
|
||||
```js
|
||||
(getUserInput) => assert(!getUserInput('index').match(/var/g));
|
||||
```
|
||||
|
||||
`catName` 变量的值应该为 `Oliver`
|
||||
|
||||
```js
|
||||
assert(catName === 'Oliver');
|
||||
```
|
||||
|
||||
`quote` 变量的值应该为 `Oliver says Meow!`
|
||||
|
||||
```js
|
||||
assert(quote === 'Oliver says Meow!');
|
||||
```
|
||||
|
||||
# --seed--
|
||||
|
||||
## --seed-contents--
|
||||
|
||||
```js
|
||||
var catName;
|
||||
var quote;
|
||||
function catTalk() {
|
||||
"use strict";
|
||||
|
||||
catName = "Oliver";
|
||||
quote = catName + " says Meow!";
|
||||
|
||||
}
|
||||
catTalk();
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
let catName;
|
||||
let quote;
|
||||
function catTalk() {
|
||||
'use strict';
|
||||
|
||||
catName = 'Oliver';
|
||||
quote = catName + ' says Meow!';
|
||||
}
|
||||
catTalk();
|
||||
```
|
Reference in New Issue
Block a user