Author: saqibkhan

In TypeScript, a string represents a sequence of characters. The string type is a fundamental data type in TypeScript. Strings are important to hold data that can be represented in text form. Like JavaScript, TypeScript also supports both string primitives and String objects.

The String object lets you work with a series of characters. It wraps the string primitive data type with a number of helper methods.

You can invoke methods on primitive strings because TypeScript automatically wraps the string primitive and call the methods on wrapper object. The same applies to properties also.

Creating Strings

Strings in TypeScript can be created as primitives from string literals or as objects using the String() constructor.

You can use the following syntax to create a String object in TypeScript −

cost str =newString(value);

Here str is the newly created String object and value is a series of characters.

You can create string primitives using single quote, double quotes and backtick.

let str1:string='a string primitive';let str2:string="another string";let str3:string=yet another string;

The string primitives can also be created using the String() function without new keyword.

let str:string=String(value);

‘string’ is a primitive, but ‘String’ is a wrapper object. Prefer using ‘string’ when possible.

String Properties

A list of the methods available in String object along with their description is given below −

S.No.	Property & Description
1.	ConstructorReturns a reference to the String function that created the object.
2.	LengthReturns the length of the string.
3.	PrototypeThe prototype property allows you to add properties and methods to an object.

String Methods

A list of the methods available in String object along with their description is given below −

S.No.	Method & Description
1.	charAt()Returns the character at the specified index.
2.	charCodeAt()Returns a number indicating the Unicode value of the character at the given index.
3.	concat()Combines the text of two strings and returns a new string.
4.	indexOf()Returns the index within the calling String object of the first occurrence of the specified value, or -1 if not found.
5.	lastIndexOf()Returns the index within the calling String object of the last occurrence of the specified value, or -1 if not found.
6.	localeCompare()Returns a number indicating whether a reference string comes before or after or is the same as the given string in sort order.
7.	match()Used to match a regular expression against a string.
8.	replace()Used to find a match between a regular expression and a string, and to replace the matched substring with a new substring.
9.	search()Executes the search for a match between a regular expression and a specified string.
10.	slice()Extracts a section of a string and returns a new string.
11.	split()Splits a String object into an array of strings by separating the string into substrings.
12.	substr()Returns the characters in a string beginning at the specified location through the specified number of characters.
13.	substring()Returns the characters in a string between two indexes into the string.
14.	toLocaleLowerCase()The characters within a string are converted to lower case while respecting the current locale.
15.	toLocaleUpperCase()The characters within a string are converted to upper case while respecting the current locale.
16.	toLowerCase()Returns the calling string value converted to lower case.
17.	toString()Returns a string representing the specified object.
18.	toUpperCase()Returns the calling string value converted to uppercase.
19.	valueOf()Returns the primitive value of the specified object.

Examples

Lets understand the string types with the help of some examples in TypeScript.

Example: Creating String Primitives

In the example below, we use single quote, double quote and backtick to create the primitive strings str1, str2 and str3 respectively.

let str1:string='a string primitive';console.log(str1);let str2:string="another string";console.log(str2);let str3:string=yet another string;console.log(str3);

On compiling, it will generate the following JavaScript code.

let str1 ='a string primitive';
console.log(str1);let str2 ="another string";
console.log(str2);let str3 =yet another string;
console.log(str3);

The output of the above example code is as follows −

a string primitive
another string
yet another string

Example: Creating String Objects

Here we create a String object using the String() constructor with new keyword.

const email =newString('[email protected]');console.log(email);console.log(typeof email);

On compiling, it will generate the following JavaScript code.

const email =newString('[email protected]');
console.log(email);
console.log(typeof email);

The output of the above example code is as follows −

[email protected]
object

Example: Concatenating TypeScript strings

To concatenate two string, we can use + operator. Here, we concatenate two strings str1 and str2 and display the result in the console.

let str1:string="Hello ";let str2:string="World!";let str3:string= str1 + str2;console.log(str3);

On compiling, it will generate the following JavaScript code.

let str1 ="Hello ";let str2 ="World!";let str3 = str1 + str2;
console.log(str3);

The output of the above example code is as follows

Hello World!

Example: Accessing string elements using indexing

In the example below, we access the string characters from the 1st and 6th indices.

let message:string="Hello World!";console.log("Character at index 1 is => "+ message[1]);console.log("Character at index 6 is => "+ message[6]);

On compiling, it will generate the following JavaScript code.

let message ="Hello World!";
console.log("Character at index 1 is => "+ message[1]);
console.log("Character at index 6 is => "+ message[6]);

The output of the above example code is as follows −

Character at index 1 is => e
Character at index 6 is => W

Example: String vs. string in TypeScript

In TypeScript, type ‘String’ is a wrapper object and type ‘string’ is a primitive type. These both types cant be assigned to each other.

In the example below, we tried to assign a string object to a variable of type string primitive.

let str:string;
str =newString('shahid');

The above example code will show the following error −

Type 'String' is not assignable to type 'string'.
  'string' is a primitive, but 'String' is a wrapper object. Prefer using 'string' when possible.

TypeScript like JavaScript supports numeric values as Number objects. A number object converts numeric literal to an instance of the number class. The Number class acts as a wrapper and enables manipulation of numeric literals as they were objects.

TypeScript number type represents the numeric values. All the numbers are represented as the floating point values. TypeScript also supports the binary, octal and hexadecimal numbers introduced in ECMAScript 2015.

In TypeScript, we can create a number primitive as well as Number object.

Syntax

We can declare a variable of number type using colon (:) after the variable name followed by number −

let varName:number= value;

In the above syntax, we declared a variable named varName of number type. Here value is the any numeric value such as decimal, binary, octal or hexadecimal numbers.

We can create the Number object. To create a Number object we can use the Number() constructor as follows −

var var_name =newNumber(value)

In case a non-numeric argument is passed as an argument to the Numbers constructor, it returns NaN (NotaNumber)

The type ‘Number’ is a wrapper object but type ‘number’ is a primitive. Prefer using ‘number’ when possible. Type ‘Number’ is not assignable to type ‘number’.

Creating Number Types

In the below example, we created a variable count of number type. We assigned 10 to the count.

let count:number=10;console.log(count);

On compiling, it will generate the following JavaScript code.

let count =10;
console.log(count);

The output is as follows −

10

We can also assign float, binary, octal and hexadecimal values to a variable of number type. Look at the below TypeScript code snippet

let decNum:number=10.6;// floating point numberlet binNum:number=0b101001;// binary numberlet octNum:number=0o45;// octal numberlet hexNum:number=0x80fd;// hexadecimal number

Creating Number Object

const count =newNumber(10);
console.log(count);
console.log(typeof count);

On compiling, it will generate the same JavaScript code.

The output of the above example code is as follows

[Number: 10]
Object

Number Properties

The following table lists a set of properties of the Number object −

S.No.	Property & Description
1.	MAX_VALUEThe largest possible value a number in JavaScript can have 1.7976931348623157E+308.
2.	MIN_VALUEThe smallest possible value a number in JavaScript can have 5E-324.
3.	NaNEqual to a value that is not a number.
4.	NEGATIVE_INFINITYA value that is less than MIN_VALUE.
5.	POSITIVE_INFINITYA value that is greater than MAX_VALUE.
6.	prototypeA static property of the Number object. Use the prototype property to assign new properties and methods to the Number object in the current document.
7.	constructorReturns the function that created this object’s instance. By default, this is the Number object.

Example

console.log("TypeScript Number Properties: ");console.log("Maximum value that a number variable can hold: "+ Number.MAX_VALUE);console.log("The least value that a number variable can hold: "+ Number.MIN_VALUE);console.log("Value of Negative Infinity: "+ Number.NEGATIVE_INFINITY);console.log("Value of Negative Infinity:"+ Number.POSITIVE_INFINITY);

On compiling, it will generate the same code in JavaScript.

Its output is as follows −

TypeScript Number Properties:  
Maximum value that a number variable can hold: 1.7976931348623157e+308 
The least value that a number variable can hold: 5e-324 
Value of Negative Infinity: -Infinity 
Value of Negative Infinity:Infinity

Example: NaN

var month =0if( month<=0|| month >12){ 
   month = Number.NaNconsole.log("Month is "+ month)}else{console.log("Value Accepted..")}

On compiling, it will generate the same code in JavaScript.

Its output is as follows −

Month is NaN

Example: prototype

functionemployee(id:number,name:string){this.id = id 
   this.name = name 
}var emp =newemployee(123,"Smith") 
employee.prototype.email ="[email protected]"console.log("Employee's Id: "+emp.id)console.log("Employee's name: "+emp.name)console.log("Employee's Email ID: "+emp.email)

On compiling, it will generate the following JavaScript code −

//Generated by typescript 1.8.10functionemployee(id, name){this.id = id;this.name = name;}var emp =newemployee(123,"Smith");
employee.prototype.email ="[email protected]";

console.log("Employee 's Id: "+ emp.id);
console.log("Employee's name: "+ emp.name);
console.log("Employee's Email ID: "+ emp.email);

Its output is as follows −

Employee's Id: 123 
Emaployee's name: Smith 
Employee's Email ID: [email protected]

Number Methods

The Number object contains only the default methods that are a part of every object’s definition. Some of the commonly used methods are listed below −

S.No.	Methods & Description
1.	toExponential()Forces a number to display in exponential notation, even if the number is in the range in which JavaScript normally uses standard notation.
2.	toFixed()Formats a number with a specific number of digits to the right of the decimal.
3.	toLocaleString()Returns a string value version of the current number in a format that may vary according to a browser’s local settings.
4.	toPrecision()Defines how many total digits (including digits to the left and right of the decimal) to display of a number. A negative precision will throw an error.
5.	toString()Returns the string representation of the number’s value. The function is passed the radix, an integer between 2 and 36 specifying the base to use for representing numeric values.
6.	valueOf()Returns the number’s primitive value.

Type inference is a feature in TypeScript that allows the compiler to automatically determine (infer) the type of a variable, function or expression. TypeScript is an optionally static type programming language. You can declare variables, expressions, or functions without explicitly annotating their types. The compiler will automatically determine the types at the compile time.

The type inference can be done on the basis of a number of factors, including

• The type of values assigned to the variables.
• The type of function parameters or arguments passed to the function.
• The type of return value of the function.
• The types of the object and properties.

Let’s take a simple example as follows

let x =5;let y ="Hello World!";

In the above code, the TypeScript compiler can infer that the type of variable x is number. This is because the variable x is being assigned a number. The compiler can also infer the type of y is string because the y is being assigned a string.

In the above example, TypeScript automatically infers the types of variables based on the values assigned to them.

Variable or Member Initialization

The type inference can be inferred using the variable and member initialization. The TypeScript compiler infers the type of the variable from the initialized value.

Example

Let’s take an example of variable initialization as follows

let x =20;let y ="Hello World!";let z =true;console.log("type of x: ",typeof x);console.log("type of y: ",typeof y);console.log("type of z: ",typeof z);

On compilation, it will generate the same JavaScript code.

The output of the above example code is as follows

type of x:  number
type of y:  string
type of z:  boolean

Lets have an example of object member initialization

classPerson{
  name ="Shahid";
  age =35;}const p =newPerson();// Prints name and ageconsole.log(${p.name}, ${p.age});

On compilation, it will generate following JavaScript code.

classPerson{constructor(){this.name ="Shahid";this.age =35;}}const p =newPerson();// Prints name and ageconsole.log(${p.name}, ${p.age});

The output of the above code is as follows

Shahid, 35

Function Default Parameter

The typescript compiler can also infer the type of the function parameters when the parameters are initialized with default values.

In the below example, the parameters x and y are initialized with default values. The compiler infers the type of x and y as number. This is because the initialized values are numbers.

functionadd(x =10, y =30){return x + y;}let res =add(2,3);console.log(res);

On compilation, it will generate the same code in JavaScript.

The output of the above example code is as follows

5

Now let’s try to pass arguments as string values.

let res2 =add('2','3');

The type of the parameters of the function add are inferred as number so when we pass arguments of type string to the function, it shows the following error

Argument of type 'string' is not assignable to parameter of type 'number'.

Function Return Type

The TypeScript compiler infers the type of the return type of the function based on the type of the return value.

If the function doesn’t return any value, then the return type is void.

In the example below, the function add accepts the two numbers and return their sum. As the sum of two numbers are number, so the type of return value is number. Hence the compiler infers the return type of the function add as number.

functionadd(x:number, y:number){return x + y;}let res1:number=add(2,3);console.log(res1);

When we assign the return value of the function add to variable (res2) of type string, it will show an error.

let res2:string=add(2,3);

The error is as follows

Type 'number' is not assignable to type 'string'.

This is because the return type of the function add is number and we are assigning it to variable of string type.

Best Common Type: The Union Type

Type inference with variable initialization, function default parameters and return type is straightforward.

When TypeScript infers a type from multiple expressions, the type of the expressions is determined as the “best common type”.

Let’s understand this with the help of an example

const a =[5,10,"TypeScript"];

In the above example, the array contains values 5, 10, and “TypeScript”. To infer the type of the array, we must consider the type of each element. Here, we have choices for the type of the array as number, and string. The inferred type of the array should be the best common type for each value in the array.

The best common type has to be chosen from the provided candidate type. If there is no super type of all candidate types, the union type is used. Hence the inferred type of the above array is

(number | string)[]

The above array can contain values of types number, and string only. If you try to add a value of type different from number and string, it will show an error.

Let’s try to add a boolean value to the array.

const a =[5,10,"TypeScript"];
a.push(true);

The above code will show the following compilation error

Argument of type ‘boolean’ is not assignable to parameter of type ‘string | number’.

Contextual Typing

Contextual typing is a feature in TypeScript that allows the compiler to infer the type of variable, parameter or expression based on the context where they are used. For example,

window.onmousedown=function(mouseEvent){console.log(mouseEvent.button);}

In the above example, the TypeScript infers the type the function expression on right hand side of the assignment using the type of the Window.onmousedown function. So it is able to infer the type of mouseEvent parameter as MouseEvent. This way TypeScript infers that mouseEvent has a button property and doesn’t show a compilation error.

Contextual typing is very helpful in writing concise code without losing type safety.

Type Annotations

In TypeScript,type annotations offer a way to define (or annotate) the data types of variables, class members, function parameters and return values.

TypeScript is a statically typed programming language that optionally supports the dynamic typing. Because of this support any JavaScript file (.js) can be directly renamed as a TypeScript file (.ts). As we know JavaScript is a dynamically typed programming language and TypeScript is the superset of the JavaScript. TypeScript supports all the functionalities of JavaScript plus some additional features.

TypeScript provides the way how to annotate the datatype. By the term “type annotations” means assigning the datatypes.

Variable Type Annotations

TypeScript supports static typing of variables. We can annotate the types of variables while declaring them. Also TypeScript optionally support the dynamic typing as JavaScript.

For example, when we define a variable that holds a number, we can define it as follows –

var x =10;

The above declaration is absolutely permissible in TypeScript as it supports the dynamic typing.

We can annotate the datatype of the variable x as follows

var x:number=10;

To do a type annotation, you can use colon (:) sign after the variable name followed by datatype of the variable.

var varName: datatype

Followings are the different examples to annotate a variable with different datatypes.

let name:string;let age:number;let isEnrolled:boolean;

In the example above, we added string as type of variable name. Similarly, age and isEnrolled are annotated with number and boolean type.

Example

Let’s try the following example. In this example, we have declared two variables, pName, and pAge. We have annotated pName as string and pAge as number.

let pName:string;let pAge:number;
pName ="John Doe";
pAge =35;console.log(Name of the person is ${pName} and his age is ${pAge});

On compiling, TypeScript compiler will produce the following JavaScript code

let pName;let pAge;
pName ="John Doe";
pAge =35;
console.log(Name of the person is ${pName} and his age is ${pAge});

The output of the above JavaScript code is as follows

Name of the person is John Doe and his age is 35

Function Type Annotations

You can add the type to a function in TypeScript. A function’s type has two parts the function parameters and the return type of the function.

Function Parameter Type Annotation

We can annotate the datatypes of the parameters in the function definition.

functiondisplayDetails(id:number, name:string){console.log("ID:", id);console.log("Name", name);}displayDetails(123,"John");

On compiling, it will produce the following JavaScript code

functiondisplayDetails(id, name){
console.log("ID:", id);
console.log("Name:", name);}displayDetails(123,"John");</code></pre>


The result of the above example code is as follows



ID: 123
Name: John




Function Return Type Annotation



You can add the datatype of the function return. It will be the datatype of the value returned by the function.



functionadd(x:number, y:number):number{return x + y;}



If you are not writing a return type then, the default return type of any function will be undefined.



If a function is not returning any value then, you should use void as function return type instead of leaving it off.



For example, instead of writing the following



functiongreet(name:string){console.log(Hello Mr. ${name}. Welcome to Tutorials Point.);}



Write the function using void as return type as follows



functiongreet(name:string):void{console.log(Hello Mr. ${name}. Welcome to Tutorials Point.);}



Example



In the example below, we annotate the function parameters and its return type. The function add take two parameters - x and, y of number type and also a value of number type. The returned value is the sum of the passed arguments to the function.



functionadd(x:number, y:number):number{return x + y;}console.log(add(2,3))



On compiling, it will produce the following JavaScript code



functionadd(x, y){return x + y;}
console.log(add(2,3));



The output of the above code is as follows −



5




Object Properties Type Annotations



You can use the type annotation to add the types to the properties of an object.



Let's define an object using interface as follows −



interfacePerson{
   name:string;
   age:number;}const person: Person ={
   name:"John Doe",
   age:35,}



In the above example, we added types string and number to the properties name and age respectively.



You can assign only string value to the name property and similarly only number value to the age property. Suppose if you try to add a string to age, it will throw an error.



Type 'string' is not assignable to type 'number'.



Example



Let's take a complete example. In this example, we define an interface named Person with two properties name and age. The name property is annotated as string and age is as number. We create an object named person using the interface Person. Then finally, we display the object properties in the console.



interfacePerson{
   name:string;
   age:number;}const person: Person ={
   name:"John Doe",
   age:35,}console.log(The person's name is ${person.name} and person's age is ${person.age});



On compiling, it will produce the following JavaScript code −



const person ={
name:"John Doe",
age:35,};
console.log(The person's name is ${person.name} and person's age is ${person.age});



The output of the above example code if as follows −



The person's name is John Doe and person's age is 35




The type annotations of variables, function parameters and return types, etc. are recommended in TypeScript. But also TypeScript supports dynamic typing as in JavaScript. As you already know that TypeScript supports all ECMAScript features.

The Type System represents the different types of values supported by the language. The Type System checks the validity of the supplied values, before they are stored or manipulated by the program. This ensures that the code behaves as expected. The Type System further allows for richer code hinting and automated documentation too.

TypeScript provides data types as a part of its optional Type System. The data type classification is as given below −

The Any type

The any data type is the super type of all types in TypeScript. It denotes a dynamic type. Using the any type is equivalent to opting out of type checking for a variable.

Built-in types

The following table illustrates all the built-in types in TypeScript −

Data type	Keyword	Description
Number	number	Double precision 64-bit floating point values. It can be used to represent both, integers and fractions.
String	string	Represents a sequence of Unicode characters
Boolean	boolean	Represents logical values, true and false
Void	void	Used on function return types to represent non-returning functions
Null	null	Represents an intentional absence of an object value.
Undefined	undefined	Denotes value given to all uninitialized variables
Symbol	symbol	A unique and immutable primitive introduced in ES2015.
Object	object	Represents instances of user-defined classes, arrays, functions, etc.
Never	never	Represents values that never occur.

There is no integer type in TypeScript and JavaScript.

Now, lets understand each built-in data type in detail.

Number

In TypeScript, the number data type can store the integer, floating point, binary, decimal, hexadecimal, etc. numbers. However, all integers are represented as floating points in TypeScript.

Example

In the code below, the age and marks both variables are of number type. The age variable contains the integer value and the marks variable contains the floating point value.

// Integer numberlet age:number=30;// Float numberlet marks:number=30.5;

String

The string data type is used to store the text value.

You can define a string using three ways:

• Using the single quote
• Using the double quotes
• Using the backticks

The backticks are used to create multiline or template strings.

Example

In the code below, the first_name string is created using the single quote, and the last_name string is created using the double quotes. The full_name string is created using the backticks, which uses the template literals to create a string.

let first_name:string='John';let last_name:string="Doe";let full_name:string=${first_name} ${last_name};

Boolean

In TypeScript, Boolean data type allows you to represent logical entities. It stores the either true or false value. The boolean variables are mainly used with conditional statements like if-else or switch to execute a flow based on some logical value.

Example

In the code below, the isReady is a variable of boolean type, which contains the true value.

let isReady:boolean=true;

Symbol

The symbol is a primitive data type, which is mostly used to create unique values. It allows developers to create unique object keys that wont collide with any other keys.

Example

Here, we have used the Symbol() constructor which returns the new unique key. We have used the UNIQUE_KEY as a key of the obj object.

// Define a symbolconstUNIQUE_KEY=Symbol();// Use the symbol as a property key in an objectlet obj ={[UNIQUE_KEY]:"SecretValue"};

Null

The null type in TypeScript represents the intentional absence of any object value. It is one of the primitive types and is typically used to indicate that a variable intentionally points to no object.

Example

In the code below, the empty variable contains the null value.

let empty:null=null;

Undefined

The undefined data type represents the absence of value. When a variable is declared but is not initialized, it contains the undefined value.

Example

In the code below, the undef variable contains the undefined value.

let undef:undefined;

Null and undefined Are they the same?

The null and the undefined datatypes are often a source of confusion. The null and undefined cannot be used to reference the data type of a variable. They can only be assigned as values to a variable.

However, null and undefined are not the same. A variable initialized with undefined means that the variable has no value or object assigned to it while null means that the variable has been set to an object whose value is undefined.

Object

The object is a non-primitive data type, which can contain any value that is not a number, string, boolean, symbol, null, or undefined. You can create an object using either object literal or Object() constructor.

Example

In the code below, we have created the object using the object literal. The type of the person variable is an object. We have added the key-value pair between the curly braces (object literal).

let person: object ={name:"Bob"};

Void

The void type is used in the return type of functions that do not return a value. It signifies that there is no type at all.

Example

Here, we have used the void data type with function to not return any value from the function.

functionlog():void{console.log("log");}

User-defined Types

User-defined types include Enumerations (enums), classes, interfaces, arrays, and tuple. These are discussed in detail in the later chapters.

Array

The array data type is a collection of the same elements. It stores the elements, which you can access or update using the array index that starts from 0.

The array of any data type can be defined as data_type[] or Array<data_type>, where <data_type> can be any primitive or non-primitive data type.

Example

In the code below, we have defined the array of numbers which contains only 3 elements. The index of 1 is 0, the index of 2 is 1, and the index of 3 is 2.

let numbers:number[]=[1,2,3];

Tuple

Tuple types allow you to express an array with a fixed number of elements whose types are known, but need not be the same. This adds a level of safety when dealing with arrays that need to have a specific structure.

Example

In the code below, the tuple variable can have an array of length 2 as a value. The first element of the tuple is of string type, and the second element of the tuple is of number type.

let tuple:[string,number]=["hello",10];console.log(tuple);// Output: ["hello", 10]

Enum

An enumeration is a collection of related values that can be numeric or string values. enum makes it easy to handle sets of related constants in a more readable way.

Example

In the code below, the Color enum contains the different colors. We can access the color using the enum name which is Color followed by a dot and color name value.

enum Color {Red, Green, Blue}let c: Color = Color.Green;console.log(c);// Output: 1

What is an Operator?

An operator defines some function that will be performed on the data. The data on which operators work are called operands. Consider the following expression −

7 &plus; 5 = 12

Here, the values 7, 5, and 12 are operands, while &plus; and = are operators.

The major operators in TypeScript can be classified as −

• Arithmetic operators
• Logical operators
• Relational operators
• Bitwise operators
• Assignment operators
• Ternary/conditional operator
• String operator
• Type Operator

Arithmetic Operators

Assume the values in variables a and b are 10 and 5 respectively.

Show Examples

Operator	Description	Example
+ (Addition)	returns the sum of the operands	a + b is 15
– (Subtraction)	returns the difference of the values	a – b is 5
* (Multiplication)	returns the product of the values	a * b is 50
/ (Division)	performs division operation and returns the quotient	a / b is 2
% (Modulus)	performs division operation and returns the remainder	a % b is 0
++ (Increment)	Increments the value of the variable by one	a++ is 11
— (Decrement)	Decrements the value of the variable by one	a– is 9

Relational Operators

Relational Operators test or define the kind of relationship between two entities. Relational operators return a Boolean value, i.e., true/ false.

Assume the value of A is 10 and B is 20.

Show Examples

Operator	Description	Example
>	Greater than	(A > B) is False
<	Lesser than	(A < B) is True
>=	Greater than or equal to	(A >= B) is False
<=	Lesser than or equal to	(A <= B) is True
==	Equality	(A == B) is false
!=	Not equal	(A != B) is True

Logical Operators

Logical Operators are used to combine two or more conditions. Logical operators too return a Boolean value. Assume the value of variable A is 10 and B is 20.

Show Examples

Operator	Description	Example
&& (And)	The operator returns true only if all the expressions specified return true	(A > 10 && B > 10) is False
|| (OR)	The operator returns true if at least one of the expressions specified return true	(A > 10 || B >10) is True
! (NOT)	The operator returns the inverse of the expressions result. For E.g.: !(>5) returns false	!(A >10 ) is True

Bitwise Operators

Assume variable A = 2 and B = 3

Show Examples

Operator	Description	Example
& (Bitwise AND)	It performs a Boolean AND operation on each bit of its integer arguments.	(A & B) is 2
| (BitWise OR)	It performs a Boolean OR operation on each bit of its integer arguments.	(A | B) is 3
^ (Bitwise XOR)	It performs a Boolean exclusive OR operation on each bit of its integer arguments. Exclusive OR means that either operand one is true or operand two is true, but not both.	(A ^ B) is 1
~ (Bitwise Not)	It is a unary operator and operates by reversing all the bits in the operand.	(~B) is -4
<< (Left Shift)	It moves all the bits in its first operand to the left by the number of places specified in the second operand. New bits are filled with zeros. Shifting a value left by one position is equivalent to multiplying it by 2, shifting two positions is equivalent to multiplying by 4, and so on.	(A << 1) is 4
>> (Right Shift)	Binary Right Shift Operator. The left operands value is moved right by the number of bits specified by the right operand.	(A >> 1) is 1
>>> (Right shift with Zero)	This operator is just like the >> operator, except that the bits shifted in on the left are always zero.	(A >>> 1) is 1

Assignment Operators

Show Examples

Operator	Description	Example
= (Simple Assignment)	Assigns values from the right side operand to the left side operand	C = A + B will assign the value of A + B into C
+= (Add and Assignment)	It adds the right operand to the left operand and assigns the result to the left operand.	C += A is equivalent to C = C + A
-= (Subtract and Assignment)	It subtracts the right operand from the left operand and assigns the result to the left operand.	C -= A is equivalent to C = C – A
*= (Multiply and Assignment)	It multiplies the right operand with the left operand and assigns the result to the left operand.	C *= A is equivalent to C = C * A
/= (Divide and Assignment)	It divides the left operand with the right operand and assigns the result to the left operand.

Note − Same logic applies to Bitwise operators, so they will become <<=, >>=, >>=, &=, |= and ^=.

Miscellaneous Operators

The negation operator (-)

Changes the sign of a value. Lets take an example.

var x:number=4var y =-x;console.log("value of x: ",x);//outputs 4 console.log("value of y: ",y);//outputs -4

On compiling, it will generate following JavaScript code.

//Generated by typescript 1.8.10var x =4;var y =-x;console.log("value of x: ", x);//outputs 4console.log("value of y: ", y);//outputs -4

It will produce the following output −

value of x:  4 
value of y:  -4

String Operators: Concatenation operator (&plus;)

The &plus; operator when applied to strings appends the second string to the first. The following example helps us to understand this concept.

var msg:string="hello"+"world"console.log(msg)

On compiling, it will generate following JavaScript code.

//Generated by typescript 1.8.10var msg ="hello"+"world";console.log(msg);

It will produce the following output −

helloworld

The concatenation operation doesnt add a space between strings. Multiple strings can be concatenated in a single statement.

Conditional Operator (?)

This operator is used to represent a conditional expression. The conditional operator is also sometimes referred to as the ternary operator. The syntax is as given below −

Test ? expr1 : expr2

• Test − refers to the conditional expression
• expr1 − value returned if the condition is true
• expr2 − value returned if the condition is false

Lets take a look at the following code −

var num:number=-2var result = num >0?"positive":"non-positive"console.log(result)

Line 2 checks whether the value in the variable num is greater than zero. If num is set to a value greater than zero, it returns the string positive else the string non-positive is returned.

On compiling, it will generate following JavaScript code.

//Generated by typescript 1.8.10var num =-2;var result = num >0?"positive":"non-positive";console.log(result);

The above code snippet will produce the following output −

non-positive

Type Operators

typeof operator

It is a unary operator. This operator returns the data type of the operand. Take a look at the following example −

var num =12console.log(typeof num);//output: number

On compiling, it will generate following JavaScript code.

//Generated by typescript 1.8.10var num =12;console.log(typeof num);//output: number

It will produce the following output −

number

instanceof

This operator can be used to test if an object is of a specified type or not. The use of instanceof operator is discussed in the chapter classes.

TypeScript has the same rules as JavaScript to declare variables. Initially, only the ‘var’ keyword was used to declare the variable, but in the ES6 version of JavaScript ‘let’ and ‘const’ keywords are introduced to declare a variable. So, you can also use them in TypeScript.

In this lesson, you will learn to declare a variable using the ‘let’ and ‘const’ keywords and how those variables are different from the variables declared using the ‘var’ keyword.

Declaring a variable using the let keyword

When we declare the variable using the ‘let’ keyword in TypeScript, the scoping rule and hoisting rule remain the same as in JavaScript.

Syntax

The syntax to declare a variable using the ‘let’ keyword in TypeScript is as follows

let var_name: var_type = value;

• In the above syntax, ‘let’ is a keyword.
• ‘var_name’ is a valid identifier for a variable name.
• ‘var_type’ is a type of the variable.
• ‘value’ is a value to store in the variable.

Example

In the code below, we have defined the ‘car_name’ variable of string type which contains the Brezza value. The ‘car_price’ variable contains the 1000000 number value.

// Define a variable in TypeScriptlet car_name:string="Brezza";let car_price:number=1000000;console.log(car_name);console.log(car_price);

On compiling, it will generate the following JavaScript code.

// Define a variable in TypeScriptlet car_name ="Brezza";let car_price =1000000;
console.log(car_name);
console.log(car_price);

Output

The output of the above example code is as follows

Brezza
1000000

Variable Scope

The variables declared using the ‘let’ keyword have the block scope. It means you can’t access the variable outside the block unlike the variable declared using the ‘var’ keyword.

Let’s learn it via the example below.

In the code below, the ‘bool’ variable contains a true value so the code of the ‘if’ statement will always execute. In the ‘if’ block, we have declared the ‘result’ variable which can be accessed inside the ‘if’ block only. If you try to access it outside the ‘if’ block, the TypeScript compiler will throw an error.

let bool:boolean=true;if(bool){let result:number=10;console.log(result);// It can have accessed only in this block}// console.log(result); Can't access variable outside of the block.

Let variables cannot be re-declared

You can’t re-declare the variables that are declared using the ‘let’ keyword.

Let’s look at the example below.

In the code below, you can observe that if we try to re-declare the same variable, the TypeScript compiler throws an error.

let animal:string="cat";// let animal: string = "dog"; // Error: Cannot redeclare block-scoped variable 'animal'console.log(animal);// Output: cat

On compiling, it will generate the following JavaScript code.

let animal ="cat";// let animal: string = "dog"; // Error: Cannot redeclare block-scoped variable 'animal'
console.log(animal);// Output: cat

The output of the above example code is as follows

cat

Variables with the same name in different blocks

The variables declared using the ‘let’ keyword have a block scope. So, variables with the same name but if they are in different blocks, are considered as different variables.

Let’s look at the examples below.

In the code below, we have declared the ‘num’ variable in ‘if’ and ‘else’ both blocks and initialized them with different values.

let bool:boolean=false;// If the boolean is true, the variable num will be 1, otherwise it will be 2if(bool){let num:number=1;console.log(num);}else{let num:number=2;console.log(num);}

On compiling, it will generrate the following JavaScript code.

let bool =false;// If the boolean is true, the variable num will be 1, otherwise it will be 2if(bool){let num =1;
console.log(num);}else{let num =2;
console.log(num);}</code></pre>


The output of the above example code is as follows



2




Declaring a variable using a 'const' keyword



The 'const' keyword has the same syntax as 'var' and 'let' to declare variables. It is used to declare the constant variables. Furthermore, you need to initialize the 'const' variables while defining them, and you can't change them later.



Syntax



The syntax to declare a variable using the 'const' keyword in TypeScript is as follows



const var_name: var_type = value;



In the above syntax, 'const' is a keyword.



Example



In the code below, we have defined the 'lang' and 'PI' variables using the 'const' keywords, which contain the 'TypeScript' and '3.14' values, respectively.



// Define a constant variable in TypeScriptconst lang:string='TypeScript';constPI:number=3.14;console.log(Language: ${lang});console.log(Value of PI: ${PI});



On compiling, it will generate the following JavaScript code.



// Define a constant variable in TypeScriptconst lang ='TypeScript';constPI=3.14;
console.log(Language: ${lang});
console.log(Value of PI: ${PI});



The output of the above example code is as follows



Language: TypeScript
Value of PI: 3.14




The variables are declared using the 'const' keyword has the same rule for scoping and re-declaration as the variable declared using the 'let' keyword.



In the code below, you can observe that if you try to re-declare the 'const' variable in the same scope or try to change its value after declaring it, it throws an error.



if(true){constPI:number=3.14;console.log(PI);// const PI: number = 3.14; Error: Cannot redeclare block-scoped variable 'PI'.// PI = 3.15; Error: Cannot assign to 'PI' because it is a constant.}



On compiling, it will generate the following JavaScript code.



if(true){constPI=3.14;
console.log(PI);// const PI: number = 3.14; Error: Cannot redeclare block-scoped variable 'PI'.// PI = 3.15; Error: Cannot assign to 'PI' because it is a constant.}</code></pre>


The output of the above example code is as follows



3.14 




You learned to use the 'let' and 'const' statements to declare variables. It is always a good idea to declare a variable using the 'let' keyword due to its block scoping features, which avoids the overriding of values of variables declared in the different scopes.