jprdonnelly/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-04-13 22:00:19 -04:00
Code Issues Projects Releases Wiki Activity

refactor(curriculum): replacing for loop with for...of loop for calorie counter project (#53454)

Browse Source 
Co-authored-by: Kolade Chris <65571316+Ksound22@users.noreply.github.com>
This commit is contained in:
Jessica Wilkins
2024-02-01 04:57:38 -08:00
committed by GitHub
parent 78fd39a038
commit 33321b67ae
39 changed files with 124 additions and 166 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c8ad0cd8f1e5201c4ef2e4.md
View File

@@ -7,34 +7,26 @@ dashedName: step-56
# --description--
The `list` parameter is going to be the result of a query selector, which will return a `NodeList`. A `NodeList` is an array-like which contains the elements that match the query selector.
The `list` parameter is going to be the result of a query selector, which will return a `NodeList`. A `NodeList` is a list of elements like an array. It contains the elements that match the query selector. You will need to loop through these elements in the list.
You'll need to loop through these elements, so start by creating a `for` loop. Your iterator `i` should start at `0`, continue while it is less than the length of the list, and increment by `1` each iteration.
In previous steps, you learned how to loop through an array using a `for` loop. You can also use a <dfn>for...of</dfn> loop to loop through an array and a `NodeList`.
A `for...of` loop is used to iterate over elements in an iterable object like an array. The variable declared in the loop represents the current element being iterated over.
```js
for (const element of elementArray) {
console.log(element);
}
```
Create a `for...of` loop that loops through the list. For the loop's variable name, use `const` to declare a variable called `item`.
# --hints--
Your `getCaloriesFromInputs` function should have a `for` loop.
You should have a `for...of` loop that loops through the `list` parameter. Use `item` for the loop's variable name.
```js
assert.match(getCaloriesFromInputs.toString(), /for\s*\(/g);
```
Your `for` loop should initialize a variable called `i` to `0`.
```js
assert.match(getCaloriesFromInputs.toString(), /for\s*\(\s*(let|var)\s+i\s*=\s*0\s*;/g);
```
Your `for` loop should have a condition that checks if `i` is less than the length of `list`.
```js
assert.match(getCaloriesFromInputs.toString(), /for\s*\(\s*(let|var)\s+i\s*=\s*0\s*;\s*i\s*<\s*list\.length\s*;/g);
```
Your `for` loop should increment `i` by `1` each time it runs. Use the increment operator for this.
```js
assert.match(getCaloriesFromInputs.toString(), /for\s*\(\s*(let|var)\s+i\s*=\s*0\s*;\s*i\s*<\s*list\.length\s*;\s*i\s*\+\+\s*\)/g);
assert.match(code, /for\s*\(\s*const\s+item\s+of\s+list\s*\)\s*\{/);
```
# --seed--

36
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c8b0187cceff21c8389543.md
View File

@@ -9,40 +9,20 @@ dashedName: step-57
The `NodeList` values you will pass to `list` will consist of `input` elements. So you will want to look at the `value` attribute of each element.
Assign the `value` of the element in `list` at index `i` to a variable called `currVal`.
Assign `item.value` to a `const` variable called `currVal`.
# --hints--
You should have a `currVal` variable.
You should use `const` to declare a new variable called `currVal`.
```js
assert.match(getCaloriesFromInputs.toString(), /currVal\s*=/);
assert.match(code, /const\s+currVal\s*=/);
```
You should access the element in `list` at index `i` using bracket notation.
You should assign `item.value` to `currVal`.
```js
assert.match(getCaloriesFromInputs.toString(), /list\s*\[\s*i\s*\]/);
```
You should access the `value` attribute of the element in `list` at index `i`.
```js
assert.match(getCaloriesFromInputs.toString(), /list\s*\[\s*i\s*\]\s*\.value/);
```
You should assign the `value` of the element in `list` at index `i` to a variable called `currVal`.
```js
assert.match(getCaloriesFromInputs.toString(), /currVal\s*=\s*list\s*\[\s*i\s*\]\s*\.value/);
```
Your `currVal` assignment should be in your `for` loop.
```js
// another hack, because the loop protection injects stuff
const getCaloriesString = code.split("function getCaloriesFromInputs")[1];
assert.match(getCaloriesString, /for\s*\(\s*let\s+i\s*=\s*0\s*;\s*i\s*<\s*list\.length\s*;\s*i\s*\+\+\s*\)\s*\{\s*(const|let)\s+currVal\s*=\s*list\s*\[\s*i\s*\]\s*\.value/g);
assert.match(code, /const\s+currVal\s*=\s*item\.value/);
```
# --seed--
@@ -250,15 +230,15 @@ function addEntry() {
targetInputContainer.insertAdjacentHTML('beforeend', HTMLString);
}
--fcc-editable-region--
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
--fcc-editable-region--
for (const item of list) {
}
--fcc-editable-region--
}
--fcc-editable-region--
addEntryButton.addEventListener("click", addEntry);
```

18
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c8be904ffff922f3c6f8d0.md
View File

@@ -9,26 +9,26 @@ dashedName: step-58
Remember that you wrote a function earlier to clean the user's input? You'll need to use that function here.
Update your `currVal` declaration to be the result of calling `cleanInputString` with `list[i].value`.
Update your `currVal` declaration to be the result of calling `cleanInputString` with `item.value`.
# --hints--
Your `getCaloriesFromInputs` function should call your `cleanInputString` function.
You should call the `cleanInputString` function inside the `getCaloriesFromInputs` function.
```js
assert.match(getCaloriesFromInputs.toString(), /cleanInputString\(/);
```
You should pass `list[i].value` as the argument for `cleanInputString`.
You should pass `item.value` as the argument for `cleanInputString` function.
```js
assert.match(getCaloriesFromInputs.toString(), /cleanInputString\(\s*list\s*\[\s*i\s*\]\s*\.value\)/);
assert.match(getCaloriesFromInputs.toString(), /cleanInputString\(\s*item\.value\s*\)/);
```
You should assign the result of your `cleanInputString` call to your `currVal` variable.
```js
assert.match(getCaloriesFromInputs.toString(), /currVal\s*=\s*cleanInputString\(\s*list\s*\[\s*i\s*\]\s*\.value\)/);
assert.match(code, /const\s+currVal\s*=\s*cleanInputString\(\s*item\.value\s*\)/);
```
@@ -237,15 +237,15 @@ function addEntry() {
targetInputContainer.insertAdjacentHTML('beforeend', HTMLString);
}
--fcc-editable-region--
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = list[i].value;
for (const item of list) {
--fcc-editable-region--
const currVal = item.value;
--fcc-editable-region--
}
}
--fcc-editable-region--
addEntryButton.addEventListener("click", addEntry);
```

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c8c00bfb671b23f9de4159.md
View File

@@ -238,8 +238,8 @@ function addEntry() {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
}
}

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c8c15fd337ad24b9b68049.md
View File

@@ -250,8 +250,8 @@ function addEntry() {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9bc53735149084390e5d0.md
View File

@@ -241,8 +241,8 @@ function addEntry() {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9bcc26219e7090da0f549.md
View File

@@ -232,8 +232,8 @@ function addEntry() {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9bce376ca4f09c15a3768.md
View File

@@ -254,8 +254,8 @@ function addEntry() {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

14
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9bdd916e0c10af01ed8d7.md
View File

@@ -17,12 +17,6 @@ You should `return` the `calories` value.
assert.match(getCaloriesFromInputs.toString(), /return\s+calories/);
```
Your new `return` statement should come after your `for` loop.
```js
assert.match(getCaloriesFromInputs.toString(), /calories\s*\+=\sNumber\(currVal\);\n\s*}\n\s*return\s+calories/)
```
# --seed--
## --seed-contents--
@@ -228,12 +222,11 @@ function addEntry() {
targetInputContainer.insertAdjacentHTML('beforeend', HTMLString);
}
--fcc-editable-region--
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {
@@ -243,9 +236,10 @@ function getCaloriesFromInputs(list) {
}
calories += Number(currVal);
}
--fcc-editable-region--
--fcc-editable-region--
}
--fcc-editable-region--
addEntryButton.addEventListener("click", addEntry);
```

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9be334f4a050c0b94bc93.md
View File

@@ -241,8 +241,8 @@ function addEntry() {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9bef7fec05c0d38853828.md
View File

@@ -239,8 +239,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9bf80558d780e848b2987.md
View File

@@ -248,8 +248,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9c09a7daa4f0ff92c4023.md
View File

@@ -247,8 +247,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9c0d0857f0a10a57af936.md
View File

@@ -284,8 +284,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9c11a0a090311dff55564.md
View File

@@ -254,8 +254,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9c16dd75dd212dc12363c.md
View File

@@ -253,8 +253,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9c1ef134f3513e751c975.md
View File

@@ -290,8 +290,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e3a83bb3e61a80eea564.md
View File

@@ -261,8 +261,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e45519caf31b987fbb5f.md
View File

@@ -259,8 +259,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e4d2ff41811dd640504f.md
View File

@@ -269,8 +269,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e51b3a007a1eba1cd0f6.md
View File

@@ -264,8 +264,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e55b4b06c11fff555c64.md
View File

@@ -279,8 +279,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e5eea8261d22856ead1c.md
View File

@@ -262,8 +262,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e63bb1e32d23b6adbe44.md
View File

@@ -285,8 +285,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e6b7c0303524af2d0bc2.md
View File

@@ -257,8 +257,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e769df38c92635c158ba.md
View File

@@ -266,8 +266,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e7d5b21eee2776ecc226.md
View File

@@ -274,8 +274,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e84c9fe8ca28c4101189.md
View File

@@ -282,8 +282,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e8fe3a6f022a05a04675.md
View File

@@ -281,8 +281,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9e94e9df7d72aed1c24bd.md
View File

@@ -281,8 +281,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9ea23dbadbf2c2764e3f5.md
View File

@@ -274,8 +274,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9ea9b16430f2d54522464.md
View File

@@ -272,8 +272,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9eb09bcfaa72e3da820a1.md
View File

@@ -272,8 +272,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

4
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9eb4a5d68f12f32d9b440.md
View File

@@ -268,8 +268,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

26
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9ebb7b12bca3025b0a935.md
View File

@@ -7,33 +7,25 @@ dashedName: step-90
# --description--
It is time for another loop. Use a `for` loop to iterate through the `inputContainers` array.
It is time for another loop. Create a `for...of` loop with a variable called `container` to iterate through the `inputContainers` array.
Inside the loop, set the `innerHTML` property of the element at the current index to an empty string. This will clear all of the contents of that input container.
Inside the loop, set the `innerHTML` property of the `container` to an empty string. This will clear all of the contents of that input container.
# --hints--
Your `clearForm` function should have a `for` loop.
Your `for...of` loop should iterate through the `inputContainers` array. The loop's variable name should be `container`.
```js
// loop protect injects stuff, so let's look at the raw code again
const clearForm = code.split("function clearForm()")[1];
assert.match(clearForm, /for\s*\(/);
assert.match(clearForm, /for\s*\(\s*const\s+container\s+of\s+inputContainers\s*\)/);
```
Your `for` loop should iterate through the `inputContainers` array. Remember to use `i` as your iterator.
Your `for...of` loop should set the `innerHTML` property of `container` to an empty string.
```js
const clearForm = code.split("function clearForm()")[1];
assert.match(clearForm, /for\s*\(\s*let\s+i\s*=\s*0\s*;\s*i\s*<\s*inputContainers\.length\s*;\s*i\s*\+\+\s*\)/);
```
Your `for` loop should set the `innerHTML` property of `inputContainers[i]` to an empty string.
```js
const clearForm = code.split("function clearForm()")[1];
const forLoop = clearForm.split("for")[1];
assert.match(forLoop, /inputContainers\s*\[\s*i\s*\]\s*\.innerHTML\s*=\s*(`|'|")\1\s*/);
const forOfLoop = clearForm.split("for")[1];
assert.match(forOfLoop, /container\s*\.\s*innerHTML\s*=\s*(`|'|")\1\s*/);
```
# --seed--
@@ -279,8 +271,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {

8
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9ec044acedf312c4974ff.md
View File

@@ -274,8 +274,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {
@@ -292,8 +292,8 @@ function getCaloriesFromInputs(list) {
function clearForm() {
const inputContainers = Array.from(document.querySelectorAll('.input-container'));
for (let i = 0; i < inputContainers.length; i++) {
inputContainers[i].innerHTML = '';
for (const container of inputContainers) {
container.innerHTML = '';
}

8
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9f24afbc9cf324dcaa9a4.md
View File

@@ -274,8 +274,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {
@@ -292,8 +292,8 @@ function getCaloriesFromInputs(list) {
function clearForm() {
const inputContainers = Array.from(document.querySelectorAll('.input-container'));
for (let i = 0; i < inputContainers.length; i++) {
inputContainers[i].innerHTML = '';
for (const container of inputContainers) {
container.innerHTML = '';
}
budgetNumberInput.value = '';

8
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9f28bda3e3f336e21b6b4.md
View File

@@ -274,8 +274,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {
@@ -292,8 +292,8 @@ function getCaloriesFromInputs(list) {
function clearForm() {
const inputContainers = Array.from(document.querySelectorAll('.input-container'));
for (let i = 0; i < inputContainers.length; i++) {
inputContainers[i].innerHTML = '';
for (const container of inputContainers) {
container.innerHTML = '';
}
budgetNumberInput.value = '';

16
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-form-validation-by-building-a-calorie-counter/63c9f2bff625af342023512c.md
View File

@@ -274,8 +274,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {
@@ -291,8 +291,8 @@ function getCaloriesFromInputs(list) {
function clearForm() {
const inputContainers = Array.from(document.querySelectorAll('.input-container'));
for (let i = 0; i < inputContainers.length; i++) {
inputContainers[i].innerHTML = '';
for (const container of inputContainers) {
container.innerHTML = '';
}
budgetNumberInput.value = '';
@@ -548,8 +548,8 @@ function calculateCalories(e) {
function getCaloriesFromInputs(list) {
let calories = 0;
for (let i = 0; i < list.length; i++) {
const currVal = cleanInputString(list[i].value);
for (const item of list) {
const currVal = cleanInputString(item.value);
const invalidInputMatch = isInvalidInput(currVal);
if (invalidInputMatch) {
@@ -565,8 +565,8 @@ function getCaloriesFromInputs(list) {
function clearForm() {
const inputContainers = Array.from(document.querySelectorAll('.input-container'));
for (let i = 0; i < inputContainers.length; i++) {
inputContainers[i].innerHTML = '';
for (const container of inputContainers) {
container.innerHTML = '';
}
budgetNumberInput.value = '';