mirror of
https://github.com/freeCodeCamp/freeCodeCamp.git
synced 2025-12-22 03:26:02 -05:00
3c1353fbe0
Co-authored-by: Naomi <nhcarrigan@gmail.com> Co-authored-by: Sem Bauke <semboot699@gmail.com>
5.8 KiB
5.8 KiB
id, title, challengeType, dashedName
| id | title | challengeType | dashedName |
|---|---|---|---|
| 6352fce75b2d3b2924930f1e | Step 49 | 0 | step-49 |
--description--
With two .map() calls and a .reduce() call, you're creating extra arrays and iterating more times than needed. You should move all of the logic into the .reduce() call to save time and memory.
Remove the differences, squaredDifferences, and sumSquaredDifferences variables (and their values). Declare a variance variable, and assign it the value of array.reduce(). For the callback, pass in your standard acc and el parameters, but leave the function body empty for now. Don't forget to set the initial value to 0.
--hints--
You should remove the differences variable.
assert.notMatch(getVariance.toString(), /differences\s*=/);
You should remove the squaredDifferences variable.
assert.notMatch(getVariance.toString(), /squaredDifferences\s*=/);
You should remove the sumSquaredDifferences variable.
assert.notMatch(getVariance.toString(), /sumSquaredDifferences\s*=/);
You should have a variance variable.
assert.match(getVariance.toString(), /variance\s*=/);
Your variance variable should use the array.reduce() method.
assert.match(getVariance.toString(), /variance\s*=\s*array\.reduce\(/);
Your variance variable should use the acc and el parameters in the callback function.
assert.match(getVariance.toString(), /variance\s*=\s*array\.reduce\(\s*function\s*\(\s*acc\s*,\s*el\s*\)/);
Your reduce callback should be an empty function.
assert.match(getVariance.toString(), /variance\s*=\s*array\.reduce\(\s*function\s*\(\s*acc\s*,\s*el\s*\)\s*\{\s*\}/);
Your reduce callback should have an initial value of 0.
assert.match(getVariance.toString(), /variance\s*=\s*array\.reduce\(\s*function\s*\(\s*acc\s*,\s*el\s*\)\s*\{\s*\}\s*,\s*0\s*\)/);
--seed--
--seed-contents--
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="./styles.css" />
<script src="./script.js"></script>
<title>Statistics Calculator</title>
</head>
<body>
<h1>Statistics Calculator</h1>
<p>Enter a list of comma-separated numbers.</p>
<form onsubmit="calculate(); return false;">
<label for="numbers">Numbers:</label>
<input type="text" name="numbers" id="numbers" />
<button type="submit">Calculate</button>
</form>
<div class="results">
<p>
The <dfn>mean</dfn> of a list of numbers is the average, calculated by
taking the sum of all numbers and dividing that by the count of numbers.
</p>
<p class="bold">Mean: <span id="mean"></span></p>
<p>
The <dfn>median</dfn> of a list of numbers is the number that appears in
the middle of the list, when sorted from least to greatest.
</p>
<p class="bold">Median: <span id="median"></span></p>
<p>
The <dfn>mode</dfn> of a list of numbers is the number that appears most
often in the list.
</p>
<p class="bold">Mode: <span id="mode"></span></p>
<p>
The <dfn>range</dfn> of a list of numbers is the difference between the
largest and smallest numbers in the list.
</p>
<p class="bold">Range: <span id="range"></span></p>
<p>
The <dfn>variance</dfn> of a list of numbers measures how far the values
are from the mean, on average.
</p>
<p class="bold">Variance: <span id="variance"></span></p>
<p>
The <dfn>standard deviation</dfn> of a list of numbers is the square
root of the variance.
</p>
<p class="bold">
Standard Deviation: <span id="standardDeviation"></span>
</p>
</div>
</body>
</html>
body {
margin: 0;
background-color: rgb(27, 27, 50);
text-align: center;
color: #fff;
}
button {
cursor: pointer;
background-color: rgb(59, 59, 79);
border: 3px solid white;
color: white;
}
input {
background-color: rgb(10, 10, 35);
color: white;
border: 1px solid rgb(59, 59, 79);
}
.bold {
font-weight: bold;
}
const getMean = (array) => array.reduce((acc, el) => acc + el, 0) / array.length;
const getMedian = (array) => {
const sorted = array.sort((a, b) => a - b);
const median =
array.length % 2 === 0
? getMean([sorted[array.length / 2], sorted[array.length / 2 - 1]])
: sorted[Math.floor(array.length / 2)];
return median;
}
const getMode = (array) => {
const counts = {};
array.forEach((el) => {
counts[el] = (counts[el] || 0) + 1;
})
if (new Set(Object.values(counts)).size === 1) {
return null;
}
const highest = Object.keys(counts).sort(
(a, b) => counts[b] - counts[a]
)[0];
const mode = Object.keys(counts).filter(
(el) => counts[el] === counts[highest]
);
return mode.join(", ");
}
const getRange = (array) => {
return Math.max(...array) - Math.min(...array);
}
--fcc-editable-region--
const getVariance = (array) => {
const mean = getMean(array);
const differences = array.map(
el => el - mean
);
const squaredDifferences = differences.map(
el => el ** 2
);
const sumSquaredDifferences = squaredDifferences.reduce(
(acc, el) => acc + el, 0
);
}
--fcc-editable-region--
const calculate = () => {
const value = document.querySelector("#numbers").value;
const array = value.split(/,\s*/g);
const numbers = array.map(el => Number(el)).filter(el => !isNaN(el));
const mean = getMean(numbers);
const median = getMedian(numbers);
const mode = getMode(numbers);
const range = getRange(numbers);
document.querySelector("#mean").textContent = mean;
document.querySelector("#median").textContent = median;
document.querySelector("#mode").textContent = mode;
document.querySelector("#range").textContent = range;
}