TypeScript Interview Questions and Answers
1. What are some benefits of using TypeScript over JavaScript in a project?
Answer: TypeScript is a superset of javascript. Typescript is especially beneficial for large-scale projects where code maintenance and scalability are important.
- Typescript Support older browser
- Typescript is more dependable
- TypeScript is more Explicit than javascript
- Static typing is an optional feature
- Bugs can detected early and less bugs and less testing
- Type consistency
- Code Easily readable with typescript
- Support class-based OOP principles such as class, interface, and inheritance
- Increase Productivity
2. What is the purpose of the optional chaining (?.) and nullish coalescing (??) operators in TypeScript, and how do they work? Provide an example for each?
Answer:
[Optional Chaining]:- Optional chaining operator(?) allows you to access properties or call methods on an object even if some of the intermediate properties are possibly null or undefined.
Example:
user?.name or
user?.address?.city
[Nullish coalescing Operator]:- Nullish coalescing operator is a logical operator that returns its right-hand side operand when its left-hand side operand is null or undefined. If we need to make a decision depending on a null or undefined value we can use a nullish coalescing operator.
Example: const name:string: null;
const checkName = name ?? ‘Moyuri’
3. How do you handle asynchronous operations in TypeScript, and what are the advantages of using async/await over callbacks or Promises?
Answer: Asynchronous programming allows us to perform multiple tasks parallelly. By using async/await we can make the function asynchronous. asynchronous functions are prefixed with the async keyword, await suspense the execution until an asynchronous function return promise is fulfilled.
Example:
const requestData = async() =>{
try{
const data = JSON.parse(await getJSON())
console.log(data);
}catch(error){
console.log(error);
}
}
Advantages of async/await over callback and promises:
- More readable and concise compared to promises and callbacks.
- Built-in error handling with try-catch blocks.
- Can be used with promises and async functions.
4. How can you use TypeScript’s enums, and what are their advantages?
Answer: Typescript enums allow you to define a set of named constants, providing a way to represent a group of related values in a more structured manner. you can declare an enum using the ‘enum’ keyword, followed by the name and a set of values enclosed in curly braces. enum members are typically used to store constants. members can have string constants, numerical constants, or mix both,
Example: enum Direction {
Up=’UP’,
Down=’DOWN’,
Left=’LEFT’,
Right=’RIGHT’
}
Enum Advantages:
- Readability
- Type Safety
- Autocompletion
- Namespace like organization
- Reverse mapping
- iterating over enum values
5. Explain the role of type guards in TypeScript and provide an example of a custom type guard?
Answer: Type gard work on run time using typeof operator. it checks the type of parameters and then makes them perform their operation. In TypeScript, the type guards are used to determine a variable’s type, often inside a condition or function block. The type guards usually take the variable and return a Boolean value or the variable type. Type guards allow you to tell the TypeScript compiler to infer a given type for a variable in a specific context, guaranteeing that an argument’s type is what you say it is.
Example:
type StrOrNum = number | string;
const add = (param1: StrOrNum, param2: StrOrNum) : StrOrNum =>{
if(typeof param1 === ‘number’ && typeof param2 === ‘number’){
return param1 + param2;
}else{
return param1.toString() + param2.toString();
}
}
const result = add(2, “5”);
6. Can you give an example of how to use “readonly” properties in TypeScript?
Answer: It’s a feature that tells the TypeScript compiler to make a property readonly. that means you cannot reassign its value once it has been constructed. The only place a readonly property can be assigned is inside the TypeScript constructor.
Example:
class BankAccount {
readonly id: number;
public name: string;
protected balance: number;
constructor(id: number, name: string, balance: number) {
this.id = id;
this.name = name;
this.balance = balance;
}
}
const poorGirl = new BankAccount(1122,’Moyuri’, 100);
// poorGirl.id = 2233; // id can’t reassign because it’s readonly
console.log(poorGirl)
Explain what a union type is in TypeScript and provide an example of its usage?
Answer: In typescript, we can define a variable that can have multiple types of values. or we can say typescript can combine two or more types in a single type, which is called union type. union types are a powerful way to express a variable with multiple types.
Example:
const add = (value1: string | number): string | number =>{
const value2 = 10;
if(typeof value1 === ‘number’){
return value1 + value2;
}else{
return value1;
}
}