In this tutorial I am going to explain about some core concepts of Typescript and trying to teach you in simpler way. So please be with me till the end of this tutorial.
Here I am going to explain you about Object Types and Union Types
In the beginning we will go with Object Types and then after we will cover Union Types. Keep in mind both are important topics. So please focus till the end.
Object Type
To Define an Object, we need to define its properties and their types. So, Suppose Person is an object and Person contains its properties like name, age, salary.
That we can write like this
/**
Object example
*/
let Person:{
name:string,
age:number,
salary:number,
}={
name:"Dheeraj",
age:28,
salary:5000
}
Then to define person object we need focus on each property of person and define their types as we have done previously.
Note: If we missed to define type of the property then by default it will take any type to that property.
For its Better understanding we are going to create a function and pass object as parameter.
function displayDetails(person:{name:string,age:number,salary:number}){
return ` ->Person Name :${person.name}\n ->Person Age : ${person.age} \n ->Person Salary : ${person.salary}`
}
console.log(displayDetails({name:'Dheeraj',age:28,salary:200})); //calling function
In above example we are passing object as parameter in displayDetails function. During specifying object, we have taken all properties of person object and their respective types also.
Compile and Run
tsc app.ts // compile code
node app.js // run code
OutPut:
Optional Properties
Object type can also specify some or all the Properties Optional. To do this we need to add? after Properties name.
function displayDetails(person:{name:string,age:number,salary?:number}){
return `
->Person Name :${person.name}
->Person Age : ${person.age}
->Person Salary : ${person.salary}`
}
Here in above example, we have mentioned that salary is optional property of displayDetails function. So, during calling this function we have an option that either we can pass salary value, or we just ignore it.
As shown below
console.log(displayDetails({name:'Dheeraj',age:28})); // not mentioned salary
console.log(displayDetails({name:'Dheeraj',age:28,salary:5000})); //mentioned salary
Compile and Run
tsc app.ts // compile code
node app.js // run code
OutPut:
Union Type
Suppose we must enter employeeId of employees and some of the employee contains its employeeId as number like 1001,2001,4001 and some other employee contains their employeeIds as strings like K20031, B012WR1, SP4081 etc and during this scenario we have a single variable that basically accepts both type of inputs from employee.
Then in that case Union types comes under the picture. So according to Definition of Union type
A Union is a type formed from two or more other types. Representing the values that may be any those types.
To specifying a union type on a variable we just need to mention pipe (|) with that variable type as shown below.
let id=number | string;
Here in this example id will accept both values i.e it may be string, or it may be a number also.
function printingId(id:number|string){
return `Id : ${id} -> type of Id :${typeof (id)}`
}
console.log(printingId('KD1233)); // string type
console.log(printingId(1233)) // number type
Compile and Run
tsc app.ts // compile code
node app.js // run code
OutPut:
