- 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.Introduction2 lessons, 07:42
1.1Introduction02:12
1.2Setup05:30
2.Language Fundamentals8 lessons, 1:00:53
2.1Variables06:33
2.2Data Types11:28
2.3Arithmetic, Assignment, and Comparison Operators10:24
2.4Unary, Logical, Comma, and Spread Operators09:02
2.5Operator Precedence03:50
2.6Reserved Words04:17
2.7Strict Mode04:34
2.8Functions10:45
3.Data Structures5 lessons, 22:52
3.1Arrays04:29
3.2Objects04:30
3.3Sets04:57
3.4Maps04:21
3.5Weak Maps and Weak Sets04:35
4.Controlling Program Execution7 lessons, 37:06
4.1Conditionals07:49
4.2Switch Statements04:41
4.3The For Loop06:39
4.4The `for .. in` Loop05:17
4.5The `for .. of` Loop04:02
4.6Iterators05:03
4.7While Loops03:35
5.Using JavaScript13 lessons, 1:44:36
5.1Working With Strings09:32
5.2Template Literals05:46
5.3Working With Numbers06:57
5.4Working With Arrays12:53
5.5Iterating and Transforming Arrays07:33
5.6Working With the Object Type13:55
5.7Object Literal Extensions06:45
5.8Working With Object Instances06:45
5.9Getters and Setters05:00
5.10Custom Objects11:28
5.11The `Math` API04:54
5.12Working With Dates and Times08:10
5.13The `Array` Constructor04:58
6.Functions8 lessons, 56:07
6.1The `this` Object06:15
6.2Working With Functions10:11
6.3Scope07:37
6.4Arrow Functions06:59
6.5Generator Functions08:13
6.6Closures05:00
6.7Prototypes06:26
6.8Default and Rest Parameters05:26
7.Miscellaneous6 lessons, 52:39
7.1Destructuring Assignments08:09
7.2AJAX08:30
7.3Regular Expressions10:51
7.4More About Regular Expressions08:38
7.5Classes06:48
7.6ES Modules09:43
8.Working With the DOM6 lessons, 37:39
8.1Selecting HTML Elements05:02
8.2Manipulating HTML Elements07:40
8.3DOM Traversal05:25
8.4Adding and Removing Elements04:45
8.5Creating Elements and Other Nodes04:39
8.6DOM Events10:08
9.Web APIs4 lessons, 17:41
9.1The Selector API03:03
9.2Geolocation05:29
9.3Web Storage05:24
9.4Web Workers03:45
10.Asynchronous JavaScript5 lessons, 26:23
10.1Promises09:52
10.2Promise Chaining05:11
10.3The async Keyword03:21
10.4The await Keyword04:04
10.5More About async and await03:55
11.Conclusion1 lesson, 00:43
11.1Conclusion00: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.