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.

thefourtheye · Accepted Answer · 2014-04-29 12:38:36Z

3

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);
}

answered Apr 29, 2014 at 12:38

thefourtheye

241k53 gold badges466 silver badges505 bronze badges

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

1 Comment

James Duffy Over a year ago

This is much better practice than solutions that recommend declaring var randomstring in the global namespace. Now your randomNumber() function can be used more than once as opposed to being a one-time-off function that can't be used for any other purpose.

Quentin · Accepted Answer · 2014-04-29 12:38:21Z

1

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

answered Apr 29, 2014 at 12:38

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Comments

bottens · Accepted Answer · 2014-04-29 12:45:21Z

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

Make it a Global Variable - This is the worst solution.
Rewrite the Update Function - Call the update function with the randomString as a parameter like so:

function update(randomstring) { alert(randomstring); }
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()
})

Manoj Yadav · Accepted Answer · 2014-04-29 12:47:37Z

1

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

edited Apr 29, 2014 at 12:47

answered Apr 29, 2014 at 12:38

Manoj Yadav

6,6121 gold badge25 silver badges21 bronze badges

Comments

Venkat · Accepted Answer · 2014-04-29 12:47:20Z

0

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.

answered Apr 29, 2014 at 12:47

Venkat

628 bronze badges

2 Comments

Derple Over a year ago

Although other answers are great, this answer is exactly what i required. Thanks!

thefourtheye Over a year ago

Unless it is unavoidable, you should not favor this method (for the record, it is very ugly) and go with what I suggested in my answer. If you don't like that, check other answers which at least do this in less ugly manner.

Collectives™ on Stack Overflow

Scope within several functions Javascript

5 Answers 5

1 Comment

Comments

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

Comments

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related