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:
Kristofer Koishigawa
committed by
GitHub
GitHub
parent
71b555ab16
commit
bcc9beff1f
@ -1,89 +0,0 @@
|
||||
---
|
||||
id: 587d7b87367417b2b2512b41
|
||||
title: Declarar variáveis somente de leitura com a palavra-chave const
|
||||
challengeType: 1
|
||||
forumTopicId: 301201
|
||||
dashedName: declare-a-read-only-variable-with-the-const-keyword
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
A palavra-chave `let` não é a única nova forma de declarar variáveis. Na versão ES6, você também pode declarar variáveis usando a palavra-chave `const`.
|
||||
|
||||
`const` possui todos os recursos maravilhosos que `let` tem, com o bônus adicional que variáveis declaradas usando `const` são somente de leitura. Elas têm um valor constante, o que significa que a variável atribuída com `const` não pode ser atribuída novamente.
|
||||
|
||||
```js
|
||||
const FAV_PET = "Cats";
|
||||
FAV_PET = "Dogs";
|
||||
```
|
||||
|
||||
O console vai exibir um erro devido à reatribuição do valor de `FAV_PET`.
|
||||
|
||||
Como você pode ver, tentar reatribuir uma variável declarada com `const` lançará um erro. Você sempre deve nomear variáveis que você não quer reatribuir, usando a palavra-chave `const`. Isso ajuda quando você acidentalmente tenta reatribuir uma variável que deveria ser constante. Uma prática comum ao nomear constantes é colocar todas as letras em maiúsculas, com palavras separadas por sublinhado (underscore).
|
||||
|
||||
**Observação:** é comum que os desenvolvedores usem nomes de variáveis maiúsculas para valores imutáveis e minúsculas ou camelCase para valores mutáveis (objetos e arrays). Em um desafio posterior, você verá um exemplo de um nome de variável em minúsculo usado para um array.
|
||||
|
||||
# --instructions--
|
||||
|
||||
Altere o código para que todas as variáveis sejam declaradas usando `let` ou `const`. Use `let` quando você quiser que a variável mude e `const` quando você quiser que a variável permaneça constante. Além disso, renomeie as variáveis declaradas com `const` para estar em conformidade com as práticas comuns, o que significa que constantes devem ter todas as letras em maiúsculo.
|
||||
|
||||
# --hints--
|
||||
|
||||
`var` não deve existir no seu código.
|
||||
|
||||
```js
|
||||
(getUserInput) => assert(!getUserInput('index').match(/var/g));
|
||||
```
|
||||
|
||||
`SENTENCE` deve ser uma variável constante declarada com `const`.
|
||||
|
||||
```js
|
||||
(getUserInput) => assert(getUserInput('index').match(/(const SENTENCE)/g));
|
||||
```
|
||||
|
||||
A variável `i` deve ser declarada com `let`.
|
||||
|
||||
```js
|
||||
(getUserInput) => assert(getUserInput('index').match(/(let i)/g));
|
||||
```
|
||||
|
||||
`console.log` deve ser alterado para imprimir a variável `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");
|
||||
```
|
||||
@ -1,91 +0,0 @@
|
||||
---
|
||||
id: 587d7b87367417b2b2512b3f
|
||||
title: Diferenciar entre as palavras-chave var e let
|
||||
challengeType: 1
|
||||
forumTopicId: 301202
|
||||
dashedName: explore-differences-between-the-var-and-let-keywords
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
Um dos maiores problemas ao declarar variáveis com a palavra-chave `var` é que você pode sobrescrever a declaração da variável sem perceber.
|
||||
|
||||
```js
|
||||
var camper = 'James';
|
||||
var camper = 'David';
|
||||
console.log(camper);
|
||||
```
|
||||
|
||||
Aqui o console vai exibir a string `David`.
|
||||
|
||||
Como você pode ver no código acima, a variável `camper` é originalmente declarada com o valor `James` e então substituída pelo valor `David`. Em uma aplicação pequena, você pode não encontrar esse tipo de problema, mas quando seu código se tornar maior, você pode acidentalmente sobrescrever uma variável que você não tinha a intenção. Como esse comportamento não lança nenhum erro, procurar e corrigir bugs se torna mais difícil.
|
||||
Para resolver esse potencial problema com a palavra-chave `var`, uma nova palavra-chave chamada `let` foi introduzida no ES6. Se você tentar substituir `var` por `let` nas declarações de variável do código acima, o resultado será um erro.
|
||||
|
||||
```js
|
||||
let camper = 'James';
|
||||
let camper = 'David';
|
||||
```
|
||||
|
||||
Esse erro pode ser visto no console do seu navegador. Então, diferente de `var`, ao usar `let`, uma variável com o mesmo nome só pode ser declarada uma única vez. Note o `"use strict"`. Isso habilita o Modo Estrito, o qual captura erros de codificação comum e ações "não seguras". Por exemplo:
|
||||
|
||||
```js
|
||||
"use strict";
|
||||
x = 3.14;
|
||||
```
|
||||
|
||||
O código acima vai exibir o erro: `x is not defined`.
|
||||
|
||||
# --instructions--
|
||||
|
||||
Atualize o código para que apenas a palavra-chave `let` seja usada.
|
||||
|
||||
# --hints--
|
||||
|
||||
A palavra-chave `var` não deve existir no código.
|
||||
|
||||
```js
|
||||
(getUserInput) => assert(!getUserInput('index').match(/var/g));
|
||||
```
|
||||
|
||||
A variável `catName` deve ser uma string de valor `Oliver`.
|
||||
|
||||
```js
|
||||
assert(catName === 'Oliver');
|
||||
```
|
||||
|
||||
A variável `quote` deve ser uma string de valor `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