JavaScript Variables

• var: The variable declaration method introduced by ES5, with function scope.

• let: The variable declaration method introduced by ES6, with block-level scope.

• const: The constant declaration method introduced by ES6, with block-level scope, and the value is immutable.

Just like algebra

x=5
y=6
z=x+y

In algebra, we use letters (like x) to hold values (like 5).

Through the expression z=x+y above, we can calculate that the value of z is 11.

In JavaScript, these letters are called variables.

	You can think of variables as containers for storing data.

JavaScript Variables

Like algebra, JavaScript variables can be used to store values (such asx = 5) and expressions (such asz = x + y）。

Variables can use short names (like x and y) or more descriptive names (like age, sum, totalvolume).

• Variables must begin with a letter
• Variables can also begin with $ and _ symbols (though we don't recommend this)
• Variable names are case-sensitive (y and Y are different variables)

	JavaScript statements and JavaScript variables are both case-sensitive.

JavaScript Data Types

JavaScript variables can also hold other data types, such as text values (name="Bill Gates").

In JavaScript, a piece of text like "Bill Gates" is called a string.

There are many types of JavaScript variables, but for now, we only focus on numbers and strings.

When you assign a text value to a variable, you should enclose the value in double quotes or single quotes.

When the value you assign to a variable is a numeric value, do not use quotes. If you enclose a numeric value in quotes, the value will be treated as text.

Declaring (Creating) JavaScript Variables

Creating variables in JavaScript is often called "declaring" variables.

We use the var keyword to declare variables:

var carname;

After a variable is declared, it is empty (it has no value).

To assign a value to a variable, use the equals sign:

carname="Volvo";

However, you can also assign a value to the variable when declaring it:

var carname="Volvo";

In the example below, we create a variable named carname, assign it the value "Volvo", and then place it in the HTML paragraph with id="demo":

Characteristics of var declarations:

• Variables can be redeclared (overwriting the original variable).
• When a variable is not assigned a value, the default value is undefined.
• Variables declared with var are hoisted, but not initialized.

	A good programming habit is to declare all needed variables uniformly at the beginning of the code.

One Statement, Many Variables

You can declare many variables in one statement. Start the statement with var and separate the variables with commas:

var lastname="Doe", age=30, job="carpenter";

Declarations can also span multiple lines:

var lastname="Doe",
age=30,
job="carpenter";

Multiple variables declared in one statement cannot be assigned the same value at the same time:

var x, y, z = 1;

x, y are undefined, z is 1.

Value = undefined

In computer programs, variables without a value are often declared. A variable declared without a value actually has the valueundefined。

After executing the following statement, the value of the variable carname will be undefined:

var carname;

Redeclaring JavaScript Variables

If you redeclare a JavaScript variable, its value will not be lost:

After executing the following two statements, the value of the variable carname is still "Volvo":

var
carname="Volvo"; 
var carname;

JavaScript Arithmetic

You can do arithmetic with JavaScript variables, using operators like = and +:

Using let and const (ES6)

Before 2015, we used the var keyword to declare JavaScript variables.

JavaScript versions after 2015 (ES6) allow us to use the const keyword to define a constant, and the let keyword to define variables with a limited scope.

let

let is a new variable declaration method introduced by ES6 and is recommended.

let syntax:

let variableName = value;

const

const is used to define constants, meaning once assigned, the value of the variable cannot be modified.

const syntax:

const variableName = value;

For more about const and let, you can refer to:JavaScript let and const.

Safari 10 and Edge 14 were the first browsers to support all ES6 features:

You will learn more about JavaScript operators in later chapters of this tutorial.