Operators in TypeScript

One crucial aspect of TypeScript is its operators, which are used to manipulate values in code. This article will cover TypeScript operators, including arithmetic, assignment, comparison, logical, and bitwise operators.

Understanding TypeScript operators is essential for writing efficient and effective code. With TypeScript operators, developers can perform complex operations on data types, manipulate data, and make decisions based on certain conditions. In this way, operators are an essential part of the programming language, and learning how to use them effectively can help developers write better, more robust code. This article will explore the types of TypeScript operators and how to use them in your code.

Operators in TypeScript

1. Arithmetic Operators

In TypeScript, arithmetic operators employ and execute mathematical operations on numeric values. In TypeScript, the following operators are available:

a. Addition (+): Adds two numeric values together.

b. Subtraction (-): Subtracts one numeric value from another.

c. Multiplication (*): Multiplies two numeric values together.

d. Division (/): Division of two numerical values.

e. Modulus (%): Returns the remainder after division.

Here is an example of using arithmetic operators in TypeScript:

let DataFlair_x = 10;
let DataFlair_y = 5;
console.log(DataFlair_x + DataFlair_y);
console.log(DataFlair_x - DataFlair_y);
console.log(DataFlair_x * DataFlair_y);
console.log(DataFlair_x / DataFlair_y);
console.log(DataFlair_x % DataFlair_y);

Output –

2. Assignment Operators

Assignment operators are used to assigning values to variables in TypeScript. The following operators are available in TypeScript:

a. Assignment (=): Assigns a value to a variable.

b. Addition assignment (+=): Adds a value to a variable and assigns the result to the same variable.

c. Subtraction assignment (-=): Subtracts a value from a variable and assigns the result to the same variable.

d. Multiplication assignment (*=): Multiplies a variable by a value and assigns the result to the same variable.

e. Division assignment (/=): Divides a variable by a value and assigns the result to the same variable.

f. Modulus assignment (%=): Performs modulus operation on a variable and a value and assigns the result to the same variable.

Here is an example of using assignment operators in TypeScript:

let DataFlair_x = 10;
DataFlair_x += 5;
console.log(DataFlair_x);


let DataFlair_y = 10;
DataFlair_y -= 5;
console.log(DataFlair_y);


let DataFlair_z = 10;
DataFlair_z *= 5;
console.log(DataFlair_z);


let DataFlair_a = 10;
DataFlair_a /= 5;
console.log(DataFlair_a);


let DataFlair_b = 10;
DataFlair_b %= 5;
console.log(DataFlair_b);

Output –

3. Comparison Operators in TypeScript

Comparison operators are used to comparing two values in TypeScript. The following operators are available in TypeScript:

a. Equal to (==): Compares two values for equality, but does not compare the data types of the values.

b. Not equal to (!=): Compares two values for inequality, but does not compare the data types of the values.

c. Strict equal to (===): Compares two values for equality, and compares the data types of the values.

d. Strict not equal to (!==): Compares two values for inequality and compares the data types of the values.

e. Greater than (>): Determines whether one value exceeds another.

f. Less than (<): Checks if one value is less than another.

g. Greater than or equal to (>=): Check if one value is greater than or equal to another.

h. Less than or equal to (<=): Checks if one value is less than or equal to another.

Here is an example of using comparison operators in TypeScript:

let DataFlair_x = 10;
let DataFlair_y = 10;
let DataFlair_z = '10';


console.log(DataFlair_x == DataFlair_y);
console.log(DataFlair_x != DataFlair_y);
console.log(DataFlair_x === DataFlair_y);
console.log(DataFlair_x !== DataFlair_y);


console.log(DataFlair_x > DataFlair_y);
console.log(DataFlair_x < DataFlair_y);
console.log(DataFlair_x >= DataFlair_y);
console.log(DataFlair_x <= DataFlair_y);


console.log(DataFlair_x == DataFlair_z);
console.log(DataFlair_x === DataFlair_z);

Output –

4. Logical Operators in TypeScript

Logical operators are used to performing logical operations on Boolean values in TypeScript. The following operators are available in TypeScript:

a. Logical AND (&&): Returns true if both operands are true.

b. Logical OR (||): Returns true if either operand is true.

c. Logical NOT (!): Returns the opposite of the Boolean value.

Here is an example of using logical operators in TypeScript:

let DataFlair_x = true;
let DataFlair_y = false;


console.log(DataFlair_x && DataFlair_y);
console.log(DataFlair_x || DataFlair_y);
console.log(!DataFlair_x);
console.log(!DataFlair_y);

Output –

5. TypeScript Bitwise Operators

Bitwise operators are used to performing bitwise operations on numeric values in TypeScript. The following operators are available in TypeScript:

a. Bitwise AND (&): Performs a bitwise AND operation on two values.

b. Bitwise OR (|): Performs a bitwise OR operation on two values.

c. Bitwise XOR (^): Performs a bitwise XOR operation on two values.

d. Bitwise NOT (~): Performs a bitwise NOT operation on a value.

e. Left shift (<<): Shifts the bits of a value to the left by a specified number of positions.

f. Signed right shift (>>): Shifts the bits of a value to the right by a specified number of positions, preserving the sign of the value.

g. Unsigned right shift (>>>): Shifts the bits of a value to the right by a specified number of positions but always fills the empty bits with zeros.

Here is an example of using bitwise operators in TypeScript:

let DataFlair_x = 5;
let DataFlair_y = 3;


console.log(DataFlair_x & DataFlair_y);
console.log(DataFlair_x | DataFlair_y);
console.log(DataFlair_x ^ DataFlair_y);
console.log(~DataFlair_x);
console.log(DataFlair_x << 1);
console.log(DataFlair_x >> 1);
console.log(DataFlair_x >>> 1);

Output –

Misc Operators in TypeScript

In TypeScript, several miscellaneous operators need to fit into a specific category. These operators are generally used for particular purposes and may not be as commonly used as others.

One such operator is the conditional operator (also known as the ternary operator), which is used to evaluate a condition and return one value if the condition is true, and another value if the state is false. The syntax for the conditional operator is condition ? valueIfTrue : valueIfFalse.

Another miscellaneous operator is the comma operator, which allows multiple expressions to be evaluated in a single statement. The comma operator evaluates each expression in order, from left to right, and returns the value of the last expression. This operator is primarily used for its side effects, such as updating multiple variables or executing numerous functions in a single line of code.

The void operator is also considered a miscellaneous operator in TypeScript. This operator evaluates an expression and returns undefined. It is often used to indicate that a function does not explicitly return a value or prevent the browser from following a link when used with an HTML anchor tag.

While these operators may not be as commonly used as others in TypeScript, they can be helpful in certain situations. They can help improve the readability and efficiency of your code. Understanding how these operators work and when to use them appropriately is essential.

Concatenation Operator

In TypeScript, the concatenation operator is represented by the plus sign (+) and combines two or more strings or values into a single string. When the plus sign combines two values, TypeScript automatically converts non-string values to strings before concatenating them.

For example, if we have two strings, “Hello” and “World,” we can concatenate them using the plus sign as follows:

let DataFlair_greeting: string = 'Hello';
let DataFlair_name: string = 'World';
let message: string = DataFlair_greeting + ' ' + name;
console.log(message); // outputs "Hello World"

Output –

Type Operator in TypeScript

TypeScript also has a type operator called the typeof operator, which is used to get the type of a variable or expression at compile time. The typeof operator returns a string that represents the data type of the operand.

For example, if we have a variable DataFlair_x of type number, we can use the typeof operator to get its type as follows:

let DataFlair_x: number = 10;
console.log(typeof DataFlair_x);

Output –

The typeof operator can also be used with expressions, functions, and classes to get their types. This is useful when you need to check the type of a variable or parameter at runtime.

String Operator in TypeScript

The string operator is represented by the plus sign (+) and is used to concatenate strings or string-like objects together. The string operator can also be used to convert non-string values to strings.

For example, if we have two strings “Hello” and “World”, we can concatenate them using the plus sign as follows:

let DataFlair_greeting: string = 'Hello';
let DataFlair_name: string = 'World';
let message: string = DataFlair_greeting + ' ' + DataFlair_name;
console.log(message); // outputs "Hello World"

Output –

The string operator can also be used to convert other data types to strings. For example:

let DataFlair_num: number = 42;
let str: string = 'The answer is ' + DataFlair_num;
console.log(str); // outputs "The answer is 42"

Output–

In this example, the number 42 is implicitly converted to a string using the string operator.

It’s worth noting that there is also a template literal syntax in TypeScript which uses backticks (`) instead of quotes to define a string. Template literals can contain placeholders which are surrounded by ${} and can contain expressions. Template literals are also used for multiline strings. Here’s an example:

let DataFlair_name: string = 'John';
let age: number = 30;
let str: string = `My name is ${DataFlair_name} and I am ${age} years old.`;
console.log(str); // outputs "My name is John and I am 30 years old."

Output –

Template literals are often preferred over the string operator when building complex or multiline strings because they are easier to read and maintain.

Types of Operator in TypeScript:

In TypeScript, operators can be classified into three categories based on the number of operands they take: unary, binary, and ternary operators.

1. Unary Operator

Unary operators are operators that take a single operand. Some examples of unary operators in TypeScript are the negation operator (-), the logical not operator (!), and the typeof operator.

let DataFlair_x: number = -10;
let DataFlair_y: boolean = !true;
let DataFlair_z: string = typeof 'hello';

2. Binary Operator

Binary operators are operators that take two operands. Some examples of binary operators in TypeScript are the addition operator (+), the subtraction operator (-), the multiplication operator (*), and the logical and operator (&&).

let DataFlair_a: number = 5 + 3;
let DataFlair_b: number = 10 - 5;
let DataFlair_c: number = 3 * 4;
let DataFlair_d: boolean = true && false;

3. Ternary Operator

The ternary operator is the only operator in TypeScript that takes three operands. It is represented by the ? and : symbols and is used as a shorthand for if-else statements.

let DataFlair_age: number = 25;
let DataFlair_message: string = DataFlair_age >= 18 ? 'You are an adult' : 'You are not an adult';

Conclusion

In conclusion, TypeScript operators are a key component of the language and enable developers to manipulate values in code. The different types of operators available in TypeScript include arithmetic, assignment, comparison, logical, and bitwise operators. This allows developers to perform a wide range of operations in their code. Developers need to understand the syntax and functionality of these operators to write efficient and effective code.