1

I want to use a local variable as a global variable and I was told the way to do so is to create the variable outside the function, like this:

        var foo = null;

        function bar() {
            foo = 3;
        }

        console.log(foo);

However the foo logs null, instead of 3. This is the simplest example I could think of, but mainly I want to be able to use the data from a variable I created in a function throughout my whole script.

What am I doing wrong?


Same question in an Ajax request :

var status = null;

.ajax({
  url: myUrl, 
  success: function (data) {
    status = data.status; //returns a string
    console.log(status); // it works, I get the string
  }, 
  dataType: 'jsonp' 
});

console.log(status); // still null
SimeriaIonut
  • 516
  • 2
  • 11
  • 20
  • It's very simple. Just need to think little bit more. If you call bar() function, then foo value be updated (null to 3) otherwise it will show you null. – Puneet Chawla Jul 11 '15 at 15:53
  • Hey, thanks for the answer, my dumb mind could not see a thing so simple. But how about the Ajax problem? – SimeriaIonut Jul 11 '15 at 18:43
  • Status value will be null, if you get it outside of ajax call. If you want to get outside of ajax then, it means you want to implement any other thing by status value, so whether you have to call function as specified by @Get Off My Lawn or you can use also callback. In both cases, it will be called everytime. – Puneet Chawla Jul 12 '15 at 03:11
  • Just try one thing - add a ajax call coding in separate function suppose abc() . use "var status = null" in outside of every function just like globally. And use "console.log(status); " in separate function suppose abc2(). When you want to use that status value then call that function abc2() otherwise don't. I have tried it's working here. I hope, it will help you. – Puneet Chawla Jul 12 '15 at 03:23

1 Answers1

3

You need to call the function first like this.

    var foo = null;

    function bar() {
        foo = 3;
    }

    bar();
    console.log(foo);

Your best bet here is to call a function that logs the data after the ajax runs. In this example I created a function called logit() which is called in the ajax request state.

var status = null;

$.ajax({
  url: myUrl, 
  success: function (data) {
    status = data.status; //returns a string
    console.log(status); // it works, I get the string
    logit();
  }, 
  dataType: 'jsonp' 
});

function logit(){
    console.log("logit(): " + status);
}

The reason you are getting null is because this is the order that your code is running:

  1. sets status to null
  2. saves the ajax to memory to run when the requests completes this doesn't actually run yet
  3. logs status which is still null because the success callback hasn't run yet
  4. the ajax request finally completes and runs the success callback
  5. status is set to data.status
Get Off My Lawn
  • 34,175
  • 38
  • 176
  • 338
  • Okaay, this makes sense. What if I have an ajax call with a function on success? Then I can't really call the function because it gets called when the ajax request runs. – SimeriaIonut Jul 11 '15 at 15:05
  • It should work somewhat the same way, you would need to share the code for a better answer on that though – Get Off My Lawn Jul 11 '15 at 15:06
  • So the best practice is to run a function to save all the data? It doesn't sound so practical, how do huge projects manage to cope with that? – SimeriaIonut Jul 11 '15 at 17:02