YouTip

Operators are used to perform operations on program code and operate on one or more operands. Consider the following calculation: 7 + 5 = 12 In the above example, 7, 5, and 12 are operands. The operator + is used for addition. The operator = is used for assignment. TypeScript mainly includes the following types of operations: * Arithmetic Operators * Logical Operators * Relational Operators * Bitwise Operators * Assignment Operators * Ternary/Conditional Operators * String Operators * Type Operators * * * ## Arithmetic Operators Assuming **y=5**, the following table explains the operations of these arithmetic operators: | Operator | Description | Example | Result for x | Result for y | | --- | --- | --- | --- | --- | | + | Addition | x=y+2 | 7 | 5 | | - | Subtraction | x=y-2 | 3 | 5 | | * | Multiplication | x=y*2 | 10 | 5 | | / | Division | x=y/2 | 2.5 | 5 | | % | Modulus (Remainder) | x=y%2 | 1 | 5 | | ++ | Increment | x=++y | 6 | 6 | | x=y++ | 5 | 6 | | -- | Decrement | x=--y | 4 | 4 | | x=y-- | 5 | 4 | ### Example var num1:number =10 var num2:number =2 var res:number =0 res = num1 + num2 console.log("Addition: "+res); res = num1 - num2; console.log("Subtraction: "+res) res = num1*num2 console.log("Multiplication: "+res) res = num1/num2 console.log("Division: "+res) res = num1%num2 console.log("Modulus: "+res) num1++ console.log("num1 Increment: "+num1) num2-- console.log("num2 Decrement: "+num2) Compile the above code using the tsc command to get the following JavaScript code: var num1 = 10; var num2 = 2; var res = 0; res = num1 + num2; console.log("Addition: " + res); res = num1 - num2; console.log("Subtraction: " + res); res = num1 * num2; console.log("Multiplication: " + res); res = num1 / num2; console.log("Division: " + res); res = num1 % num2; console.log("Modulus: " + res); num1++; console.log("num1 Increment: " + num1); num2--; console.log("num2 Decrement: " + num2); Executing the above JavaScript code produces the following output: Addition: 12Subtraction: 8Multiplication: 20Division: 5Modulus: 0 num1 Increment: 11 num2 Decrement: 1 * * * ## Relational Operators Relational operators are used to calculate whether the result is true or false. Given x=5, the following table explains the operations of relational operators: | Operator | Description | Comparison | Return Value | | --- | --- | --- | --- | | == | Equal to | x==8 | _false_ | | x==5 | _true_ | | != | Not equal to | x!=8 | _true_ | | > | Greater than | x>8 | _false_ | | < | Less than | x= | Greater than or equal to | x>=8 | _false_ | | <= | Less than or equal to | xnum2 console.log("num1 greater than num2: "+res)res = num1=num2 console.log("num1 greater than or equal to num2: "+res)res = num1num2; console.log("num1 greater than num2: " + res); res = num1= num2; console.log("num1 greater than or equal to num2: " + res); res = num1<= num2; console.log("num1 less than or equal to num2: " + res); res = num1 == num2; console.log("num1 equal to num2: " + res); res = num1 != num2; console.log("num1 not equal to num2: " + res); Executing the above JavaScript code produces the following output: num1 value: 5 num2 value: 9 num1 greater than num2: false num1 less than num2: true num1 greater than or equal to num2: false num1 less than or equal to num2: true num1 equal to num2: false num1 not equal to num2: true * * * * * * ## Logical Operators Logical operators are used to determine the logic between variables or values. Given x=6 and y=3, the following table explains the logical operators: | Operator | Description | Example | | --- | --- | --- | | && | and | (x 1) is true | | || | or | (x==5 || y==5) is false | | ! | not | !(x==y) is true | ### Example var avg:number = 20; var percentage:number = 90; console.log("avg value: "+avg+" ,percentage value: "+percentage); var res:boolean = ((avg>50)&&(percentage>80)); console.log("(avg>50)&&(percentage>80): ",res); var res:boolean = ((avg>50)||(percentage>80)); console.log("(avg>50)||(percentage>80): ",res); var res:boolean=!((avg>50)&&(percentage>80)); console.log("!((avg>50)&&(percentage>80)): ",res); Compile the above code using the tsc command to get the following JavaScript code: var avg = 20; var percentage = 90; console.log("avg value: " + avg + " ,percentage value: " + percentage); var res = ((avg>50)&&(percentage>80)); console.log("(avg>50)&&(percentage>80): ", res); var res = ((avg>50) || (percentage>80)); console.log("(avg>50)||(percentage>80): ", res); var res = !((avg>50)&&(percentage>80)); console.log("!((avg>50)&&(percentage>80)): ", res); Executing the above JavaScript code produces the following output: avg value: 20 ,percentage value: 90(avg>50)&&(percentage>80): false(avg>50)||(percentage>80): true!((avg>50)&&(percentage>80)): true ### Short-circuit Operators (&& and ||) The && and || operators can be used to combine expressions. The && operator returns true only if both the left and right expressions are true. Consider the following example: var a = 10 var result = ( a5) In the above example, a 5 are combined expressions using the && operator. The first expression returns false. Since the && operation requires both expressions to be true, if the first is false, the subsequent check (a > 5) is skipped, and false is returned directly. The || operator returns true if either expression is true. Consider the following example: var a = 10 var result = ( a>5 || a 5 and a < 10 are combined expressions using the || operator. The first expression returns true. Since the || operation only requires one expression to be true, if the first is true, the subsequent check (a < 10) is skipped, and true is returned directly. * * * ## Bitwise Operators Bitwise operations are unary and binary operations on bit patterns or binary numbers in programming. | Operator | Description | Example | Similar To | Result | Decimal | | --- | --- | --- | --- | --- | --- | | & | AND, performs bitwise AND on two binary numbers of the same length. The result bit is 1 only if both corresponding bits are 1, otherwise it is 0. | x = 5 & 1 | 0101 & 0001 | 0001 | 1 | | | | OR, performs bitwise OR on two binary numbers of the same length. The result bit is 1 if at least one of the corresponding bits is 1. | x = 5 | 1 | 0101 | 0001 | 0101 | 5 | | ~ | NOT, a unary operator that performs a logical NOT operation on each bit of a binary number. It turns 1 into 0 and 0 into 1. | x = ~ 5 | ~0101 | 1010 | -6 | | ^ | XOR, performs bitwise XOR on two binary numbers of the same length. The result bit is 1 if the corresponding bits are different, otherwise it is 0. | x = 5 ^ 1 | 0101 ^ 0001 | 0100 | 4 | | << | Left Shift, shifts all bits of the left operand to the left by the number of bits specified by the right operand. High bits are discarded, and low bits are filled with 0. | x = 5 << 1 | 0101 <> | Right Shift, shifts all bits of the left operand to the right by the number of bits specified by the right operand. | x = 5 >> 1 | 0101 >> 1 | 0010 | 2 | | >>> | Unsigned Right Shift, similar to signed right shift, except that it always fills the left side with 0. | x = 2 >>> 1 | 0010 >>> 1 | 0001 | 1 | ### Example var a:number = 2; var b:number = 3; var result; result = (a&b); console.log("(a & b) =>",result)result = (a | b); console.log("(a | b) =>",result)result = (a ^ b); console.log("(a ^ b) =>",result); result = (~b); console.log("(~b) =>",result); result = (a<<b); console.log("(a <",result); result = (a>>b); console.log("(a >> b) =>",result); result = (a>>>1); console.log("(a >>> 1) =>",result); Compile the above code using the tsc command to get the following JavaScript code: var a = 2; var b = 3; var result; result = (a&b); console.log("(a & b) =>", result); result = (a | b); console.log("(a | b) =>", result); result = (a ^ b); console.log("(a ^ b) =>", result); result = (~b); console.log("(~b) =>", result); result = (a<<b); console.log("(a <", result); result = (a>>b); console.log("(a >> b) =>", result); result = (a>>>1); console.log("(a >>> 1) =>", result); Executing the above JavaScript code produces the following output: (a & b) => 2(a | b) => 3(a ^ b) => 1(~b) => -4(a < 16(a >> b) => 0(a >>> 1) => 1 * * * ## Assignment Operators Assignment operators are used to assign values to variables. Given **x=10** and **y=5**, the following table explains the assignment operators: | Operator | Example | Instance | Value of x | | --- | --- | --- | --- | | = (Assignment) | x = y | x = y | x = 5 | | += (Add and Assign) | x += y | x = x + y | x = 15 | | -= (Subtract and Assign) | x -= y | x = x - y | x = 5 | | *= (Multiply and Assign) | x *= y | x = x * y | x = 50 | | /= (Divide and Assign) | x /= y | x = x / y | x = 2 | > Similar logical operators can also be combined with assignment operators: <>=, >>>=, &=, |=, and ^=. ### Example var a: number = 12 var b:number = 10 a = b console.log("a = b: "+a)a += b console.log("a+=b: "+a)a -= b console.log("a-=b: "+a)a *= b console.log("a*=b: "+a)a /= b console.log("a/=b: "+a)a %= b console.log("a%=b: "+a) Compile the above code using the tsc command to get the following JavaScript code: var a = 12; var b = 10; a = b; console.log("a = b: " + a); a += b; console.log("a+=b: " + a); a -= b; console.log("a-=b: " + a); a *= b; console.log("a*=b: " + a); a /= b; console.log("a/=b: " + a); a %= b; console.log("a%=b: " + a); Executing the above JavaScript code produces the following output: a = b: 10 a+=b: 20 a-=b: 10 a*=b: 100 a/=b: 10 a%=b: 0 * * * ## Ternary Operator (?) The ternary operator has 3 operands and requires evaluating a boolean expression. This operator is mainly used to decide which value should be assigned to a variable. Test ? expr1 : expr2 * Test − The specified conditional statement * expr1 − Value returned if the conditional statement Test returns true * expr2 − Value returned if the conditional statement Test returns false Let's look at the following example: var num:number = -2 var result = num>0 ? "Greater than 0" : "Less than 0, or equal to 0"console.log(result) The example is used to check if the variable is greater than 0. Compile the above code using the tsc command to get the following JavaScript code: var num = -2; var result = num>0 ? "Greater than 0" : "Less than 0, or equal to 0"; console.log(result); The output of the above example is as follows: Less than 0, or equal to 0 * * * ## Type Operators ### typeof Operator typeof is a unary operator that returns the data type of the operand. Look at the following example: var num = 12 console.log(typeof num); Compile the above code using the tsc command to get the following JavaScript code: var num = 12; console.log(typeof num); The output of the above example is as follows: number ### instanceof The instanceof operator is used to check if an object is of a specified type. We will introduce it in detail in later chapters. * * * ## Other Operators ### Unary Negation Operator (-) Changes the sign of the operand. Look at the following example: var x:number = 4 var y = -x; console.log("x value: ",x); console.log("y value: ",y); Compile the above code using the tsc command to get the following JavaScript code: var x = 4; var y = -x; console.log("x value: ", x); console.log("y value: ", y); The output of the above example is as follows: x value: 4 y value: -4 ### String Operator: Concatenation Operator (+) The + operator can concatenate two strings. Look at the following example: var msg:string = "TUTORIAL"+".COM"console.log(msg) Compile the above code using the tsc command to get the following JavaScript code: var msg = "TUTORIAL" + ".COM"; console.log(msg); The output of the above example is as follows: