DEV Community

Cover image for #Day31 — From Python to JavaScript — The Basics Part 4
Rahul Banerjee
Rahul Banerjee

Posted on • Originally published at realpythonproject.com

#Day31 — From Python to JavaScript — The Basics Part 4

In the last article, we talked about the following

  • Today, we will be discussing the following
  • Function Definitions
  • Positional and Keyword/Named Parameters
  • Arrow Functions in Javascript

Today we will discuss variable's scope in Python and JavaScript. We will discuss the following

  • Blocks
  • Global Variables
  • Local/Block Variables and Accessing them outside a Block
  • Global and Local Variables with the same name

Blocks

Python

In Python, blocks are declared using the ":" operator. The code inside the block has to be indented.

def func():
  print("This statement is inside a block")
  print("This statement is inside a block as well")

print("This statement is outside the above block")
Enter fullscreen mode Exit fullscreen mode

JavaScript

In JavaScript, we can start a block using the "{" operator and end the block using the "}" operator. The code inside the "{" and "}" is inside the block. Although indentation is not necessary, it's a good practice to indent your code. It improves readability

const func = () => 
{
  console.log("This statement is inside a block")
  console.log("This statement is inside a block as well")
}

console.log("This statement is outside the above block")
Enter fullscreen mode Exit fullscreen mode

Global Variables

Global variables are variables that are declared outside a block

Python

In Python, we can either access the global variable or update the global variable. We can use the variable as it is if we plan to access it. However, if we want to update it, we will need to use the global keyword

global_variable = "I am a global variable"

'''
  Accessing Global Variable
'''
def func1():
  print(global_variable)

'''
  Updating Global Variable
'''
def func2():
  global global_variable
  global_variable += ".....Updating"
  print(global_variable)
Enter fullscreen mode Exit fullscreen mode

JavaScript

Unlike Python, in JavaScript, we can access as well as update the variable as it is, i.e we don't need any extra statements/keywords like global

var global_variable = "I am a global variable"

/*
  Accessing Global Variable
*/
func1 = () => {
  console.log(global_variable)
}

/*
  Updating Global Variable
*/
func2 = () => {
  global_variable += ".....Updating"
  console.log(global_variable)
}
Enter fullscreen mode Exit fullscreen mode

Local/Block Variables and Accessing them outside a Block

Python

  • A local variable declared inside a function CAN NOT be accessed outside the function block
  • A local variable declared inside an if/else block or a loop CAN be accessed outside the block
def func():
  local_variable = "I am a local variable"
  print(local_variable)

func()
print(local_variable)
Enter fullscreen mode Exit fullscreen mode

You'd get the following error

NameError: name 'local_variable' is not defined
Enter fullscreen mode Exit fullscreen mode

Let's try to access a local variable declared inside an if/else block

if True:
  local_variable = "I am a local variable"
  print(local_variable)

print(local_variable)
Enter fullscreen mode Exit fullscreen mode

The above code snippet doesn't result in any error

JavaScript

JavaScript is similar to Python

  • A local variable declared inside a function CAN NOT be accessed outside the function block
  • A local variable declared inside an if/else block or a loop CAN be accessed outside the block
func = () =>{
  var local_variable = "I am a local variable"
  console.log(local_variable)
}

func()
console.log(local_variable)
Enter fullscreen mode Exit fullscreen mode

You'd get the following error

ReferenceError: local_variable is not defined
Enter fullscreen mode Exit fullscreen mode

If we try to access a local variable declared inside an if/else block

if(true){
  var local_variable = "I am a local variable"
  console.log(local_variable)
}

console.log(local_variable)
Enter fullscreen mode Exit fullscreen mode

The above code snippet will not result in any error

Global and Local Variables with the same name

NOTE: HAVING GLOBAL VARIABLES AND LOCAL VARIABLES WITH THE SAME NAME IS BAD PRACTICE!!! IT CAN LEAD TO UNNECESSARY COMPLICATIONS

Let's look at a few code-snippets.

First, let's take a look at a Python snippet with a function.

string = "Global Variable"

def func():
  string = "Local variable"
  print(string)

func()
print(string)
Enter fullscreen mode Exit fullscreen mode

Below is the output

Local variable
Global Variable
Enter fullscreen mode Exit fullscreen mode
  • We have a global variable called string which has the value Global Variable
  • Inside the function, when we are assigning the value "Local variable" to the variable string, we actually create a local variable called string. Therefore, any reference to string inside the block is to the local variable string. Basically, we have temporarily overwritten the global variable
  • Outside the block, the local variable string* no longer exists and any reference to **string is made to the global variable string

To avoid creating a local variable inside the function, we could use the global keyword discussed earlier.

Now let's try something similar in JavaScript

var string = "Global Variable"

const func = () => {
  string = "Local Variable"
  console.log(string)
}

func()
console.log(string)
Enter fullscreen mode Exit fullscreen mode

Below is the output

Local Variable
Local Variable
Enter fullscreen mode Exit fullscreen mode
  • We defined a global variable string
  • Inside the function, we don't define a new local variable since we don't use the let or var keywords. Therefore inside the function, any reference to variable string is a reference to the global variable. As a result, "Local Variable" is the output
  • Since we updated the global variable in the function, the console statement outside the functions also outputs the updated value

Now let's try defining a local variable with the var keyword

var string = "Global Variable"

const func = () => {
  var string = "Local Variable"
  console.log(string)
}

func()
console.log(string)
Enter fullscreen mode Exit fullscreen mode

Now the functionality is similar to the Python snippet we discussed above. Below is the output

Local Variable
Global Variable
Enter fullscreen mode Exit fullscreen mode

Top comments (0)