Passing an array.push function in javascript

Question

I have a problem passing an array.push function in javascript having a code like this:

const array = [];
    addToArray("works", (e) => array.push(e));
    addToArray("notWorks", array.push);
    doConsoleLog("hello", console.log);
    
    function addToArray(element, pushFn) {
      pushFn(element);
    }
    
    function doConsoleLog(message, log) {
      log(message);
    }

Just curious how's that first call of addToArray works, but second causes TypeError: Cannot convert undefined or null to object. How is it possible? Type of array.push is a function. It is not possible to pass functions directly like in the case of console.log above, which works pretty well?

very related: string-methods-with-higher-order-functions

ASDFGerte
– ASDFGerte

2020-05-01 20:20:58 +00:00
Commented May 1, 2020 at 20:20 — ASDFGerte
– ASDFGerte, Commented May 1, 2020 at 20:20

Marco Bonelli · Accepted Answer · 2020-05-01 21:14:44Z

4

push is a method of array. When invoked, it uses this as a reference to the object it is being called on. If you pass it around like a normal function, you will lose that reference, the method will use the value of this defined at the moment of the call (inside addToArray, this is probably document.window), and will therefore fail.

In order to pass around a method, you need to bind it to the object you want it to operate on, in this case array. This is true for any object method in JavaScript. Function.prototype.bind() exists exactly for this purpose: it "binds" a function (in this case your method) to a given value of this, in order to work correctly.

const array = [];

addToArray("now it works", array.push.bind(array));
// or
addToArray("now it works", Array.prototype.push.bind(array));

function addToArray(element, pushFn) {
  pushFn(element);
}

edited May 1, 2020 at 21:14

answered May 1, 2020 at 20:26

Marco Bonelli

71.1k21 gold badges129 silver badges153 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Askish · Accepted Answer · 2020-05-01 20:25:29Z

-1

Once you pass a function like you did in the second case, it executes itself immediately, and array.push doesn't really mean something.
A callback function should be executed later on in the outer function.
Unlike the second example, in the first one you don't execute the function immediately, but only when you call it inside the outer function.

answered May 1, 2020 at 20:25

Askish

972 silver badges20 bronze badges

Comments

UlanTursunbek · Accepted Answer · 2020-05-01 20:28:20Z

-2

Your code have a lot of mistakes. What exactly should do this code? if you want to push new items in array use spread operator

const array = [...[], "works", "notWorks"]


const array = [];
        addToArray("works", (e) => array.push(e));
        addToArray("notWorks", array.push);
        doConsoleLog("hello", console.log);

    function addToArray(element, pushFn) {
      pushFn(element); //function must return something
    }

    function doConsoleLog(message, log) {
      log(message);  //function must return something
    }

answered May 1, 2020 at 20:28

UlanTursunbek

223 bronze badges

Collectives™ on Stack Overflow

Passing an array.push function in javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related