JavaScript map, filter, reduce demo
by codestellar
HTML
<label><strong>Registration Counter</strong></label>
<div id="mapResults">
</div>
<hr/>
<label><strong>Sanitize and Oxygen Check</strong></label>
<div id="mapResults2">
</div>
<hr/>
<label><strong>Covid Suspects based on SpO2 level</strong></label>
<div id="filterResults">
</div>
<hr/>
<label><strong>Total Patients</strong></label>
<div id="reduceResults1">
</div>
<hr/>
<label><strong>Summary (No. of Covid Suspects!)</strong></label>
<div id="reduceResults2">
</div>
<hr/>
<label><strong>Healthy People</strong></label>
<div id="reduceResults3">
</div>
JavaScript
let patientsData = [
{"name": "John", "age": "35"},
{"name": "Maria", "age": "40"},
{"name": "Ken", "age": "25"},
{"name": "Howard", "age": "63"},
{"name": "Liza", "age": "72"},
{"name": "Gene", "age": "80"},
{"name": "Nikunj", "age": "48"},
{"name": "Fatimah", "age": "32"},
];
// map gives exactly the same number of elements, when you are interested in // specific data, or want to perform some operation on some data.
let patients = patientsData.map((patient) => {
return patient.name;
});
document.getElementById('mapResults').innerText = JSON.stringify(patients);
// map gives exactly the same number of elements, when you are interested in // specific data, or want to perform some operation on some data.
let sanitizedPatients = patientsData.map((patient) => {
patient.sanitized = true;
patient.spo2Percent = checkSpO2Level(70,95);
return patient;
});
document.getElementById('mapResults2').innerText = JSON.stringify(sanitizedPatients);
// use filter to filter based on a conditional statement
let covidSuspects = sanitizedPatients.filter((patient) => {
return patient.spo2Percent < 85;
});
document.getElementById('filterResults').innerText = JSON.stringify(covidSuspects);
let total = sanitizedPatients.reduce((patientCount, patient) => {
return ++patientCount;
}, 0);
document.getElementById('reduceResults1').innerText = JSON.stringify(total);
let patientsCount = sanitizedPatients.reduce((patientCount, patient) => {
if(patient.spo2Percent < 85){
patientCount++;
}
return patientCount;
}, 0);
document.getElementById('reduceResults2').innerText = JSON.stringify(patientsCount);
let healthyPeople = sanitizedPatients.reduce((patientCount, patient) => {
return patient.spo2Percent>=85 ? ++patientCount : patientCount;
}, 0);
document.getElementById('reduceResults3').innerText = JSON.stringify(healthyPeople);
// Making use of Random here and assuming that this function checks the Oxygen Level
function checkSpO2Level(min, max) { // min...