Add a method to Array object in Javascript?

Question

Is it possible to add a method to an array() in javascript? (I know about prototypes, but I don't want to add a method to every array, just one in particular).

The reason I want to do this is because I have the following code

function drawChart()
{
    //...
    return [list of important vars]
}

function updateChart(importantVars)
{
    //...
}

var importantVars = drawChart();

updateChart(importantVars);

And I want to be able to do something like this instead:

var chart = drawChart();<br>
chart.redraw();

I was hoping there was a way I could just attach a method to what i'm returning in drawChart(). Any way to do that?

This has already be answered multiple times, however, keep this in mind: *methods in JavaScript are first-class [function] values*. That is, they are *just functions* that are named by -- that is, are the result of evaluating -- *properties*. — , Jul 10 '12 at 21:15
This is clearly possible, but is it advisable? Are there side effects? When iterating over the array, will the method get in the way? Does the method count when getting the Array's length? — Jesse Hattabaugh, Jul 23 '14 at 22:58

score 39 · Accepted Answer · answered Jul 10 '12 at 21:13

39

Arrays are objects, and can therefore hold properties such as methods:

var arr = [];
arr.methodName = function() { alert("Array method."); }

answered Jul 10 '12 at 21:13

jeff

8,300
2
31
43

Nice ! I need the same, but with typescript. Any idea how to do it ? – Mikado68 Sep 19 '19 at 06:09
@Mikado68 Take a look at: https://stackoverflow.com/questions/12802383/extending-array-in-typescript – Lin Du Sep 27 '19 at 03:54

score 8 · Answer 2 · answered Jul 10 '12 at 21:12

8

Yep, easy to do:

array = [];
array.foo = function(){console.log("in foo")}
array.foo();  //logs in foo

answered Jul 10 '12 at 21:12

jjathman

12,536
8
29
33

1

The comment about IE was a couple of versions ago, does it still apply? – jmoreno Apr 07 '16 at 04:43

score 5 · Answer 3 · edited Jul 10 '12 at 21:12

5

Just instantiate the array, create a new property, and assign a new anonymous function to the property.

var someArray = [];
var someArray.someMethod = function(){
    alert("Hello World!");
}

someArray.someMethod(); // should alert

edited Jul 10 '12 at 21:12

answered Jul 10 '12 at 21:11

Justin Niessner

242,243
40
408
536

1

In that function how does one access the array values? – Andrew S Aug 06 '21 at 22:23
Using the `this` keyword var someArray.someMethod = function(){ const firstIndex = this[0] } – jmmendez Jun 25 '22 at 10:57

score 4 · Answer 4 · answered Jul 10 '12 at 21:26

4

function drawChart(){
{
    //...
    var importantVars = [list of important variables];
    importantVars.redraw = function(){
        //Put code from updateChart function here using "this"
        //in place of importantVars
    }
    return importantVars;
}

Doing it like this makes it so you can access the method directly after you receive it.
i.e.

var chart = drawChart();
chart.redraw();

answered Jul 10 '12 at 21:26

Aust

11,552
13
44
74

Frustrating that this answer didn't get more upvotes. This is the only one that addresses the OP: how to actually embed array with the associated function **in the return result**. (As it happens, this is exactly what I needed to know. Thanks, @Aust !) – Mike Williamson Dec 07 '17 at 01:41
Can you access and mutate the array's values from inside that function? – Andrew S Aug 06 '21 at 22:24

score 0 · Answer 5 · answered Mar 03 '17 at 10:06

0

var arr = [];
arr.methodName = function () {return 30;}
alert(arr.methodName);

answered Mar 03 '17 at 10:06

Sandeep Sherpur

2,418
25
27

While this code may answer the question, providing additional context regarding how and/or why it solves the problem would improve the answer's long-term value. – Donald Duck Mar 03 '17 at 12:08

Add a method to Array object in Javascript?

5 Answers5

Linked

Related