This is the third day of my participation in the August More text Challenge. For details, see:August is more challenging

Hello everyone, I am the prosperity of the other shore 🌸, a front-end 👨🏻💻 that firmly believes that hard work can change destiny. If I have the honor to write an article that can get your favor, I am very lucky ~

This series of articles was first published in nuggets

Variables in JavaScript

Writing in the front

In this article, we will learn about variables in JavaScript. This article covers the concept of variables, declaration, invocation, and special cases when declaring variables.

What is a variable

A variable is a container with a name that is used to store data information. In JavaScript, variables are weakly typed, meaning that they can store any type of data.

Strongly typed programming languages can only store the specified type, otherwise an error will be reported.

We use variables in development for two purposes:

  • Store data information: Declares a variable to store specified data information.

  • Read data information: A call to a variable to get the data information stored there.

In JavaScript, if you use an undeclared variable, an exception will be thrown. The example code looks like this:

The above code throws a ReferenceError, indicating that the variable a is undefined.

Declaration and use of variables

To declare a variable in JavaScript, use the var keyword and optionally initialize the variable.

With the addition of the let and const keywords in ECMAScript2015, var is now largely obsolete when writing code. We’ll learn about the let and const keywords in ECMAScript’s new features.

The grammatical structure is as follows:

var varname1 [= value1] [, varname2 [= value2] ... [, varnameN [= valueN]]];
Copy the code

In the syntax above, varname indicates the name of the variable. If only one variable name indicates the declaration, value indicates the value of the variable. If a variable is declared and assigned a value, the declaration is initialized.

The following code demonstrates the use of the var keyword:

var value1  // Declare only

console.log(value1) // Access to only declared variables will get an undefined

var value2 = 'this is value2'

console.log(value2) // Will get this is value2
Copy the code

The value of the variable can also be changed, as shown in the following example:

var message = 'Hello'
message = 'World'
console.log(message)
Copy the code

If a variable is reassigned, the previous value will be deleted (unless there are other variable references to the previous value). The process of assigning a variable is better understood in the following figure

Conventions for naming variables

Each variable name had better have a clear meaning, avoid using such variable names as a and b, you can also use a variable naming method, as shown below:

var helloWorld = 'Hello World' // Nomenclature of the lesser hump
var HelloWorld = 'Hello World' // The big hump nomenclature
var hello_world = 'Hello World' // Underline naming
Copy the code

The problem with using var to declare variables

There are other operations that are worth noting when declaring variables in the JavaScript language. Some actions are not recommended, although it is possible to run code without an error.

Declaration is not made using the var keyword

We used the var keyword to declare a variable, but in fact JavaScript allows us to declare a variable without the var keyword any time except in strict mode. The example code looks like this:

message = 'Hello World'
Copy the code

So when we access this message variable we’re going to get Hello World.

While this is allowed, it is not recommended for real development.

Repeat statement

Repeated declarations of variables using the var keyword in the JavaScript language are allowed without any problems. Since a variable in JavaScript can only store a single piece of data, when a variable is repeatedly declared and initialized, the previous data will be overwritten. As shown in the following example code:

var msg = 'this is message' // The value is this is message
var msg = 100 / / value is 100
Copy the code

Variable ascension

The way the JavaScript engine works is that it parses the code, gets all the declared variables, and then executes them line by line. As a result, all variable declarations are promoted to the top of the code. This is called variable promotion.

console.log(a);
var a = 1;
Copy the code

The above code first displays the value of the variable a on the console using the console.log method. The variable A hasn’t been declared or assigned yet, so it’s a mistake, but it doesn’t actually report an error. Because of the variable promotion, what really runs is the following code.

var a;
console.log(a);
a = 1;
Copy the code

The final result is to display undefined, indicating that the variable A has been declared but not yet assigned.

In ECMAScript2015, we added the let and const keywords to eliminate the problem of variable promotion and repeated declarations.

conclusion

Preview: We’ll look at data types in JavaScript in the next article

Excellent articles

02-JavaScript lexical structure

01- What is JavaScript