A session that connects a lot of dots — practical debugging instincts, the callback pattern showing up in places you didn't expect, and a cleaner understanding of why map, filter and reduce are called methods and not functions.
When Something Doesn't Render — Where Do You Look?
This is genuinely useful debugging instinct to build early:
Image or text not showing up? — the problem is almost always in the API response. Open your browser console, go to the Network tab, find your request, and look at what actually came back. Nine times out of ten the data structure is different from what you expected — a nested property, a different key name, an empty array.
A service not working — like Google Maps, payment widgets, auth providers? — 90% of the time it's the API key. Either it's wrong, expired, restricted to a different domain, or it's not being read properly. First place to check is your runtime.config or .env file. Make sure the key is actually there, spelled correctly, and being accessed with the right variable name.
Two different problems, two different places to look. Building this reflex early saves hours of frustration.
setTimeout With a Dynamic Delay
You're not locked into hardcoding the seconds inside setTimeout — you can pass the delay as a parameter and control it from outside:
`function myFunc(twoFunc, seconds) { console.log('Hi Jalaj!'); setTimeout(() => { twoFunc(); }, seconds * 1000); }
myFunc(someFunction, 2);`
The delay becomes flexible. Call the same function with 3 and it waits three seconds. Call it with 0 and it fires almost immediately. The function doesn't care — it just uses whatever it was given.
Callbacks Are Everywhere — You've Been Using Them All Along
Once you see the callback pattern you can't unsee it. useEffect, setTimeout, setInterval, reduce, filter, map — they all accept a function while being called. That function is the callback.
And it genuinely doesn't matter whether you name it or not:
Anonymous callback — defined while calling:
greetUser("Alex", () => console.log("Logged in successfully. ✅"));
Named callback — defined beforehand and passed in:
function onSuccess() { console.log("Logged in successfully. ✅"); } greetUser("Alex", onSuccess);
Same result. The parent function doesn't care what your callback's name is — it just calls whatever was handed to it.
The Three Things a Dev Controls With Callbacks
Every time you work with a function that takes a callback, there are exactly three decisions you're making:
1 — The arguments — how many, what type, in what order you pass them. Get this wrong and nothing works.
2 — What's inside the callback — are you writing the logic inline while calling, or did you build the function separately beforehand and just drop it in?
3 — How you call the main function — are you passing an anonymous arrow function right there, or a variable that holds a pre-built function?
These three things cover every variation of the callback pattern you'll ever see. Once you can identify all three in any piece of code, callbacks stop feeling unpredictable.
The Window Object — JavaScript's Outermost Scope
In the browser, the window object is the global scope — the outermost container that everything lives inside. Functions you define at the top level, variables, even built-in things — they all exist on window.
window.setTimeout, window.console, window.alert — these are all just properties on that same object. When you call setTimeout() without any prefix, JavaScript quietly looks it up on window for you.
Why map, filter, reduce Are Methods, Not Functions
This is a subtle but real distinction worth understanding.
A function is a standalone callable — it exists on its own. A method is a function that lives inside an object.
map, filter, and reduce live on Array.prototype — which is itself an object. Every array you create inherits from that prototype, which is why you can call .map() on any array. Since they live inside an object (Array.prototype), they are by definition methods, not standalone functions.
Same applies to object methods — anything sitting inside an object as a function is a method. The distinction matters when you start dealing with this — because methods have an owner, and this points to that owner. Standalone functions don't have one, so this floats up to window.
Top comments (0)