Uncaught Typeerror: Cannot Read Property 'includes' of Undefined

In JavaScript, variables tin can be declared using three different methods: var, allow, and const. In this web development tutorial, we will hash out the differences between these three ways of creating variables.

Variable Declaration in JavaScript

In the early days of JavaScript, there was only ane style to declare variables and that was using the var keyword. However, in that location were some issues associated with variables declared using the var keyword then information technology was necessary to evolve new ways for variable annunciation. With the advent of ES6, now developers are able to define variables according to their specific needs, thanks to two new keywords: permit and const.

All three of these iii keywords have similarities in their syntax for declaring variables. However, they differ in their usage and scope, as detailed in the side by side section.

Read: Common Causes of JavaScript Errors and How to Avoid Them

var, let, and const Variable Declaration in JavaScript

The differences between var, allow, and const variable proclamation in JavaScript include:
Variables alleged with var and const are scoped to the immediate office trunk.
Variables declared with the var keyword are hoisted. Hoisting ways that the variable can exist accessed in their enclosing scope even before they are declared.
Variables alleged with the permit keyword are block-scoped, which means the variables will accept scope to the immediate enclosing block.

Let united states of america now discuss, in detail, how these keywords can make a developer's code more efficient and how to utilise each keyword to declare variables in JavaScript programs.

How to Use the var Keyword in JavaScript

The var keyword has traditional variable declaration syntax. It is optional to initialize a variable with a value if it is declared with the var keyword. If developers do not initialize it with a value, JavaScript volition automatically assign undefined to it, as shown in the following code snippet:

var i;  // i is 'undefined'   var j = 'JavaScript'; //initialized with string        

var is Function Scoped

Variables that are alleged with var keyword take function scope. Function scoped hither ways that they can exist accessed merely inside the role in which they are alleged, as showcased in the following JavaScript code example:

function func()  {     var 10 = five;       if(1)      {         var y = 10;            console.log(ten); //Output 5         console.log(y); //Output 10     }       }   func();   console.log(10); //undefined. Not available outside function panel.log(y); //undefined. Not available outside part        

Hoisting of var in JavaScript

Variables alleged with the var keyword are discipline to hoisting. If we declare a variable (but practise not initialize it) at the end of the role, the JavaScript runtime will move it to the top of its telescopic and, therefore, there will be no complaint past the runtime if we use that variable before existence declared.

Issues with var for Variable Declaration

One of the problems is that the variables declared with the var keyword tin can be re-declared or updated in the same scope. This could pb to a serious problem if nosotros declare another variable with the same name in the same scope; the new value will replace the old one. Bank check out the following code-snippet for illustration:

var colour ="Crimson"; var colour= "Green"; panel.log("colour"); // output Dark-green var colour="Bluish"; console.log(colour); // output Blue        

Another upshot with the var keyword is that if you declare a variable without the keyword var, and so that variable will accept global scope. To go a better understanding, consider the following code:

for(x = 0; ten < array.length; ten++){  //index has a global telescopic    //lawmaking }        

In the higher up code snippet, the JavaScript for loop will create variable 10 in the global scope. If you lot would create a new variable with the same name ten and use it somewhere else in the program, then that new variable's value will get overwritten.

Read: Rounding in JavaScript

The let Keyword in JavaScript

let is the improved version of var. let eliminates all the issues of var that we have talked about in the previous section. let has a similar syntax to var but has a more strict telescopic.

let is Block Scoped

The let keyword should be used in situations where you desire to declare a variable that should be restricted to the block in which information technology is restricted. Also, variables declared with the let keyword cannot be updated or re-declared. Here is an example of how to use let to declare variables in JavaScript:

function func()  {     let x = 10;        if(x === 10)      {         permit y = 20;            panel.log(ten); //Output 10         console.log(y); //Output twenty     }           console.log(x); // Output 10     console.log(y); // 'undefined' }     func();        

Note that the variable y alleged with the let keyword is non attainable beyond the if cake in which information technology is alleged. If we would have declared information technology with the var keyword, so it would accept been available, because var has global scope within a function. The following code snippet will help you to better understand this train of idea:

part func()  {     console.log(x);     //Output 'undefined'     console.log(y);     //Error - "Uncaught ReferenceError: y is not defined"           var x = 10;     permit y = 20; }   func();        

Another thing to consider is that allow cannot exist used before its announcement. If you practise so, it volition result in a ReferenceError.

Hoisting of allow

Variables alleged with the allow keyword are not bailiwick to hoisting. This means yous cannot apply a variable unless it is declared and initialized.

Read: How to Optimize Your Website Operation

The const Keyword in JavaScript

The const keyword follows the same rules as the let keyword. The but deviation with const is that const is used to define only constant values in JavaScript programs.

const myVar = 1000;   myVar = 2.5;// Uncaught TypeError: Assignment to constant variable.        

const Declarations are Cake Scoped

The scoping principles of const are the same as that of the let keyword. Like let, the variables declared with the const keyword volition as well have scope restricted to the cake in which they are declared.

Some important pointers for const include:

const declares a variable with a constant value.
Apply the const keyword if the variable that yous are declaring should not be allowed to be reassigned in the future.

millerfaigh1985.blogspot.com

Source: https://www.developer.com/languages/javascript/javascript-var-let-const-variable-declaration/

Share this post