Global & Local variables


#1


I found a post from May of last year by jaydacoder addressing this issue, but I'm hoping someone can explain why in this lesson when changing the global variable number & not adding "var" to the function variable, why both answers are the same as the function answer. Shouldn't the global answer remain unaffected by the local function?
I followed the instructions & completed the lesson but didn't fully understand the actions.


https://www.codecademy.com/en/courses/javascript-beginner-en-6LzGd/2/2?curriculum_id=506324b3a7dffd00020bf661



Replace this line with your code.


#2

The error message is pretty straight forward... Use the var keyword in your function.


#3

Thanks for the reply.
I did do that but wanted to understand the actions, so I went back & played with it but couldn't understand why this was the case.


#4

Technically a global variable does not need to be declared.

a = 42

console.log(window.a)    // 42

The variable is in global scope since we can access it as an attribute of the global object, 'window'.

Only inside a function is the var keyword of any importance. Then it is defined in local scope and encapsulated as a local variable. This gives not only scope, but context. An instance of the function that encapsulates a variable would have its own captured value in that variable.


#5

var number = 10;
console.log(number +" = "+window.number);
function test(number){
    //=parameter= number is automatically 
    // declared as a local-variable within the =function-body=
   console.log(number +" = "+window.number);
   }
test(20);

#6

Please forgive me, I'm new to coding & am beginning to think I may not be able to understand the explanations many of you may provide at this point in my learning process.
I'm still not understanding why after the global "my_number" was declared as 5, when the console.log(my_number) was called at the bottom of the code the local/function number was listed for both the local & global console.log command.
Again I did complete the lesson but wanted to see what would happen if I didn't put the "var" keyword in the "local" function.
I appreciate the previous replies.


#7

Leon raises a good point. Parameters are always local variables, but there is an exception in JavaScript. The value represented by the variable must be a primitive (a number, a string, a boolean) else it will not be exclusive to the function.

Primitives are copied to the parameter when passed as arguments.

function foo(number) {
    number *= 2;
    return number
}

num = 42;
console.log(foo(num))    // 84
console.log(num)    // 42

function bar(numbers) {
    for (var i = 0; i < numbers.length; i++) {
        numbers[i] *= 3;
    }
}

nums = [3, 5, 7, 9]
bar(nums);
console.log(nums)    // [9. 15. 21. 27]

In the second example, nums is an array which in technical terms is a reference object. When we pass it to a function as an argument, only its location is passed in. The local variable only refers to it, but is not a copy. As we can see, the global object is affected directly by the function. Notice we did not have a return statement?


#8

When a variable is used inside a function without the var keyword, it is declared in global scope if it does not exist already. If it does exist, then the function refers to that variable. It is not treated as local. The function looks up the scope chain to find it.

When we use the var keyword to declare the local variable then it shadows the global variable so that the function can no longer see it, and will not look up the scope chain to find it.


#9

Okay, I will remember this rule.
Thank you for the understandable explanation!
Still learning!


#10

A term you may run across from time to time is namespace. I won't attempt to formally define the term as a quick search will come up with much better explanantions. Think of it loosely as a contained region in memory that contains our code and its objects.

The window object mentioned earlier is like the root element of an HTML page. It is the global namespace which is the top of the scope chain.

A function is an object with its own namespace. Functions are said to have closure around their own objects. That is the environment that scope describes.

Let's review the shadowing idea...

my_var = 42;
function foo() {
    console.log(my_var);    // 42
}

function bar() {
    var my_var;
    console.log(my_var);    // undefined
}

In the first example, the function looks up the scope chain to find the variable that is queried since it is not found locally.

In the second example, the variable is declared locally so moves to the top of local scope (hoisting). It is not given a value but does exist so won't raise an error. The function finds it locally so does not look up the scope chain.


#11

Makes sense, I'm understanding it better now.
Thanks
I appreciate the help!


#12

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.