Exercise: Advanced Usage of map and filter in JavaScript for Lab Simulation Data

[akash-coded]

Exercise: Advanced Usage of map and filter in JavaScript for Lab Simulation Data

Context:

In a virtual lab simulation, data handling and manipulation are crucial. Developers often need to manage arrays of data, such as lab results, configuration parameters, or simulation states. JavaScript’s map and filter functions are pivotal for such manipulations.

---

Scenario 1: Compound Data Manipulation with map and filter

Task:

Given an array of experiments, each containing an array of results, calculate the average result for each experiment and filter out any experiments with an average below a certain threshold. Then, map the filtered experiments to a new array that categorizes the average into "Low", "Medium", or "High".

Example Data:

const experiments = [
  { id: 1, results: [2, 3, 3, 4] },
  { id: 2, results: [5, 6, 5, 6] },
  // ...
];

Hints:

• Use map to calculate the average for each experiment.
• Use filter to exclude experiments below the threshold.
• Use another map to categorize the averages.

---

Scenario 2: Nested Data Manipulation and Transformation

Task:

Given an array of lab configurations, each containing an array of parameter objects, transform the data into a flat array of parameters and filter out those that are outside of a defined range.

Example Data:

const labConfigurations = [
  { id: 1, parameters: [{ name: 'pH', value: 7 }, { name: 'Temperature', value: 25 }] },
  { id: 2, parameters: [{ name: 'pH', value: 8 }, { name: 'Temperature', value: 30 }] },
  // ...
];

Hints:

• Use map to extract and flatten the parameter arrays.
• Use filter to exclude parameters outside the defined range.

---

Scenario 3: Multi-step Data Processing for Simulation Results

Task:

Given an array of simulation results, each containing an array of measurement objects, calculate the average measurement for each result, filter out results with averages below a certain threshold, and map the filtered results to a new array that categorizes the average into different performance categories.

Example Data:

const simulationResults = [
  { id: 1, measurements: [{ type: 'Speed', value: 5 }, { type: 'Speed', value: 6 }] },
  { id: 2, measurements: [{ type: 'Speed', value: 7 }, { type: 'Speed', value: 8 }] },
  // ...
];

Hints:

• Use nested map functions to calculate the average for each result.
• Use filter to exclude results below the threshold.
• Use another map to categorize the averages.

---

Notes:

• Scenario 1 demonstrates handling nested data structures and categorizing numerical data, which is common in complex applications.
• Scenario 2 provides a practical example of flattening nested arrays and filtering data, which is a common requirement in data processing.
• Scenario 3 illustrates multi-step data processing, which is crucial for managing simulation results in the virtual lab.

These scenarios are designed to be progressively more complex and closer to real-world applications, ensuring that learners gradually apply map and filter in contexts relevant to the virtual lab project. Always encourage learners to explore variations and additional complexities to further deepen their understanding and skills.

[UmarAikawa]

// Scenario 1: Compound Data Manipulation with map and filter
const experiments = [
{ id: 1, results: [2, 3, 3, 4] },
{ id: 2, results: [5, 6, 5, 6] },
{ id: 3, results: [2, 3, 4, 5] },
{ id: 4, results: [3, 4, 5, 6] },
{ id: 5, results: [4, 5, 6, 3] }
];

function calcAverage(results) {
let tot = 0;
results.forEach(n => { tot += n});
return tot / results.length;
}
function averageCategory(average){
let avg;
if (average < 4) {
avg = "Low";
}else if(average > 4 && average < 5){
avg = "Medium";
}else{
avg = "High";
}
return avg;
}
const averages = experiments.map(function (e) {
return {id: e.id, results: e.results, average: calcAverage(e.results)}
});
// console.log(averages);

const threshold = 4; //average threshold is 4
const belowThreshold = averages.filter(av => av.average < threshold);

const averageWithCategory = experiments.map(function (e) {
return {id: e.id, results: e.results, average: calcAverage(e.results), category: averageCategory(calcAverage(e.results))}
});

console.log(averageWithCategory)

// Scenario 2: Nested Data Manipulation and Transformation

const labConfigurations = [
{ id: 1, parameters: [{ name: 'pH', value: 7 }, { name: 'Temperature', value: 25 }] },
{ id: 2, parameters: [{ name: 'pH', value: 8 }, { name: 'Temperature', value: 30 }] },
{ id: 3, parameters: [{ name: 'pH', value: 9 }, { name: 'Temperature', value: 35 }] },
{ id: 4, parameters: [{ name: 'pH', value: 10 }, { name: 'Temperature', value: 40 }] },
{ id: 5, parameters: [{ name: 'pH', value: 11 }, { name: 'Temperature', value: 45 }] }
];

const extractedParams = labConfigurations.flatMap(conf => conf.parameters);
console.log(extractedParams);

[UmarAikawa]

// Scenario 3: Multi-step Data Processing for Simulation Results
const simulationResults = [
{ id: 1, measurements: [{ type: 'Speed', value: 5 }, { type: 'Speed', value: 6 }] },
{ id: 2, measurements: [{ type: 'Speed', value: 7 }, { type: 'Speed', value: 8 }] },
{ id: 3, measurements: [{ type: 'Speed', value: 9 }, { type: 'Speed', value: 10 }] },
{ id: 4, measurements: [{ type: 'Speed', value: 11 }, { type: 'Speed', value: 12 }] },
{ id: 5, measurements: [{ type: 'Speed', value: 13 }, { type: 'Speed', value: 14 }] }
];

const avgRes = simulationResults.map(function(s){
let m = s.measurements;
let tot = 0;
m.forEach(n => { tot += n.value});
return { simResultId: s.id, average: tot / m.length}
});
console.log(avgRes);
const averageThreshold = 9;
const belowAverageThreshold = avgRes.filter(f => f.average < averageThreshold);
console.log(belowAverageThreshold);

const avgCategories = avgRes.map(function (e) {
return {simResultId: e.simResultId, results: e.results, average: calcAverage(e.results), category: averageCategory(calcAverage(e.results))}
});