map & filter — essentials
Transform and select data with map and filter; chain them and avoid mutation for safer code.
map & filter — essentials is a free JavaScript Academy lesson on CoddyKit — lesson 1 of 2. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the JavaScript Academy learning path, one of 2 lessons in the course, and your progress syncs across the web and the CoddyKit app.
Intro to map & filter
Goal: Transform items with map and pick items with filter.
- map: transform
- filter: select
- Chain map → filter
- No mutation
map basics
map applies a function to every element and returns a new array (same length).
// map transforms each value and returns a new array
const nums = [1, 2, 3];
const doubled = nums.map(function (n) {
return n * 2;
});
console.log("nums:", nums);
console.log("doubled:", doubled);
filter basics
filter returns only the items where your callback returns true (length may change).
// filter keeps values that pass the test
const values = [1, 2, 3, 4, 5];
const evens = values.filter(function (n) {
return n % 2 === 0;
});
console.log("values:", values);
console.log("evens:", evens);
Chaining example
Combine steps: map to transform, then filter to select.
// Chain methods for clarity
const prices = [4, 7, 10];
// First add tax, then keep items over 8
const withTax = prices.map(function (p) {
return p * 1.1;
});
const expensive = withTax.filter(function (p) {
return p > 8;
});
console.log("withTax:", withTax);
console.log("expensive:", expensive);
No mutation demo
Immutability: map/filter return new arrays; the original is unchanged.
// map and filter do not mutate the original array
const base = [2, 4, 6];
const plusOne = base.map(function (n) {
return n + 1;
});
const small = base.filter(function (n) {
return n < 5;
});
console.log("base:", base);
console.log("plusOne:", plusOne);
console.log("small:", small);
Tips for clean arrays
Tips:
- Name small callbacks well (n, item) for clarity.
- Keep chains short (2–3 steps max).
- Prefer pure callbacks (no side effects).
map vs filter quiz
Quick check: Transform every element.
Recap
Recap: Use map to transform values, filter to select some, and chain them without mutating the original array.
Frequently asked questions
Is the “map & filter — essentials” lesson free?
Yes — the full text of “map & filter — essentials” is free to read here on the web, and the JavaScript Academy course includes 2 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the JavaScript Academy course, upgrade to CoddyKit PRO.
What will I learn in “map & filter — essentials”?
Transform and select data with map and filter; chain them and avoid mutation for safer code. You practise JavaScript Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start JavaScript Academy?
No prior experience is required. JavaScript Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 1 of 2, so you can start here or from the beginning and move at your own pace.
How long does the “map & filter — essentials” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this JavaScript Academy lesson?
Yes. Every JavaScript Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.
All lessons in this course
- map & filter — essentials
- reduce, some/every, find — simple patterns