Passing data in JavaScript

Question

Having a problem understanding what I will call a variable scope question for lack of a better description.

Say I have a page with two functions, one() and two(). The first function has a locally-scoped variable x with an object in it. This function builds an element, below, in the DOM and this element contains an onClick, which calls the second function, and needs to pass x to the second function as an argument. I.e. the second function needs access to the data that is scoped to the first function.

I have tried:

<something onClick="two(x);">

but this doesn't seem to work. I know that there is a way to make x global but I have found in my other languages that globally-scoped variables are discouraged as being dangerous.

It would help if you posted some code, we could make suggestions. You can put var x = 'something' straight into a <script> tag before the functions are defined. That will make it global, but this is not a great idea if you don't have to do it. — Brian Hoover
– Brian Hoover, Commented Sep 29, 2011 at 20:14

someone · Accepted Answer · 2011-09-29 20:30:12Z

1

How about using closure:

function one()
{
    var x = Math.random();
    var el = document.createElement('div');
    el.innerHTML='Hi!';
    el.addEventListener("click", function(){two(x)}, false); 
    document.getElementById('myDiv').appendChild(el); 
}
function two(text)
{
    alert(text);
}
one();

Demo

edited Sep 29, 2011 at 20:30

answered Sep 29, 2011 at 20:18

someone

1,4788 silver badges9 bronze badges

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

1 Comment

bethesdaboys Over a year ago

This did indeed work. This was the kind of pattern I was looking for. I was a little surprised that more people did not have a standard response for this, as I would think this would be a very common requirement in JavaScript. This leads me to believe that a lot of people are using globally-scoped variables where they don't have to worry about such things.

David Hellsing · Accepted Answer · 2011-09-29 20:19:42Z

1

Using a global variable within a function is not necessarily bad, but it is considered bad practice to place variables in the window scope, which is assumed if you don’t wrap your variables inside a function or object.

Consider this example:

(function() {
  var x = 1;
  function callback() {
    alert(x);
  }
  function bind() {
    x++;
    elem.onclick = callback;
  }
}());

answered Sep 29, 2011 at 20:19

David Hellsing

109k44 gold badges181 silver badges214 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 09:59:38Z

0

You should read up on variable scope.

The function closure of one() has access to x. But since it exists in one() and not outside other functions will not have access to it. So you are putting two(x); in your onClick, which will try to resolve the x to a global scope. And there is no global x

You can easily fix this by making x global. Just place var x beside your functions.

edited May 23, 2017 at 9:59

CommunityBot

11 silver badge

answered Sep 29, 2011 at 20:19

Marshall

4,7961 gold badge21 silver badges15 bronze badges

Comments

owen gerig · Accepted Answer · 2011-09-29 20:20:24Z

0

to make x global declare it outside of the method

var x = 0

function one()

x=1

function two()

print x

x will print 1

answered Sep 29, 2011 at 20:20

owen gerig

6,2047 gold badges56 silver badges95 bronze badges

2 Comments

someone Over a year ago

You're missing some curly brackets ({} and semicolons (;). Also, there's no print function in javascript (except involving a physical printer). Finally, the OP knows that there is a way to make x global but doesn't want to do that, for good reason.

owen gerig Over a year ago

this was more pseudo than anything, and he wanted to know how to interchange data between methods, this would work, i might not get points but the knowledge is there

Collectives™ on Stack Overflow

Passing data in JavaScript

4 Answers 4

1 Comment

Comments

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related