Understanding dot notation usage with arrays and objects in JavaScript

I’m trying to figure out how dot notation actually works when we use it with arrays and other data types.

const numbers = [10, 20, 30, 40].map((value, index) => value + index)

In this example, how does the map method know what to do? I get that dot notation is used with objects, but I’m confused about arrays.

My guess is that Array has some built-in method called map that takes a callback function. But I don’t understand how map automatically knows to go through each element in the array. We’re not explicitly telling it which array to process, right?

Can someone explain how this dot notation mechanism works behind the scenes?

Arrays in JavaScript are just special objects with numbered indices. When you create an array, it gains access to all the methods defined in Array.prototype, like map. Dot notation facilitates this by allowing the method to access the specific array instance automatically. The map method inspects the length of the array, iterates through indices 0, 1, 2, and so on, and applies your callback to each element. The binding happens through the dot operator, which is why map knows which array it is operating on without needing it to be explicitly passed in as a parameter. This mechanism is also applicable to other methods like toString() or push().

yep! Arrays r basically objects, so when you do [10,20,30].map(), it’s calling from Array.prototype. Every array has access to those methods. The ‘this’ in map points to the specific array - that’s how it knows which data to loop thru.

When you call .map() on an array, JavaScript looks up the prototype chain and finds the method on Array.prototype. Here’s the key part you’re missing: when map runs, this points to your specific array instance. So the array becomes the context for the method. Map uses this.length to know how many times to loop and this[i] to grab each element. You don’t pass the array explicitly because the dot notation already binds the method to it. Same thing happens with filter, reduce, forEach, and other array methods.