94f0cf0ef8
* fix: remove isHidden key from tool template * fix: removed isHidden key from English challenges * fix: remove isHidden key from Chinese challenges
3.1 KiB
3.1 KiB
id, title, challengeType
| id | title | challengeType |
|---|---|---|
| 5ddb965c65d27e1512d44da6 | Part 13 | 0 |
Description
Now we need to provide a function to map() that will be performed on each item of the array.
This function will take the original item as an argument, in our case we'll call it meal. Inside the .map() parentheses, insert an empty function that takes meal as a parameter, like:
function(meal){}
Enter in the above function as an argument in between the parentheses of the .map() function.
Instructions
Tests
tests:
- text: See description above for instructions.
testString: assert( code.replace(/\s/g, '').match(/map\(function\(\s*meal\)\{\}\)/) );
Challenge Seed
<script>
document.getElementById('calorie-form').onsubmit = calculate;
function calculate(e) {
e.preventDefault();
const total = Array.from(
document.getElementsByClassName('cal-control')
).map();
}
</script>
Before Test
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<div class="container">
<form id="calorie-form">
<h2 class="center">Calorie Counter</h2>
<div class="grid">
<legend>Sex</legend>
<div>
<input type="radio" name="sex" id="female" value="F" checked />
<label for="female">
Female (2,000 calories)
</label>
<div>
<input type="radio" name="sex" id="male" value="M" />
<label for="male">
Male (2,500 calories)
</label>
</div>
</div>
</div>
<div class="grid" id="entries">
Breakfast
<input
type="number"
min="0"
class="cal-control"
id="breakfast"
/><br />
Lunch
<input type="number" min="0" class="cal-control" id="lunch" /><br />
Dinner <input type="number" min="0" class="cal-control" id="dinner" />
</div>
<button type="button" class="btn-add" id="add">
Add Entry
</button>
<button type="submit" class="btn-solid" id="calculate">
Calculate
</button>
<button type="button" class="btn-outline" id="clear">
Clear
</button>
</form>
<div id="output"></div>
</div>
</body>
</html>
After Test
</body>
</html>
Solution
<script>
document.getElementById('calorie-form').onsubmit = calculate;
function calculate(e) {
e.preventDefault();
const total = Array.from(
document.getElementsByClassName('cal-control')
).map(function(meal) {});
}
</script>