Home > Web Front-end > JS Tutorial > Understanding JavaScript Operators

Understanding JavaScript Operators

Mary-Kate Olsen
Release: 2024-12-30 19:04:09
Original
885 people have browsed it

Understanding JavaScript Operators

In JavaScript, operators are special symbols or keywords used to perform operations on values and variables. They allow us to manipulate data and control the flow of the code. Let’s break down the most commonly used types of operators and their purposes:

1️⃣ Assignment Operators (=)

The assignment operator is used to assign values to variables.
? Example:

let x = 10 // Assigns the value 10 to variable x
let y = 5 // Assigns the value 5 to variable y
Copy after login

2️⃣ Arithmetic Operators

Arithmetic operators perform basic mathematical operations on numbers.

  1. (Addition)
  2. - (Subtraction)
  3. * (Multiplication)
  4. / (Division)
  5. % (Modulus – remainder of division)
  6. ** (Exponentiation (ES2016))
  7. (Increment)
  8. -- (Decrement)

? Example:

console.log("x + y = " + (x + y)) // Output: x + y = 15
console.log("x - y = " + (x - y)) // Output: x - y = 5
console.log("x / y = " + (x / y)) // Output: x / y = 2
console.log("x * y = " + (x * y)) // Output: x * y = 50
console.log("x % y = " + (x % y)) // Output: x % y = 0
console.log("(x**y) = " + (x**y)) // Output: (x**y) = 100000
console.log("(++x) = " + (++x)) // Output: (++x) = 11
console.log("(x++) = " + (x++)) // Output: (x++) = 11
console.log("(--y) = " + (--y)) // Output: (--y) = 4
console.log("(y--) = " + (y--)) // Output: (y--) = 4
Copy after login

3️⃣ Comparison Operators

Comparison operators compare two values and return a Boolean (true or false). These are often used in loops and branching statements.

  1. == (Equal to)
  2. === (Strictly equal to)
  3. != (Not equal to)
  4. !== (Strictly not equal to)
  5. < (Less than)
  6. > (Greater than)
  7. <= (Less than or equal to)
  8. >= (Greater than or equal to)

? Example:

console.log("(x == y) = " + (x == y)) // Output: (x == y) = false
console.log("(x != y) = " + (x != y)) // Output: (x != y) = true
// Compares datatypes also
console.log("(x === y) = " + (x === y)) // Output: (x === y) = false
// Compares datatypes also
console.log("(x !== y) = " + (x !== y)) // Output: (x !== y) = true
console.log("(x > y) = " + (x > y)) // Output: (x > y) = true
console.log("(x >= y) = " + (x >= y)) // Output: (x >= y) = true
console.log("(y < x) = " + (y < x)) // Output: (y < x) = true
console.log("(y <= x) = " + (y <= x)) // Output: (y <= x) = true
Copy after login

4️⃣ Logical Operators

Logical operators are used to perform logical operations and return a Boolean value (true or false).

  1. && (Logical AND)
  2. || (Logical OR)
  3. ! (Logical NOT)

? Example:

let isValidNumber = (x > 8 && 8 > y) // If both condition are correct returns true otherwise false
console.log("(x > 8 && 8 > y) = " + isValidNumber) // Output: (x > 8 && 8 > y) = true

let isValidCheck = (x > 20 || 8 > y) // If one of condition is correct returns true otherwise false
console.log("(x > 20 || 8 > y) = " + isValidCheck) // Output: (x > 20 || 8 > y) = true

let isValid = false
console.log("(!isValid) = " + !isValid) // Output: (!isValid) = true
Copy after login

5️⃣ String Operators

The operator is versatile and can be used with strings for concatenation (joining two strings). When used with numbers, it performs addition.

? Example:

// Concatenation
console.log("Richa " + "webDev") // Output: Richa webDev 
// Addition
console.log(10 + 5) // Output: 15
Copy after login

6️⃣ Ternary Operator (? :)

The ternary operator is a concise way to perform conditional checks. It returns one value if the condition is true and another if it’s false.
? Syntax:

condition ? valueIfTrue : valueIfFalse;
Copy after login

? Example:

const isEven = 10 % 2 === 0 ? "Number is even" : "Number is old"
console.log("isEven = " + isEven) // Output: isEven = Number is even
Copy after login

? Brain teaser

Explain why the output of the code snippet, involving the num , --num, and num-- operations, results in the value 21. Comment down below.

let num = 20
console.log("num = " + num) // Output: (++num) = 21
console.log("(++num) = " + (++num)) // Output: (++num) = 21
console.log("(num++) = " + (num++)) // Output: (num++) = 21
console.log("(--num) = " + (--num)) // Output: (--num) = 21
console.log("(num--) = " + (num--)) // Output: (num--) = 21
Copy after login

Output:

num = 20
(++num) = 21
(num++) = 21
(--num) = 21
(num--) = 21
Copy after login

Conclusion

JavaScript operators are fundamental building blocks that help you write effective and efficient code. By mastering them, you can perform a wide range of operations, from simple assignments to complex logical checks. Experiment with these operators to better understand their behavior!
Happy coding ✨

The above is the detailed content of Understanding JavaScript Operators. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template