JavaScript: Is it possible to replace functions like Array.prototype.indexOf?

Question

As the questions says, is it possible to replace such functions with an own implementation?

Like:

Array.prototype.forEach = function () {
    console.log("foo");             
};

That's - of course - a stupid replacement. But this is more about the possibility. I tried it, but then it seemed like at runtime it's not replaced.

My console logs the foo. But when I'm calling something like

[].forEach();

which also shout log foo, it does not work, until I replace the forEach function again in the console.

The replacements do work, but they don't *permanently* affect the browser, if that's what you're asking. You have to alter the Array prototype in each JavaScript context (like, each page). — Pointy, Aug 06 '14 at 15:59
Are you sure your code doesn't work? check out this codepen: http://codepen.io/anon/pen/cmzrd — El Guapo, Aug 06 '14 at 16:00

agconti · Accepted Answer · 2014-08-06T16:34:35.013

Your example works:

Array.prototype.forEach = function () {
    alert("foo");             
};    

[].forEach();

http://jsbin.com/xidew/1/

This is ultimately, undesirable though. You are altering the fundamental functions on which applications and libraries work. If you do alter these functions, you must be cautious to not break the way existing functions depend on them.

Looking at the way underscore.js edits forEach:

You can see that they avoided changing the way every array uses forEach by creating a separate _.forEach() function.

Then other libraries, like Backbone, take that forEach and only override their subclass of array. Like Backbone overrides the forEach method in the Backbone collection.

The moral of this story is:

Its an extremely rare case to modify the prototype of base object classes, String, Array, Object, because of the possibly cataclysmic implications. If you need to, you can create a subclass of those base classes and modify it there to suit your own purposes. This tactic of subclassing is evident in Backbone and other popular and widely used js libraries.

I'm aware of this. This is more like to gain an deeper understanding of the language. — Johannes Klauß, Aug 06 '14 at 16:05
@JohannesKlauß I added more insight as to how others have pragmatically modified methods like `forEach`. — agconti, Aug 06 '14 at 16:20
I'm not sure why it wasn't working in the first place, but you're right, it's overriding it. — Johannes Klauß, Aug 07 '14 at 08:11

ChemaMX · Answer 2 · 2014-08-06T19:00:20.337

0

What you could do is add the code to an external file default.js and add an script tag to the layout html (the main page that all the rest of the pages use)

<head>
    <title>Title</title>
    <link href="Content/default.css" rel="stylesheet" />
    <script src="Scripts/default.js"></script>
</head>

It will always be picked up by other js code as it will be always loaded in the page.

edited Aug 06 '14 at 19:00

answered Aug 06 '14 at 18:52

ChemaMX

126
1
4

JavaScript: Is it possible to replace functions like Array.prototype.indexOf?

2 Answers2