Skip to content
Advertisements

JavaScript Let,Var and Const

In ES6, a new way to define the variable is const and let keywords. Before ES6, developers used “var” to report different variables. However, javascript code can cause potential problems or implicit errors in the blog. In this article “const“, “let” and “var” to make the comparison of the keyword.

KeywordVarLetConst
Global Scope YesYesYes
Function Scope YesYesYes
Blok Scope NoYesYes
Reassignable YesYesNo

Before ES2015, JavaScript had only two scopes: Global Scope and Function Scope. ES6 came with local Scope.

cope: The variable is named according to the region you define and the variable is called with the name of that region.

Global Scope: The variable defined in any part of the JavaScript code declared outside of a function and block is GLOBAL.

Local Scope: The variables defined in a function are Local variables. You cannot access these variables from the outside.

Block Scope: The block scope is called the section between all kinds of {} curly brackets. as if-for statements.


Global Scope

Globally declared variables (except for any function) have Global Scope.

        var name = "rick";
        console.log(name);

        function myFunction() {
            console.log(name);
        }
        myFunction();

Public variables can be accessed from anywhere in a JavaScript program.

Function Scope

The variables declared as Local (in Function) have the scope of Function.

        //the "name" code is not used here.

        function myFunction() {
            var name = "rick"
            //the "name" code is used here.
        }
        //the "name" code is not used here.

Local variables can only be accessed through the function they specify.

JavaScript Block Coverage

The variables declared with the Var keyword cannot have Block Coverage.

The variables reported in a {} block can be accessed from outside the block.

        if (true) {
            var country = "TURKEY";
        }
        console.log(country);

Before ES2015, JavaScript did not have Block Coverage.

The variables declared with the Let keyword can have Block Coverage.

The variables declared in a {} block cannot be accessed from outside the block:

        if (true) {
            let country = "TURKEY";
        }
        console.log(country);

        // output: country is not defined

Rewriting of Variables

Rewriting a variable using the var keyword can cause problems.

If a variable in a block is changed again, and a variable is printed outside the block, the new value is written.

        var number = 10;
        // where "number" is 10


        if (true) {
            var number = 100;
            // where "number" is 100
        }
        
        // where "number" is 10

You cannot change a variable by using the Let keyword.

To redefine a variable within a block will not change the value of the variable outside the block.

        var number = 10;
        // where "number" is 10


        if (true) {
            let number = 100;
            // where "number" is 100
        }

        
        // where "number" is 10

Loop Scope

        var i = 5;
        
        for (var i = 0; i < 10; i++) {
            // codes
        }
        console.log(i) // 10

As shown in the example above, the output is 10. In the loop, i is i = 10, and the variable that is defined by var in the block is specified in the loop, so the new value takes the value in the loop.

In this example, if we define the Variable with let:

        let i = 5;
        
        for (let i = 0; i < 10; i++) {
            // codes
        }
        console.log(i) // 5

In the scope of the block scope in the loop, the variable i applies consola 5 because it is i = 5 in the global scope.

Function Scope

The keywords “exist” and “let” have the same properties as the function scope. Both have a function scope, but they are not valid except for the function.

        function myFunction() {
            var name = "alex"
        };

        function myFunction() {
            let name = "alex"
        }

Global Scope

Variables declared with var, let, and const are quite similar when reported outside the block. All three will have a Global Coverage.

        var number = 10; // Global scope

        let number = 10; // Global scope

        const number = 10; // Global scope

Global Object

The global object of JavaScript is the window object in web browsers.

The global variables defined by the keyword “var” belong to the global window object. The window object has problems with speed.

All the properties of the global object are global variables. In general terms, the following notices generate such features:

  • var notification
  • Function notification

But now there are also global variables that are not properties of the global object. In the global scope, the following notices generate such variables.

  • let notice
  • const declaration
  • Class declaration

example:


        var sayi = 50;
        console.log(window.sayi) // 50
 
        let sayi = 50;
        console.log(window.sayi) //undefined

Rise

One of the oddities of Javascript is that you can use variables and functions even before they are declared. This is called hoisting. An upgrade is the default behavior of JavaScript that carries a declaration to the top of the current script or current function. If a variable is defined in a function, the notification is maximized within the function and if the function is defined outside the function, the notification is raised to the top of the global context.

Variables defined by Var are raised to the top. (Js hoisting)

You can use a variable before it is declared:


        myFunction();

        function myFunction() {
            console.log("hello");
        }

The function works “hello” prints on the console. Another example:

        name = "rick";

        console.log(name);

        var name;

The variables defined by Let cannot be raised to the top.
Using a let variable before declaring will result in ReferenceError.

Temporary Dead Zone: You cannot access the variable before defining it.

        name = "rick";

        console.log(name);

        let name;

Re-specify

It is possible to specify a JavaScript variable anywhere in a program with the Var variable:

        var num = 10;
        console.log(num); // 10

        var num = 20; // 20
        console.log(num);

In JAVAScript you cannot redefine the var and let variable, the same scope, or in the same block, is not allowed:

        var num = 10; // Allowed
        let num = 20; // It is not allowed

        {
            var number = 1; // Allowed
            let number = 2; // It is not allowed
        }

A let variable is not allowed to be notified with a let in the same scope or in the same row:


        let num = 10; // Allowed
        let num = 20; // It is not allowed

        {
            let number = 1; // Allowed
            let number = 2; // It is not allowed
        }

Let redefine and var variable is not allowed in the same scope, or in the same block, as:

        let num = 10; // Allowed
        var num = 20; // It is not allowed

        {
            let number = 1; // Allowed
            var number = 2; // It is not allowed
        }

Const Notification

        const PI = 3.14;

        console.log(PI);

        PI = 10;

The Const keyword is a bit misleading.

It does not define a fixed value. Defines a constant reference to a value.

Therefore, we cannot change fixed primitive values, but you can still change object properties and array elements.

        // You can create a const object:
        const car = { type: "Fiat", model: "Egea", color: "white" };

        // You can change a property:
        car.color = "red";

        //  You can add a property:
        car.fuel = "diesel";


        // Change array element

        const COLORS = ["red", "green", "blue"];

        console.log(COLORS[0]); // red

        COLORS[0] = "yellow";

        console.log(COLORS[0]); // yellow

The const keyword makes it possible to define constants. Constants are read-only, you cannot assign new values to variables defined by const.

Ways or styles to name variables

snake_case:

        var code_name = "javaScript";

camelCase:

var codeName = "javascript";
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: