Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m

Next lesson playing in 5 seconds

Cancel
  • Overview
  • Transcript

2.1 Variables

In this lesson we’ll look at one of the most fundamental units of a JavaScript program—the humble variable. We’ll see the different ways that a variable can be declared and then assigned a value, and some other general bits of information about variables that you should probably be aware of.

Syntax

  • var
  • let
  • const

1.Introduction
2 lessons, 07:42

1.1
Introduction
02:12

1.2
Setup
05:30

2.Language Fundamentals
8 lessons, 1:00:53

2.1
Variables
06:33

2.2
Data Types
11:28

2.3
Arithmetic, Assignment, and Comparison Operators
10:24

2.4
Unary, Logical, Comma, and Spread Operators
09:02

2.5
Operator Precedence
03:50

2.6
Reserved Words
04:17

2.7
Strict Mode
04:34

2.8
Functions
10:45

3.Data Structures
5 lessons, 22:52

3.1
Arrays
04:29

3.2
Objects
04:30

3.3
Sets
04:57

3.4
Maps
04:21

3.5
Weak Maps and Weak Sets
04:35

4.Controlling Program Execution
7 lessons, 37:06

4.1
Conditionals
07:49

4.2
Switch Statements
04:41

4.3
The For Loop
06:39

4.4
The `for .. in` Loop
05:17

4.5
The `for .. of` Loop
04:02

4.6
Iterators
05:03

4.7
While Loops
03:35

5.Using JavaScript
13 lessons, 1:44:36

5.1
Working With Strings
09:32

5.2
Template Literals
05:46

5.3
Working With Numbers
06:57

5.4
Working With Arrays
12:53

5.5
Iterating and Transforming Arrays
07:33

5.6
Working With the Object Type
13:55

5.7
Object Literal Extensions
06:45

5.8
Working With Object Instances
06:45

5.9
Getters and Setters
05:00

5.10
Custom Objects
11:28

5.11
The `Math` API
04:54

5.12
Working With Dates and Times
08:10

5.13
The `Array` Constructor
04:58

6.Functions
8 lessons, 56:07

6.1
The `this` Object
06:15

6.2
Working With Functions
10:11

6.3
Scope
07:37

6.4
Arrow Functions
06:59

6.5
Generator Functions
08:13

6.6
Closures
05:00

6.7
Prototypes
06:26

6.8
Default and Rest Parameters
05:26

7.Miscellaneous
6 lessons, 52:39

7.1
Destructuring Assignments
08:09

7.2
AJAX
08:30

7.3
Regular Expressions
10:51

7.4
More About Regular Expressions
08:38

7.5
Classes
06:48

7.6
ES Modules
09:43

8.Working With the DOM
6 lessons, 37:39

8.1
Selecting HTML Elements
05:02

8.2
Manipulating HTML Elements
07:40

8.3
DOM Traversal
05:25

8.4
Adding and Removing Elements
04:45

8.5
Creating Elements and Other Nodes
04:39

8.6
DOM Events
10:08

9.Web APIs
4 lessons, 17:41

9.1
The Selector API
03:03

9.2
Geolocation
05:29

9.3
Web Storage
05:24

9.4
Web Workers
03:45

10.Asynchronous JavaScript
5 lessons, 26:23

10.1
Promises
09:52

10.2
Promise Chaining
05:11

10.3
The async Keyword
03:21

10.4
The await Keyword
04:04

10.5
More About async and await
03:55

11.Conclusion
1 lesson, 00:43

11.1
Conclusion
00:43


2.1 Variables

Hi folks, in this lesson, we're going to start with one of the most fundamental concepts of JavaScript, variables. A variable is a named container for a value. Once we've declared a variable, we can then use the name or identifier of the variable in other places in our code to access the value that it holds. In JavaScript, there are three different ways to declare variables, the var keyword ,the let keyword, and the const keyword. Let's look at each of them in turn, starting with var. To declare a variable with the var keyword, we just need to provide a name for the variable. So this statement creates an empty variable with the identifier foo. In this case, the variable is only declared, it's not initialized or assigned a value. So it is automatically given the special value undefined. We'll look at undefined in more detail in the next lesson. There are some rules around the characters that we can use for a variable name in JavaScript. Technically, we can use any Unicode character in an identifier, but the variable name must start with either an underscore, the dollar sign, or a letter. Numbers can also be used in variable names, but not right at the start. Space characters cannot be used at all. If we need to declare multiple variables, we can use a single var statement with different variables separated by commas. In this case, three variables are created with the identifiers foo, bar, and baz. As well as declaring a variable, we can at the same time initialize it by giving it a value. In this case, we assign the value 42 to foo using the assignment operator, which is the equal sign. 42 is a number, but notice that we didn't need to tell JavaScript that the variable would contain a number, we just assigned it. JavaScript is known as a weakly or dynamically typed language. What this means is that unlike many other programming languages, when a variable is declared in JavaScript, we don't have to specify what type of value it will store. This is great because it means that any variable can hold any type of data. We can store one type of data, say, a string, and then later on, we can overwrite the string value with a number, for example. The downside to this is that sometimes we don't know for sure what type of data or variable it's holding. So we'll often need to check before trying to do something with the value. If we want to overwrite the foo variable later on, we can just assign a new value to it. This time, we don't need to use the var keyword. One thing to watch out for with the var keyword is that it can create variables in the global scope. JavaScript has three different scopes, global scope, function scope, and block scope. And we'll be looking at scope in much detail later in the course. If a variable is defined in the global scope, it can be accessed by any other JavaScript that is loaded onto the page, even within other, separate JavaScript files. This can be useful in the case of libraries or frameworks. But it can also be dangerous because if other code can access it, other code can also change it. And this can make your program break in ways that are extremely hard to debug. Global scope should be avoided wherever possible, which thankfully is most of the time. Function scope means that a variable is only visible within the function it is declared in. When we declare a variable inside a function, the variable only exists in that function's scope, and cannot be accessed by code outside of the function. Again, don't worry too much about this for now. We'll come back and look at functions and scope in much more detail soon enough. Block scope means that a variable is only visible within the block it is declared in. A block in JavaScript is generally any number of expressions, enclosed within curly braces. Block scope is a common feature of many programming languages, but it's only recently been added to JavaScript in the last few years. So the var keyword that we've looked at so far only works with global or function scopes. If we use the var keyword inside a block, the variable will still be accessible outside of the block. If we want to enable block scope for a variable, we need to declare it using the let keyword. Syntactically, let is very similar to var, it just differs in terms of scope. With let, if we declare a variable inside a block, the variable is only visible inside that block. We haven't covered blocks yet, we will come to that later in the course when we get to section four. For now, just remember that for block scope, we need to use let. The final way of declaring a variable in JavaScript is with the const keyword. The const keyword is similar to let in that it can make use of block scope, but it has one important difference. The const keyword creates a constant value that cannot be changed through reassignment. So we can't, for example, do something like this. This will actually throw an error because we're trying to reassign the value of baz to 43. But it was declared using the const keyword. So in this lesson, we learned the three different ways that we can declare a variable, the var, let, and const keywords. And we saw the differences in behavior between them. We saw that the var key word only works with global or function scope. But that let and const are able to make use of block scope when used inside a block. In modern JavaScript, it is common to most often use let and const rather than var because of the global scope issues. In the next lesson, we will learn another fundamental aspect of JavaScript, the different data types that are available. Thanks for watching.

Back to the top
View on GitHub