Understanding Variable Scopes in JavaScript

A variable is a named container used for storing values. A piece of information that we might reference multiple times can be stored in a variable for later use or modification. In JavaScript,the value contained inside a variable can be any JavaScript data type, including a number, string,or object.

In JavaScript, there are two types of scopes
Global Scope – Scope outside the outermost function attached to window.Local Scope – Inside the function being executed.
Let’s look at the code below. We have a global variable defined in first line in global scope. Then we have a local variable defined inside the function fun().

let globalLet = "This is a global variable";
   
function fun() {
  let localLet = "This is a local variable";
   
  console.log(globalLet); // This is a global variable
  console.log(localLet); // This is a local variable
}
fun(); 

Output:

When we execute the function fun(), the output shows that both global, as well as local variables, are accessible inside the function as we are able to console.log them. This shows that inside the function we have access to both global variables (declared outside the function) and local variables (declared inside the function). Let’s move the console.log statements outside the function and put them just after calling the function.

let globalLet = "This is a global variable";
   
function fun() {
  let localLet = "This is a local variable";
   
}
fun();
  console.log(globalLet); // This is a global variable
  console.log(localLet); // localLet is not defined 

Output:

We are still able to see the value of the global variable, but for local variable console.log throws an error. This is because now the console.log statements are present in global scope where they have access to global variables but cannot access the local variables.

Word of caution: Whenever you are declaring variables, always use the prefix let. If you don’t use the let keyword, then the variables are by default created in the global scope. For instance, in the above example, let’s just remove the keyword let before the declaration of localLet.

let globalLet = "This is a global variable";
   
function fun() {
   localLet = "This is a local variable";
}
   
fun();
  console.log(globalLet); // This is a global variable
  console.log(localLet); // This is a local variable 

Output:

We are now able to console.log the local variable as well because the localLet was created in the global scope as we missed the keyword let while declaring it. What really happened is that as we didn’t use the let keyword, JavaScript first searched the localLet in local scope, then in the global scope. As there was no existing global variable by that name, so it created a new global variable.

One of the most asked questions in interviews is the scenario where the global as well as local variable has the same name. Let’s see what happens then.

let globalLet = "This is a global variable";
   
function fun() {
  let globalLet = "This is a local variable";
}
fun();
console.log(globalLet); // This is a global variable 

Output:

In this example, we have the declared a local as well as global variable “globalLet”. What matters here is the scope in which we are accessing it. In the above example, we are accessing it in global scope, so it will output the global variable as local variable is not present in its scope.Let’s move the console.log statement inside the function fun().

let globalLet = "This is a global variable";
   
function fun() {
  let globalLet = "This is a local variable";
  console.log(globalLet); // This is a local variable
}
fun(); 

Output:

Inside the function fun(), both the local as well as global variables are accessible. But when we console.log the variable globalLet, firstly JavaScript tries to find a local variable in the current scope. It finds the local variable and outputs it. Otherwise it would have search for the variable “globalLet” in the outer scope (which in this case is global scope).

What if we want to access the global variable instead of local one here. Well, the window object comes to our rescue. All the global variables are attached to window object and thus we can access the global variable name as shown in example below.

let globalLet = "This is a global variable";
   
function fun() {
  let globalLet = "This is a local variable";
  console.log(window.globalLet); // This is a global variable
}
fun(); 

Output:

After discussing about scopes in JavaScript, guessing the output of below code fragments should be a cakewalk.

function fun(){
    function fun2(){
         i = 100;
    }
    fun2();
    console.log(i); // 100
}
fun();  

Output:

function fun(){
    function fun2(){
        let i = 100;
    }
    fun2();
    console.log(i); // i is not defined 
}
fun(); 

Output:

In the first example as we didn’t use the keyword let, the variable “i” was assumed to be declared in global scope and thus the output was 100. In the second example, “i” became a local variable and thus was not accessible outside the scope of that function.

Let’s look at another example-

function fun(){
    if(true){
        let i = 100;
    }
    console.log(i); // i is not defined
}
fun(); 

Output:

After ES2015, we started using let instead of var for declaring variables and also now the if block is also counted as a block scope, hence in the above example we get an error instead of the value 100. If we change the let to var we will get 100 as output as if block was not considered a block scope earlier, only functions were.

#javascript #web-development

What is GEEK

Buddha Community

Scope of a Variable In Java [With Coding Example]

Introduction

Programmers define the scope of a Variable in Java that tells the compiler about the region from where a variable is accessible or visible. The scope of a variable in Java is static by nature. It means we have to declare it at compile time only. In this article, you will learn about the scope of a Java variable along with its types

What is the Scope of a Variable in Java?

Salient Points About the Scope of a Variable in Java

Conclusion

#full stack development #java variable #scope of a variable in java #variable #scope of a variable #scope

The essential JavaScript concepts that you should understand

As a JavaScript developer of any level, you need to understand its foundational concepts and some of the new ideas that help us developing code. In this article, we are going to review 16 basic concepts. So without further ado, let’s get to it.

#javascript-interview #javascript-development #javascript-fundamental #javascript #javascript-tips

What is JavaScript - Stackfindover - Blog

Who invented JavaScript, how it works, as we have given information about Programming language in our previous article ( What is PHP ), but today we will talk about what is JavaScript, why JavaScript is used The Answers to all such questions and much other information about JavaScript, you are going to get here today. Hope this information will work for you.

Who invented JavaScript?

JavaScript language was invented by Brendan Eich in 1995. JavaScript is inspired by Java Programming Language. The first name of JavaScript was Mocha which was named by Marc Andreessen, Marc Andreessen is the founder of Netscape and in the same year Mocha was renamed LiveScript, and later in December 1995, it was renamed JavaScript which is still in trend.

What is JavaScript?

JavaScript is a client-side scripting language used with HTML (Hypertext Markup Language). JavaScript is an Interpreted / Oriented language called JS in programming language JavaScript code can be run on any normal web browser. To run the code of JavaScript, we have to enable JavaScript of Web Browser. But some web browsers already have JavaScript enabled.

Today almost all websites are using it as web technology, mind is that there is maximum scope in JavaScript in the coming time, so if you want to become a programmer, then you can be very beneficial to learn JavaScript.

JavaScript Hello World Program

In JavaScript, ‘document.write‘ is used to represent a string on a browser.

<script type="text/javascript">
	document.write("Hello World!");
</script>

How to comment JavaScript code?

• For single line comment in JavaScript we have to use // (double slashes)
• For multiple line comments we have to use / * – – * /

<script type="text/javascript">

//single line comment

/* document.write("Hello"); */

</script>

Advantages and Disadvantages of JavaScript

#javascript #javascript code #javascript hello world #what is javascript #who invented javascript

Hire Dedicated JavaScript Developers -Hire JavaScript Developers

It is said that a digital resource a business has must be interactive in nature, so the website or the business app should be interactive. How do you make the app interactive? With the use of JavaScript.

Does your business need an interactive website or app?

Hire Dedicated JavaScript Developer from WebClues Infotech as the developer we offer is highly skilled and expert in what they do. Our developers are collaborative in nature and work with complete transparency with the customers.

The technology used to develop the overall app by the developers from WebClues Infotech is at par with the latest available technology.

Get your business app with JavaScript

For more inquiry click here https://bit.ly/31eZyDZ

Book Free Interview: https://bit.ly/3dDShFg

#hire dedicated javascript developers #hire javascript developers #top javascript developers for hire #hire javascript developer #hire a freelancer for javascript developer #hire the best javascript developers

JS Development Company India | JavaScript Development Services

PixelCrayons: Our JavaScript web development service offers you a feature-packed & dynamic web application that effectively caters to your business challenges and provide you the best RoI. Our JavaScript web development company works on all major frameworks & libraries like Angular, React, Nodejs, Vue.js, to name a few.

With 15+ years of domain expertise, we have successfully delivered 13800+ projects and have successfully garnered 6800+ happy customers with 97%+ client retention rate.

Looking for professional JavaScript web app development services? We provide custom JavaScript development services applying latest version frameworks and libraries to propel businesses to the next level. Our well-defined and manageable JS development processes are balanced between cost, time and quality along with clear communication.

Our JavaScript development companies offers you strict NDA, 100% money back guarantee and agile/DevOps approach.

#javascript development company #javascript development services #javascript web development #javascript development #javascript web development services #javascript web development company