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

Next lesson playing in 5 seconds

Cancel
  • Overview
  • Transcript

2.3 Arithmetic, Assignment, and Comparison Operators

Special characters like + and - can be used in different combinations to perform operations on different things. Let’s see how some of the more basic operators, like arithmetic, assignment, and comparison operators behave.

Syntax

  • +
  • -
  • *
  • /
  • %
  • =
  • <
  • <=
  • >
  • >=
  • **

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.3 Arithmetic, Assignment, and Comparison Operators

Hi folks, in this lesson we're going to start looking at the Operators that JavaScript has. There are many different operators for use in many different situations. We aren't going to cover all of them here, they are simply too many. So we'll focus on some of them most basic ones for now and come back and look at some more complex ones in the next lesson. Let's make a start with this simple arithmetic operators. We use the plus sign for adding two values together. The minus sign for removing one value from another. The star character for multiplying values, and the forward slash to divide one number by another, just as we would in regular math. Great, so simple math is simple. As we saw in the last lesson, the plus operator has a different meaning when it is used with strings instead of numbers. And in that case, instead of performing addition it performs concatenation, or joining of two strings. So as well as these mathematical operators, we also have the modulus operator, which is used to determine the remainder following a division. In this case the remainder variable would contain the value one, because one is what is leftover when dividing 5 by 2. The modualist is used full for determining if a number is odd or even. Even numbers will always return zero and odd numbers always return one when used with the modulus operator. There's one more operator that we've used in all of these expressions and that is the equals or assignment operator. We also saw that when we looked at variables in the first lesson in this section. We can also use increment and decrement operators. These are slightly more complicated than the simple math operators that we've just looked at, in that they can be used in two different modes. There is the post fix mode, where the operator follows the operand, or prefix mode where the operator appears before the operand. So we've simply declared two variables at this point. One called postfix and one called prefix, and both with the value five. When we use postfix increments or decrements, the expression returns the value, and then increments it. So the increment operator is 2 plus signs, one directly after the other. Let's just go back and check the browser output in the console and I've spelled console wrong. So we can see that the increment operator, which was the first console log, first returns five. And the variable has then been updated to six. So in this case, the expression returns a different number than the actual value of the variable that has been incremented. The prefix increments or detriments doesn't suffer from this subtle issue. So if we go back and use prefix instead of postfix by moving the operator to the start of the expression. What do you think the two logs are going to say this time? Let's go back to the browser and see. So in this case we can see that the variable has been incremented before it gets returned. So this time the two expressions return the same value. So this behavior creates a confusion that can lead to off by one errors in some situations. And for this reason it is advised to avoid using the increment or decrements operators altogether. We can use assignment operators instead. So the increment operator is two plus symbols. If we want to decrement a value instead in either postfix or prefix mode we would use a double minus sign. So let's move on now to look at some more assignment examples. So we've already seen that a single equals sign is used to assign a value to a variable. As well as this we can use addition assignment. So the addition assignment operator is a + sign followed directly by an = sign. This is identical to using the increment operator. Except that is doesn't create any confusion. We don't have to increment by 1 either. We could just as easily do plus equals 10 to increment the value by 10. Subraction assignment Works in the same way. So for subtraction assignment we use the minus sign directly followed by the equal sign. We can also do multiplication assignment, division assignment and modular assignment in most of the same way So the multiplication assignment is the star character directly followed by the equal sign. Division assignment is the forward slash character directly followed by the Equal sign and modulus assignment is the modulus or percent character directly followed by the equal sign. The last set of operators that we're going to look at in this lesson are very important and we use them a lot. These are the comparison operators, and we had a brief look at these in the last lesson. JavaScript gives us a quality comparison and greater or less than comparisons. And the language does have gotcha here in the form of type coercion. Let's take a quick look at this. So to test if two values are equal, we can either use the equals operator or the strict equals operator. So this is the equals operator, which is two equal signs, one directly following the other. And in this case, the value of one is equal to the value of true, because they are both truthy. In this case, type coercion coerces the value of 1, which is truthy. To the Boolean value true. If we like to use strict equals instead, we need to use the three equals science, which directly follow each other like this. In this case, the expression evaluates to false because with strict equals, not only do the values have to be equal, but the types of the values have to be equal as well. The value 1 is a number and the value true is a boolean, so those are two different types. And that's why the strict equals operator in this case returns false. We can also test for inequality using a bang instead of the first equals sign. In the first expression, 1 does not equal true, this evaluates to false because of type coercion. But with the second expression, the exclamation mark followed by two equal signs, we get the value, true. Because 1 is a number, and that is not the same as a Boolean. No type coercion takes place in that second expression. Different types are converted in different ways. Depending on the types of the operands being compared. And for this reason, it is usually advised to use the strict form of equality or non-equality operators. We can also check if one value is greater than another value. So this expression says one is greater than two, which, as we would probably expect, is false. We could also use greater than or equal. And in this case, the expression is still false. One is not greater than or equal to two. We can also use less than, or less than or equal. And in this case, both of the expressions evaluate to true. 1 is less than 2, and 1 is also less than or equal to 2. The last operator today is the exponentiation operator which raises the value of the first operand by the power of the second operand. This is very similar to the math.pow method which we'll look at later in the course. The syntax for the exponentiation operator is a double asterisk This operator is the newest operator in JavaScript and was added in ES2016. Let's just look at the output. And we can see the value is 5. So in this lesson, we looked at some of the more basic JavaScript operators, including the Arithmetic operators that we'll generally use for simple math. The assignment operators for assigning values in different ways, and the comparison operators for comparing different values. We also learn that sometimes operators don't behave intuitively such as they settle differences between using the increment and decrement operators in prefix mode as opposed to using postfix mode. As well as the type-coercion that is sometimes carried out when comparing values. In the next lesson we'll continue looking at operators, this time looking at some more advanced types of operator. Thanks for watching.

Back to the top