Callback Function executing multiple times

Question

I am learning call back functions in Javascript and hence trying to execute a function that uses call back function

var allUserDdata = [];

function logStuf(userData) {
	if (typeof(userData) === "string") {
		console.log(userData);
	} else if (typeof(userData) === "object") {
		for (var items in userData) {
			console.log(items, userData[items]);
		}
	}
}

function getInput(options, callback){
	allUserDdata.push(options);
	callback(allUserDdata);
}

getInput("Alex", logStuf);
getInput({ "Name": "Alex", "Place": "Malaysia" }, logStuf);

Instead of printing the output as:

0 Alex
1 {Name: "Alex", Place: "Malaysia"}

Its printing the output as:

0 Alex
0 Alex
1 {Name: "Alex", Place: "Malaysia"}

May I know why? Also, I am in the beginner's phase of learning Javascript so please ignore if its a stupid question.

The answer which was accepted as correct answer achieves not the goal of the task. In your question you have different task asked. At second I answered at first yor question correctly. It is not fair. — Bharata
– Bharata, Commented Jul 19, 2018 at 6:13

CertainPerformance · Accepted Answer · 2018-07-19 05:49:04Z

1

Every time getInput is called, you're pushing to the allUserDdata array, and then the whole allUserData is piped to callback. So if you only want to log the item that getInput was called with and not the whole array, call callback on the item, not the array:

var allUserDdata =[];

function logStuf(userData){
	if (typeof(userData)==="string"){
		console.log(userData);
	}

	else if (typeof(userData)==="object") {
		for (var items in userData) {
			console.log(items, userData[items]);
		}
	}
}

function getInput(options, callback){
	allUserDdata.push(options);
	callback(options);
}

getInput("Alex", logStuf);
getInput({"Name":"Alex", "Place":"Malaysia"}, logStuf);

answered Jul 19, 2018 at 5:49

CertainPerformance

373k55 gold badges354 silver badges359 bronze badges

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

Comments

brk · Accepted Answer · 2018-07-19 05:59:42Z

Two things here. Consider this set of inputs

getInput("Alex", logStuf);
getInput({ "Name": "Alex", "Place": "Malaysia" }, logStuf);

the output is

 0 Alex
    0 Alex
    1 {Name: "Alex", Place: "Malaysia"}

this is because the allUserDdata is declared outside all the functions , so the array already contain the previous input. When the second input is fed to to it will have total two elements, therefore the logStuf will iterate over two elements.

So you can keep this array inside the getInput function.

Secondly allUserDdata is an array , to iterate an array never use for..in

//var allUserDdata = [];
function logStuf(userData) {
  if (typeof(userData) === "string") {
    console.log('Here', userData);
  } else if (Array.isArray(userData)) {
    userData.forEach(function(item, index) {
      console.log(index, item)
    })
  }
}

function getInput(options, callback) {
  var allUserDdata = [];
  allUserDdata.push(options);
  callback(allUserDdata);
}

getInput("Alex", logStuf);
getInput({
  "Name": "Alex",
  "Place": "Malaysia"
}, logStuf);

Vinod Sai · Accepted Answer · 2018-07-19 05:51:16Z

0

You have called logStuf function twice

First time it logged 0 Alex

Second time it logged 0 Alex 1 {Name: "Alex", Place: "Malaysia"}

May be you can call logstuff at the second time only

var allUserDdata = [];

function logStuf(userData) {
  if (typeof(userData) === "string") {
    console.log(userData);
  } else if (typeof(userData) === "object") {
    for (var items in userData) {
      console.log(items, userData[items]);
    }
  }
}

function getInput(options, callback) {
  allUserDdata.push(options);
  if (callback) {
    callback(allUserDdata);
  }
}

getInput("Alex");
getInput({
  "Name": "Alex",
  "Place": "Malaysia"
}, logStuf);

answered Jul 19, 2018 at 5:51

Vinod Sai

2,1323 gold badges17 silver badges26 bronze badges

Comments

Bharata · Accepted Answer · 2018-07-19 05:54:57Z

0

You have called getInput function twice. Your mistake: you have to set your variable allUserDdata to new array in the function getInput.

var allUserDdata =[];

function logStuf(userData)
{
    if(typeof(userData)==="string")
    {
        console.log(userData);
    }

    else if(typeof(userData)==="object")
    {
        for(var items in userData)
        {
            console.log(items, userData[items]);
        }
    }
}

function getInput(options, callback)
{
    allUserDdata = []; // the mistake: you have to set it to new array
    allUserDdata.push(options);
    callback(allUserDdata);
}

getInput("Alex", logStuf);
getInput({"Name":"Alex", "Place":"Malaysia"}, logStuf);

edited Jul 19, 2018 at 5:54

answered Jul 19, 2018 at 5:49

Bharata

14.2k6 gold badges44 silver badges54 bronze badges

Collectives™ on Stack Overflow

Callback Function executing multiple times

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related