Scope within several functions Javascript

Question

I am trying to produce a variable with one function and use it in another function, and then pass it again to another function from the second function. I have tried placing the variable inside the parenthesis in a multitude of ways but i cannot seem to get the variable to alert in the final function. JSfiddle

function randomNumber(randomstring) {
    var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
    var string_length = 16;
    var randomstring = '';
    for (var i=0; i<string_length; i++) {
        var rnum = Math.floor(Math.random() * chars.length);
        randomstring += chars.substring(rnum,rnum+1);
    }
    //document.randform.randomfield.value = randomstring;
     // alert(randomstring);
}

$("#btn").click( function() {
        randomNumber(); 
        //alert(randomstring);
        update();
});

function update() {
    alert(randomstring);
}

I have gone through several documents on Scope but i cannot see what i am not quite doing right here.

Answer 1

your aren't returning anthing from the first function here is one way to do it by taking randomString as global variable http://jsfiddle.net/venkatjp/GFK6B/2/. return randomstring; in first function and randomstring = randomNumber(randomstring); in click event.

Answer 2

A variable declared within a function, with var statement, is visible only within that function.

So, you can return the randomString and pass that around, like this

function randomNumber(randomstring) {
    ...
    ...
    return randomstring;
}

$("#btn").click( function() {
    update(randomNumber());
});

function update(randomstring) {
    alert(randomstring);
}

Answer 3

You have to declare it in a scope that contains all the functions that use it.

var randomstring; // e.g. here

function randomNumber(randomstring) {
    randomstring = ''; // No var here. Use the existing one, not a new one in local scope

Answer 4

The randomstring variable is with the randomNumber scope. So you have a few options on how to allow the update function to use it.

1. Make it a Global Variable - This is the worst solution.

2. Rewrite the Update Function - Call the update function with the randomString as a parameter like so:

   function update(randomstring) { alert(randomstring); }

3. Create an Object - Wrapping both functions in an object with randomstring being a property of said object. Here is an example:

JSFiddle: http://jsfiddle.net/GFK6B/3/

var obj = {
    randomNumber: function() {
        var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
        var string_length = 16;
        var randomstring = '';
        for (var i=0; i<string_length; i++) {
            var rnum = Math.floor(Math.random() * chars.length);
            randomstring += chars.substring(rnum,rnum+1);
        }

        this.randomstring = randomstring
    },
    update: function() {
        alert(this.randomstring)
    }
}

$("#btn").click(function() {
    obj.randomNumber()
    obj.update()
})

Answer 5

define var randomstring = ''; in global name space, not in randomNumber function

JS

var randomstring = '';
function randomNumber() {
    var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
    var string_length = 16;
    randomstring = '';
    for (var i=0; i<string_length; i++) {
        var rnum = Math.floor(Math.random() * chars.length);
        randomstring += chars.substring(rnum,rnum+1);
    }
}

$("#btn").click( function() {
        randomNumber();
        update();
});

function update() {
    alert(randomstring);
}

Demo Link