Typescript

1.What are the primitive types of TypeScript?(List the built-in types in

TypeScript)

The built-in data types are also known as primitive data types in TypeScript.
The three primitive types of TypeScript are string, number and boolean.
These three types are similar to their JavaScript counterparts.
o Number type is used to represent numeric values. All the numbers in
TypeScript are stored as floating point values.
Syntax: let identifier: number = value;
o String type is used to represent text values. We include literals in our
scripts by enclosing them in single or double quotation marks.
Syntax: let identifier: string = “”;
o Boolean type is used to represent a logical value that can have either a
‘true’ or ‘false’ value.
Syntax: let identifier: bool = Boolean value;

2. What are the differences between JavaScript and TypeScript?

One of the most apparent differences between these two languages is that
JavaScript is a scripting language while TypeScript is an object-oriented
language.
TypeScript also has the static typing feature, and it offers support for
parameter functions and models.
JavaScript doesn’t feature any of these capabilities.

3. What are some key benefits of TypeScript?

One of the main benefits of TypeScript is that it can operate on any

JavaScript engine or browser.
Another benefit of this programming language is that it uses the same
semantics and syntax as JavaScript, meaning that back-end coders can help
create front-end code quicker
5. What access modifiers does TypeScript support?

TypeScript supports three types of access modifiers: public, protected and

private. All
class and child class members and the instance of each class can access
public access
modifiers. Class and child class members can access protected access
modifiers. Only
class members can access private access modifiers. If TypeScript doesn’t
specify an
access modifier, it’s inherently a public one.

7. What are Generics in TypeScript?

TypeScript Generics allows users to create recyclable coding elements. It

also helps users
write components that remain compatible with multiple types of data. I
particularly
enjoy using Generics because of the security it offers.

10. How is TypeScript different from JavaScript?

- JavaScript: It was developed by Netscape in 1995.

TypeScript: It was developed by Anders Hejlsberg in 2012.
- JavaScript: JavaScript source file is in “.js” extension.
TypeScript: TypeScript source file is in “.ts” extension.
- JavaScript: JavaScript doesn’t support ES6.
TypeScript: TypeScript supports ES6.
- JavaScript: It doesn’t support strongly typed or static typing.
TypeScript: It supports strongly typed or static typing feature.
- JavaScript: It is just a scripting language.
TypeScript: It supports object-oriented programming concept like classes,
interfaces,
inheritance, generics, etc.
- JavaScript: JavaScript has no optional parameter feature.
TypeScript: TypeScript has optional parameter feature.
- JavaScript: It is interpreted language that’s why it highlighted the errors at
runtime.
TypeScript: It compiles the code and highlighted errors during the
development time.
- JavaScript: JavaScript doesn’t support modules.
TypeScript: TypeScript gives support for modules.
- JavaScript: In this, number, string are the objects.
TypeScript: In this, number, string are the interface.
- JavaScript: JavaScript doesn’t support generics.
TypeScript: TypeScript supports generics.

11. Why do we need TypeScript?

o TypeScript is fast, simple, and most importantly, easy to learn.

o TypeScript supports object-oriented programming features such as classes,
interfaces, inheritance, generics, etc.
o TypeScript provides the error-checking feature at compilation time. It will
compile
the code, and if any error found, then it highlighted the errors before the
script is
run.
o TypeScript supports all JavaScript libraries because it is the superset of
JavaScript.
o TypeScript support reusability by using the inheritance.
o TypeScript make app development quick and easy as possible, and the
tooling
support of TypeScript gives us autocompletion, type checking, and source
documentation.
o TypeScript supports the latest JavaScript features including ECMAScript
2015.
o TypeScript gives all the benefits of ES6 plus more productivity.
o TypeScript supports Static typing, Strongly type, Modules, Optional
Parameters,
etc.

12. List some features of TypeScript?

o Object-Oriented Language
o Support JavaScript Libraries
o JavaScript is TypeScript
o TypeScript is Portable
o DOM Manipulation
o TypeScript is just JavaScript
13. List some benefits of using TypeScript.

TypeScript has the following benefits.

o It provides the benefits of optional static typing. Here, Typescript provides
types
that can be added to variables, functions, properties, etc.
o Typescript has the ability to compile down to a version of JavaScript that
runs on
all browsers.
o TypeScript always highlights errors at compilation time during the time of
development whereas JavaScript points out errors at the runtime.
o TypeScript supports strongly typed or static typing whereas this is not in
JavaScript.
o It helps in code structuring.
o It uses class-based object-oriented programming.
o It provides excellent tooling supports with IntelliSense which provides
active hints
as the code is added.
o It has a namespace concept by defining a module.

14. What are the disadvantages of TypeScript?

TypeScript has the following disadvantages:

o TypeScript takes a long time to compile the code.
o TypeScript does not support abstract classes.
o If we run the TypeScript application in the browser, a compilation step is
required
to transform TypeScript into JavaScript.
o Web developers are using JavaScript from decades and TypeScript doesn?t
bring
anything new.
o To use any third party library, the definition file is must. And not all the
third party
library have definition file available.
o Quality of type definition files is a concern as for how can you be sure the
definitions are correct?
21. What do you mean by interfaces? Explain them with reference to
TypeScript

An Interface is a structure which acts as a contract in our application. It

defines the
syntax for classes to follow, it means a class that implements an interface is
bound to
implement all its members. It cannot be instantiated but can be referenced
by the class
object that implements it. The TypeScript compiler uses interface for type-
checking (also
known as "duck typing" or "structural subtyping") whether the object has a
specific
structure or not.
Syntax:
interface interface_name {
// variables' declaration
// methods' declaration
}
The interface just declares the methods and fields. It cannot be used to build
anything.
Interfaces need not be converted to JavaScript for execution. They have zero
runtime
JavaScript impact. Thus, their only purpose is to help in the development
stage.

22. What do you understand by classes TypeScript? List some features

of classes.

We know, TypeScript is a type of Object-Oriented JavaScript language and

supports
OOPs programming features like classes, interfaces, etc. Like Java, classes
are the
fundamental entities which are used to create reusable components. It is a
group of
objects which have common properties. A class is a template or blueprint for
creating
objects. It is a logical entity. The "class" keyword is used to declare a class in
Typescript.
Example:
class Student {
studCode: number;
studName: string;
constructor(code: number, name: string) {
this.studName = name;
this.studCode = code;
}
getGrade() : string {
return "A+" ;
}
}
Features of a class are:
- Inheritance
- Encapsulation
- Polymorphism
- Abstraction

24. Which object oriented terms are supported by TypeScript?

TypeScript supports following object oriented terms.

- Modules
- Classes
- Interfaces
- Inheritance
- Data Types
- Member Functions

26. How do you implement inheritance in TypeScript?

Inheritance is a mechanism that acquires the properties and behaviors of a

class from
another class. It is an important aspect of OOPs languages and has the
ability which
creates new classes from an existing class. The class whose members are
inherited is
called the base class, and the class that inherits those members is called the
derived
class.
An Inheritance can be implemented by using the extend keyword. We can
understand it
by the following example.
class Shape {
Area:number
constructor(area:number) {
this.Area = area
}
}
class Circle extends Shape {
display():void {
console.log("Area of the circle: "+this.Area)
}
}
var obj = new Circle(320);
obj.display() //Output: Area of the circle: 320

29. What is namespace in TypeScript? How to declare a namespace in

TypeScript?

A namespace is a way that is used for logical grouping of functionalities.

Namespaces
are used to maintain the legacy code of typescript internally. It encapsulates
the features
and objects that share certain relationships. A namespace is also known as
internal
modules. A namespace can also include interfaces, classes, functions, and
variables to
support a group of related functionalities.
Note: A namespace can be defined in multiple files and allow to keep each
file as they
were all defined in one place. It makes code easier to maintain.
Synatax for creating namespace
namespace <namespace_name> {
export interface I1 { }
export class c1{ }
}

30. Explain Decorators in TypeScript?

A Decorator is a special kind of declaration that can be applied to

classes, methods,
accessor, property, or parameter. Decorators are simply functions that
are
prefixed @expression symbol, where expression must evaluate to a
function that will be
called at runtime with information about the decorated declaration.
TypeScript Decorators serves the purpose of adding both annotations and
metadata to
the existing code in a declarative way. Decorators are an experimental
feature proposed
for ES7. It is already in use by some of the JavaScript frameworks including
Angular
2. The Decorators may change in future releases.
To enable experimental support for decorators, we must enable the
experimentalDecorators compiler option either on the command line or in
our
tsconfig.json:
Command Line
$tsc --target ES5 --experimentalDecorators
tsconfig.json
{
"compilerOptions": {
"target": "ES5",
"experimentalDecorators": true
}
}

31. What are Mixins?

In Javascript, Mixins are a way of building up classes from reusable

components is to
build them by combining simpler partial classes called mixins.
The idea is simple, instead of a class A extending class B to get its
functionality, function
B takes class A and returns a new class with this added functionality.
Function B is a
mixin.
32. What is default visibility for properties/methods in TypeScript
classes?

Public is the default visibility for properties/methods in TypeScript classes.

37. What is TypeScript Declare Keyword?

We know that all JavaScript libraries/frameworks don't have TypeScript

declaration files,
but we want to use them in our TypeScript file without any compilation
errors. To do
this, we use the declare keyword. The declare keyword is used for ambient
declarations
and methods where we want to define a variable that may exist elsewhere.
For example, suppose we have a library called myLibrary that doesn't have a
TypeScript
declaration file and have a namespace called myLibrary in the global
namespace. If we
want to use that library in our TypeScript code, we can use the following
code:
declare var myLibrary;
TypeScript runtime will assign the myLibrary variable as any type. Here is a
problem that
we won't get Intellisense in design time but we will be able to use the library
in our
code.

38. How to generate TypeScript definition file from any .ts file?

We can generate TypeScript definition file from any .ts file by using tsc
compiler. It will
be generating a TypeScript definition which makes our TypeScript file
reusable.
tsc --declaration file1.ts
42. How to check null and undefined in TypeScript?

By using a juggling-check, we can check both null and undefined:

if (x == null) {
}
If we use a strict-check, it will always true for values set to null and won't
evaluate as
true for undefined variables.
Example
var a: number;
var b: number = null;
function check(x, name) {
if (x == null) {
console.log(name + ' == null');
}
if (x === null) {
console.log(name + ' === null');
}
if (typeof x === 'undefined') {
console.log(name + ' is undefined');
}
}
check(a, 'a');
check(b, 'b');
Output
"a == null"
"a is undefined"
"b == null"
"b === null"

43. Could we use TypeScript on the backend? If yes, how?

Yes, we can use TypeScript on the backend. We can understand it with the
following
example. Here, we choose Node.js and have some additional type safety and
the other
abstraction that the language brings.
Install Typescript
o
compiler
npm i -g typescript
o The TypeScript compiler takes options in the tsconfig.json file. This file
determines where to put built files.
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"declaration": true,
"outDir": "build"
}
}
Compile ts
o
files
tsc

Run
o
node
build/index.js

44.What is the difference between “interface vs type” statements?

interface X {
a: number
b: string
}
type X = {
a: number
b: string
};
- Interface: An interface declaration always introduces a named object type.
type: A type alias declaration can introduce a name for any kind of type,
including
primitive, union, and intersection types.
- Interface: An interface can be named in an extends or implements clause.
type: Type alias for an object type literal cannot be named in an extends or
implements
clause.
- Interface: Interfaces create a new name that is used everywhere.
type: Type alias don’t create a new name.
- Interface: An interface can have multiple merged declarations.
type: Type alias for an object type literal cannot have multiple merged
declarations.
45. What are Ambients in TypeScripts and when to use them?

Ambient declarations tell the compiler about the actual source code exist
elsewhere. If
these source codes do not exist at runtime and we try to use them, then it
will break
without warning.
Ambient declarations files are like docs file. If the source changes, the docs
need to be
kept updated also. If the ambient declaration file is not updated, then we will
get
compiler errors.
The Ambient declarations allow us to safely and easily use existing popular
JavaScript
libraries like jquery, angularjs, nodejs, etc.

46. What is a TypeScript Map file?

o TypeScript Map file is a source map file which holds information about our
original files.
o .map files are source map files that let tools map between the emitted
JavaScript
code and the TypeScript source files that created it.
o Many debuggers can consume these files so we can debug the TypeScript
file
instead of the JavaScript file.

47. What is Type assertions in TypeScript?

Type assertion works like a typecasting in other languages, but it doesn't

perform type
checking or restructuring of data just like other languages can do like C# and
Java. The
typecasting comes with runtime support whereas type assertion has no
impact
on runtime. However, type assertions are used purely by the compiler and
provide hints
to the compiler on how we want our code to be analyzed.
let empCode: any = 111;
let employeeCode = code as number;
console.log(typeof(employeeCode)); //Output: number
When using TypeScript with JSX, only as-style assertions are allowed.

48. What is JSX? Can we use JSX in TypeScript?

JSX is NOTHING BUT Javascript with a different extension. Facebook came

up with this
new extension so that they can distinguish from the XML-like implementation
of HTML
in JavaScript.
JSX is an embeddable XML-like syntax. It is meant to be transformed into
valid
JavaScript. JSX came to popularity with the React framework. TypeScript
supports
embedding, type checking, and compiling JSX directly into JavaScript.
To use JSX, we must do two things.
o Name the files with a .tsx extension
o Enable the jsx option

49. What is Rest parameters?

The rest parameter is used to pass zero or more values to a function. It is

declared by
prefixing the three dot characters ('...')before the parameter. It allows the
functions to
have a variable number of arguments without using the arguments object. It
is very
useful where we have an undetermined number of parameters.
Rules to follow in rest parameter:
o Only one rest parameter is allowed in a function.
o It must be an array type.
o It must be a last parameter in the parameter list.
function sum(a: number, ...b: number[]): number {
let result = a;
for (var i = 0; i < b.length; i++) {
result += b[i];
}
console.log(result);
}
let result1 = sum(3, 5);
let result2 = sum(3, 5, 7, 9);

50. Explain Enum in TypeScript?

Enums or enumerations are a TypeScipt data type that allow us to define a

set of named
constants. Using enums can make it easier to document intent, or create a
set of distinct
cases. It is a collection of related values that can be numeric or string values.
Example
enum Gender {
Male,
Female
Other
}
console.log(Gender.Female); // Output: 1
//We can also access an enum value by it's number value.
console.log(Gender[1]); // Output: Female

51. Explain Relative vs. Non-relative module imports.

- Non-Relative
A non-relative import can be resolved relative to baseUrl, or through path
mapping. In
other words, we use non-relative paths when importing any of our external
dependencies.
Example:
import * as $ from "jquery";
import { Component } from "@angular/core";
- Relative
Relative imports can be used for our own modules that are guaranteed to
maintain their
relative location at runtime. A relative import is starts with /, ./ or ../.
Example:
import Entry from "./components/Entry";
import {DefaultHeaders} from "../constants/http";
52. What is an anonymous function?

An anonymous function is a function that was declared without any named

identifier. These functions are dynamically declared at runtime. Anonymous
functions
can accept inputs and return outputs, just as standard functions do. An
anonymous
function is usually not accessible after its initial creation.
Example
let myAdd = function(x: number, y: number): number {
return x + y;
};
console.log(myAdd())

53. What is Declaration Merging?

Declaration merging is the process followed by the compiler to

merge two or more separate declarations. The declaration declared with the
same
name into a single definition. This merged definition has the features of both
of the
original declarations.
The simplest, and perhaps most common, type of declaration merging is
interface
merging. At the most basic level, the merge mechanically joins the members
of both
declarations into a single interface with the same name.
Example
interface Cloner {
clone(animal: Animal): Animal;
}
interface Cloner {
clone(animal: Sheep): Sheep;
}
interface Cloner {
clone(animal: Dog): Dog;
clone(animal: Cat): Cat;
}
The three interfaces will merge to create a single declaration as so:
interface Cloner {
clone(animal: Dog): Dog;
clone(animal: Cat): Cat;
clone(animal: Sheep): Sheep;
clone(animal: Animal): Animal;
}
Note: Not all merges are allowed in TypeScript. Currently, classes can not merge with
other
classes or variables.

54. What are method overriding in TypeScript?

If subclass (child class) has the same method as declared in the parent class,
it is known
as method overriding. In other words, redefined the base class methods in
the derived
class or child class.
Rules for Method Overriding
o The method must have the same name as in the parent class
o The method must have the same parameter as in the parent class.
o There must be an IS-A relationship (inheritance).
Example
class NewPrinter extends Printer {
doPrint(): any {
super.doPrint();
console.log("Called Child class.");
}
doInkJetPrint(): any {
console.log("Called doInkJetPrint().");
}
}
let printer: new () => NewPrinter;
printer.doPrint();
printer.doInkJetPrint();

55. What is Lambda/Arrow function?

ES6 version of TypeScript provides shorthand syntax for defining the

anonymous
function, i.e., for function expressions. These arrow functions are also
called Lambda functions. A lambda function is a function without a name.
Arrow
function omits the function keyword.
Example
let sum = (a: number, b: number): number => {
return a + b;
}
console.log(sum(20, 30)); //returns 50
In the above, the ?=>? is a lambda operator and (a + b) is the body of the
function and
(a: number, b: number) are inline parameters.

56. Explain how the arrays works in TypeScript.

We use arrays to store values of the same type. Arrays are ordered and
indexed
collections of values. The indexing starts at 0, i.e., the first element has
index 0, the
second has index 1, and so on.
Here is the syntax to declare and initialize an array in TypeScript.
let values: number[] = [];
values[0] = 10;
values[1] = 20;
values[2] = 30;
You can also create an array using the short-hand syntax as follows:
let values: number[] = [15, 20, 25, 30];
TypeScript provides an alternate syntax to specify the Array type.
let values: Array<number> = [15, 20, 25, 30];

57. What is any type, and when to use it?

There are times when you want to store a value in a variable but don’t know
the type
of that variable in advance. For example, the value is coming from an API call
or the
user input. The ‘any’ type allows you to assign a value of any type to the
variable of
type any.
let person: any = "Foo";
Here is an example that demonstrates the usage of any type.
// json may come from a third-party API
const employeeData: string = `{"name": "John Doe", "salary": 60000}`;
// parse JSON to build employee object
const employee: any = JSON.parse(employeeData);
console.log(employee.name);
console.log(employee.salary);
TypeScript assumes a variable is of type any when you don’t explicitly
provide the type,
and the compiler cannot infer the type from the surrounding context.

58. What is void, and when to use the void type?

The void indicates the absence of type on a variable. It acts as the opposite
type to
any. It is especially useful in functions that don’t return a value.
function notify(): void {
alert("The user has been notified.");
}
If a variable is of type void, you can only assign the null or undefined values
to that
variable.

59. What is an unknown type, and when to use it in TypeScript?

The unknown type is the type-safe counterpart of any type. You can assign
anything to
the unknown, but the unknown isn’t assignable to anything but itself and
any, without
performing a type assertion of a control-flow-based narrowing. You cannot
perform
any operations on a variable of an unknown type without first asserting or
narrowing it
to a more specific type.
Consider the following example. We create the foo variable of unknown type
and
assign a string value to it. If we try to assign that unknown variable to a
string variable
bar, the compiler gives an error.
let foo: unknown = "Akshay";
let bar: string = foo; // Type 'unknown' is not assignable to type
'string'.(2322)
You can narrow down a variable of an unknown type to something specific by
doing
typeof checks or comparison checks or using type guards. For example, we
can get rid
of the above error by
let foo: unknown = "Akshay";
let bar: string = foo as string;

60. What are the different keywords to declare variables in

TypeScript?

var: Declares a function-scoped or global variable. You can optionally set its
value
during the declaration. Its behavior and scoping rules are similar to the var
keyword in
JavaScript. For example,
var foo = "bar";
let: Declares a block-scoped local variable. Similar to var, you can optionally
set the
value of a variable during the declaration. For example,
let a = 5;
if (true) {
let a = 10;
console.log(a); // 10
}
console.log(a); // 5
const: Declares a block-scoped constant value that cannot be changed after
it’s
initialized. For example,
const a = 5;
if (true) {
a = 10; // Error: Cannot assign to 'a' because it is a constant.(2588)
}

61. Provide the syntax of a function with the type annotations.

Functions are blocks of code to perform a specific code. Functions can

optionally take
one or more arguments, process them, and optionally return a value.
Here’s the TypeScript syntax to create and call a function.
function greet(name: string): string {
return `Hello, ${name}`;
}
let greeting = greet("Anders");
console.log(greeting); // "Hello, Anders"

62. How to create objects in TypeScript?

Objects are dictionary-like collections of keys and values. The keys have to
be unique.
They are similar to arrays and are also sometimes called associative arrays.
However,
an array uses numbers to index the values, whereas an object allows you to
use any
other type as the key.
In TypeScript, an Object type refers to any value with properties. It can be
defined by
simply listing the properties and their types. For example,
let pt: { x: number; y: number } = {
x: 10,
y: 20
};

63. How to specify optional properties in TypeScript?

An object type can have zero or more optional properties by adding a ‘?’
after the
property name.
let pt: { x: number; y: number; z?: number } = {
x: 10,
y: 20
};
console.log(pt);
In the example above, because the property ‘z’ is marked as optional, the
compiler
won’t complain if we don’t provide it during the initialization.

64. Explain the concept of null and its use in TypeScript.

In programming, a null value indicates an absence of value. A null variable

doesn’t
point to any object. Hence you cannot access any properties on the variable
or call a
method on it.
In TypeScript, the null value is indicated by the ‘null’ keyword. You can check
if a value
is null as follows:
function greet(name: string | null) {
if (name === null) {
console.log("Name is not provided");
} else {
console.log("Good morning, " + name.toUpperCase());
} }
var foo = null;
greet(foo); // "Name is not provided"
foo = "Anders";
greet(foo); // "Good morning, ANDERS"

65. What is undefined in TypeScript?

When a variable is declared without initialization, it’s assigned the undefined

value. It’s
not very useful on its own. A variable is undefined if it’s declared, but no
value has
been assigned to it. In contrast, null is assigned to a variable, and it
represents no
value.
console.log(null == null); // true
console.log(undefined == undefined); // true
console.log(null == undefined); // true, with type-conversion
console.log(null === undefined); // false, without type-conversion
console.log(0 == undefined); // false
console.log('' == undefined); // false
console.log(false == undefined); // false

66. Explain the purpose of the never type in TypeScript.

As the name suggests, the never type represents the type of values that
never occur.
For example, a function that never returns a value or that always throws an
exception
can mark its return type as never.
function error(message: string): never {
throw new Error(message);
}
You might wonder why we need a ‘never’ type when we already have ‘void’.
Though
both types look similar, they represent two very different concepts.
A function that doesn't return a value implicitly returns the value undefined
in
JavaScript. Hence, even though we are saying it’s not returning anything, it’s
returning
‘undefined’. We usually ignore the return value in these cases. Such a
function is
inferred to have a void return type in TypeScript.
// This function returns undefined
function greet(name: string) {
console.log(`Hello, ${name}`);
}
let greeting = greet("David");
console.log(greeting); // undefined
In contrast, a function that has a never return type never returns. It doesn't
return
undefined, either. There are 2 cases where functions should return never
type:
1. In an unending loop e.g a while(true){} type loop.
2. A function that throws an error e.g function foo(){throw new
Exception('Error
message')}

67. What is the typeof operator? How is it used in TypeScript?

Similar to JavaScript, the typeof operator in TypeScript returns the type of

the operand
as a string.
console.log(typeof 10); // "number"
console.log(typeof 'foo'); // "string"
console.log(typeof false); // "boolean"
console.log(typeof bar); // "undefined"
In TypeScript, you can use the typeof operator in a type context to refer to
the type of
a property or a variable.
let greeting = "hello";
let typeOfGreeting: typeof greeting; // similar to let typeOfGreeting:
string
68. What are the rest parameters and arguments in TypeScript?

A rest parameter allows a function to accept an indefinite number of

arguments as an
array. It is denoted by the ‘…’ syntax and indicates that the function can
accept one or
more arguments.
function add(...values: number[]) {
let sum = 0;
values.forEach(val => sum += val);
return sum;
}
const sum = add(5, 10, 15, 20);
console.log(sum); // 50
In contrast, the rest arguments allow a function caller to provide a variable
number of
arguments from an array. Consider the following example.
const first = [1, 2, 3];
const second = [4, 5, 6];
first.push(...second);
console.log(first); // [1, 2, 3, 4, 5, 6]

69. What is parameter destructuring?

Parameter destructing allows a function to unpack the object provided as an

argument
into one or more local variables.
function multiply({ a, b, c }: { a: number; b: number; c: number }) {
console.log(a * b * c);
}
multiply({ a: 1, b: 2, c: 3 });
You can simplify the above code by using an interface or a named type,
as
follows:
type ABC = { a: number; b: number; c: number };
function multiply({ a, b, c }: ABC) {
console.log(a * b * c);
}
multiply({ a: 1, b: 2, c: 3 });
70. Explain the TypeScript class syntax.

TypeScript fully supports classes. The TypeScript syntax for class declaration
is similar
to that of JavaScript, with the added type support for the member
declarations.
Here is a simple class that defines an Employee type.
class Employee {
name: string;
salary: number;
constructor(name: string, salary: number) {
this.name = name;
this.salary = salary;
}
promote() : void {
this.salary += 10000;
}
}
You can create an instance (or object) of a class by using the new keyword.
// Create a new employee
let john = new Employee("John", 60000);
console.log(john.salary); // 60000
john.promote();
console.log(john.salary); // 70000

71. Explain the arrow function syntax in TypeScript.

Arrow functions provide a short and convenient syntax to declare functions.

They are
also called lambdas in other programming languages.
Consider a regular function that adds two numbers and returns a number.
function add(x: number, y: number): number {
let sum = x + y;
return sum;
}
Using arrow functions syntax, the same function can be defined as:
let add = (x: number, y: number): number => {
let sum = x + y;
return sum;
}
You can further simplify the syntax by getting rid of the brackets and the
return
statement. This is allowed when the function body consists of only one
statement. For
example, if we remove the temporary sum variable, we can rewrite the
above function
as:
let add = (x: number, y: number): number => x + y;
Arrow functions are often used to create anonymous callback functions in
TypeScript.
Consider the example below that loops over and filters an array of numbers
and
returns an array containing multiples of five. The filter function takes an
arrow
function.
let numbers = [3, 5, 9, 15, 34, 35];
let fiveMultiples = numbers.filter(num => (num % 5) == 0);
console.log(fiveMultiples); // [5, 15, 35]

72. What is the purpose of the tsconfig.json file?

A tsconfig.json file in a directory marks that directory as the root of a

TypeScript
project. It provides the compiler options to compile the project.
Here is a sample tsconfig.json file:
{
"compilerOptions": {
"module": "system",
"noImplicitAny": true,
"removeComments": true,
"outFile": "../../built/local/tsc.js",
"sourceMap": true
},
"include": ["src/**/*"],
"exclude": ["node_modules", "**/*.spec.ts"]
}

73.Explain the different variants of the for loop in TypeScript.

TypeScript provides the following three ways to loop over collections.

-‘for’ loop
let values = [10, "foo", true];
for(let i=0; i<values.length; i++) {
console.log(values[i]); // 10, "foo", true
} -
‘forEach’ function
let values = [10, "foo", true];
values.forEach(val => {
console.log(val); // 10, "foo", true
})
-‘for..of’ statement
let values = [10, "foo", true];
for (let val of values) {
console.log(val); // 10, "foo", true
}

74. Explain the symbol type in TypeScript.

Symbols were introduced in ES6 and are supported by TypeScript. Similar to

numbers
and strings, symbols are primitive types. You can use Symbols to create
unique
properties for objects.
You can create symbol values by calling the Symbol() constructor, optionally
providing
a string key.
let foo = Symbol();
let bar = Symbol("bar"); // optional string key
A key characteristic of symbols is that they are unique and immutable.
let foo = Symbol("foo");
let newFoo = Symbol("foo");
let areEqual = foo === newFoo;
console.log(areEqual); // false, symbols are unique

75. Explain how optional chaining works in TypeScript.

Optional chaining allows you to access properties and call methods on them
in a
chain-like fashion. You can do this using the ‘?.’ operator.
TypeScript immediately stops running some expression if it runs into a ‘null’
or
‘undefined’ value and returns ‘undefined’ for the entire expression chain.
Using optional chaining, the following expression
let x = foo === null || foo === undefined ? undefined : foo.bar.baz();
can be expressed as:
let x = foo?.bar.baz();
76. What is meant by type inference?

TTypeScript can infer the type of a variable when you don’t provide an
explicit type.
This is known as type inference. This is usually done when the variables or
parameters
are initialized during the declaration.
For example, TypeScript knows that the variable foo is a string, even though
we don’t
mention string as a type.
let foo = "this is a string";
console.log(typeof foo); // "string"

77. What is meant by contextual typing?

When the TypeScript compiler uses the location (or context) of a variable to
infer its
type, it’s called contextual typing.
In the following example, TypeScript uses the Window.onmousedown
function type
information to infer the type of the function expression on the right-hand
side of the
assignment. This allows it to infer the type of the e parameter, which does
have a
button property but not a property named foo.
window.onmousedown = function (e) {
console.log(e.button); //<- OK
console.log(e.foo); //<- Error!
};

78. What is the purpose of nolmplicitAny?

Usually, when we don’t provide any type on a variable, TypeScript assumes

‘any’ type.
For example, TypeScript compiles the following code, assuming the
parameter ‘s’ is of
any type. It works as long as the caller passes a string.
function parse(s) {
console.log(s.split(' '));
}
parse("Hello world"); // ["Hello", "world"]
However, the code breaks down as soon as we pass a number or other type
than a
string that doesn’t have a split() method on it. For example,
function parse(s) {
console.log(s.split(' ')); // [ERR]: s.split is not a function
}
parse(10);
noImplicitAny is a compiler option that you set in the tsconfig.json file. It forces
the
TypeScript compiler to raise an error whenever it infers a variable is of any
type. This
prevents us from accidentally causing similar errors.
Parameter 's' implicitly has an 'any' type.(7006)
function parse(s) {
console.log(s.split(' ')); // [ERR]: s.split is not a function
}

79. What is an interface?

An interface defines a contract by specifying the type of data an object can

have and
its operations. In TypeScript, you can specify an object’s shape by creating
an interface
and using it as its type. It’s also called “duck typing”.
In TypeScript, you can create and use an interface as follows:
interface Employee {
name: string;
salary: number;
}
function process(employee: Employee) {
console.log(`${employee.name}'s salary = ${employee.salary}`);
}
let john: Employee = {
name: "John Doe",
salary: 150000
}
process(john); // "John Doe's salary = 150000"
Interfaces are an effective way to specify contracts within your code as well
as outside your code.
80. Explain the various ways to control member visibility in
TypeScript.

TypeScript provides three keywords to control the visibility of class

members, such as
properties or methods.
-Public: You can access a public member anywhere outside the class. All
class members
are public by default.
-Protected: A protected member is visible only to the subclasses of the
class containing
that member. Outside code that doesn’t extend the container class can’t
access a
protected member.
-Private: A private member is only visible inside the class. No outside code
can access
the private members of a class.

81. Does TypeScript support static classes? If not, why?

TypeScript doesn’t support static classes, unlike the popular object-oriented

programming languages like C# and Java.
These languages need static classes because all code, i.e., data and
functions, need to
be inside a class and cannot exist independently. Static classes provide a
way to allow
these functions without associating them with any objects.
In TypeScript, you can create any data and functions as simple objects
without creating
a containing class. Hence TypeScript doesn’t need static classes. A singleton
class is
just a simple object in TypeScript.

82. What are abstract classes? When should you use one?

TAbstract classes are similar to interfaces in that they specify a contract for
the objects,
and you cannot instantiate them directly. However, unlike interfaces, an
abstract class
may provide implementation details for one or more of its members.
An abstract class marks one or more of its members as abstract. Any classes
that
extend an abstract class have to provide an implementation for the abstract
members
of the superclass.
Here is an example of an abstract class Writer with two member functions.
The write()
method is marked as abstract, whereas the greet() method has an
implementation.
Both the FictionWriter and RomanceWriter classes that extend from Writer
have to
provide their specific implementation for the write method.
abstract class Writer {
abstract write(): void;
greet(): void {
console.log("Hello, there. I am a writer.");
} }
class FictionWriter extends Writer {
write(): void {
console.log("Writing a fiction.");
} }
class RomanceWriter extends Writer {
write(): void {
console.log("Writing a romance novel.");
} }
const john = new FictionWriter();
john.greet(); // "Hello, there. I am a writer."
john.write(); // "Writing a fiction."
const mary = new RomanceWriter();
mary.greet(); // "Hello, there. I am a writer."
mary.write(); // "Writing a romance novel."

83. What are anonymous functions? Provide their syntax in

TypeScript.

An anonymous function is a function without a name. Anonymous functions

are
typically used as callback functions, i.e., they are passed around to other
functions,
only to be invoked by the other function at a later point in time. For example,
setTimeout(function () {
console.log('Run after 2 seconds')
}, 2000);
You can invoke an anonymous function as soon as it’s created. It’s
called
‘immediately invoked function execution (IIFE)’, For example:
(function() {
console.log('Invoked immediately after creation');
})();

84. What are union types in TypeScript?

A union type is a special construct in TypeScript that indicates that a value

can be one
of several types. A vertical bar (|) separates these types.
Consider the following example where the variable value belongs to a union
type
consisting of strings and numbers. The value is initialized to string “Foo”.
Because it
can only be a string or a number, we can change it to a number later, and
the
TypeScript compiler doesn’t complain.
let value: string | number = "Foo";
value = 10; // Okay
However, if we try to set the value to a type not included in the union types,
we get
the following error.
value = true; // Type 'boolean' is not assignable to type 'string |
number'.(2322)
Union types allow you to create new types out of existing types. This
removes a lot of
boilerplate code as you don’t have to create new classes and type
hierarchies.

85. What are intersection types?

Intersection types let you combine the members of two or more types by
using the ‘&’
operator. This allows you to combine existing types to get a single type with
all the
features you need.
The following example creates a new type Supervisor that has the members
of types
Employee and Manager.
interface Employee {
work: () => string;
}
interface Manager {
manage: () => string;
}
type Supervisor = Employee & Manager;
// john can both work and manage
let john: Supervisor;

86. What are type aliases? How do you create one?

Type aliases give a new, meaningful name for a type. They don’t create new
types but
create new names that refer to that type.
For example, you can alias a union type to avoid typing all the types
everywhere that
value is being used.
type alphanumeric = string | number;
let value: alphanumeric = "";
value = 10;

87. Explain the tuple types in TypeScript.

Tuples are a special type in TypeScript. They are similar to arrays with a
fixed number
of elements with a known type. However, the types need not be the same.
// Declare a tuple type and initialize it
let values: [string, number] = ["Foo", 15];
// Type 'boolean' is not assignable to type 'string'.(2322)
// Type 'string' is not assignable to type 'number'.(2322)
let wrongValues: [string, number] = [true, "hello"]; // Error
Since TypeScript 3.0, a tuple can specify one or more optional types using
the ? as
shown below.
let values: [string, number, boolean?] = ["Foo", 15];
88. Explain how tuple destructuring works in TypeScript.

You can destructure tuple elements by using the assignment operator (=).
The
destructuring variables get the types of the corresponding tuple elements.
let employeeRecord: [string, number] = ["John Doe", 50000];
let [emp_name, emp_salary] = employeeRecord;
console.log(`Name: ${emp_name}`); // "Name: John Doe"
console.log(`Salary: ${emp_salary}`); // "Salary: 50000"
After destructuring, you can’t assign a value of a different type to the
destructured
variable. For example,
emp_name = true; // Type 'boolean' is not assignable to type
'string'.(2322)

89. What are type assertions in TypeScript?

Sometimes, you as a programmer might know more about the type of a

variable than
TypeScript can infer. Usually, this happens when you know the type of an
object is
more specific than its current type. In such cases, you can tell the TypeScript
compiler
not to infer the type of the variable by using type assertions.
TypeScript provides two forms to assert the types.
-as syntax:
let value: unknown = "Foo";
let len: number = (value as string).length;
-<>syntax:
let value: unknown = "Foo";
let len: number = (<string>value).length;
Type assertions are similar to typecasting in other programming languages
such as C#
or Java. However, unlike those languages, there’s no runtime penalty of
boxing and
unboxing variables to fit the types. Type assertions simply let the TypeScript
compiler know the type of the variable.
90. How to enforce strict null checks in TypeScript?

Null pointers are one of the most common sources of unexpected runtime
errors in
programming. TypeScript helps you avoid them to a large degree by
enforcing strict
null checks.
You can enforce strict null checks in two ways:
-providing the –strictNullChecks flag to the TypeScript(tsc) compiler
-setting the strictNullChecks property to true in the tsconfig.json
configuration file.
When the flag is false, TypeScript ignores null and undefined values in the
code. When it
is true, null and undefined have their distinct types. The compiler throws a
type error if you try to use them where a concrete value is expected.

91. How to make object properties immutable in TypeScript? (hint:

readonly)

You can mark object properties as immutable by using the readonly keyword
before the
property name. For example:
interface Coordinate {
readonly x: number;
readonly y: number;
}
When you mark a property as readonly, it can only be set when you initialize
the object.
Once the object is created, you cannot change it.
let c: Coordinate = { x: 5, y: 15 };
c.x = 20; // Cannot assign to 'x' because it is a read-only
property.(2540)

92. What is a type declaration file?

A typical TypeScript project references other third-party TypeScript libraries

such as
JQuery to perform routine tasks. Having type information for the library code
helps
you in coding by providing detailed information about the types, method
signatures,
etc., and provides IntelliSense.
A type declaration file is a text file ending with a .d.ts extension providing a
way to
declare the existence of some types or values without actually providing
implementations for those values. It contains the type declarations but
doesn’t have
any source code. It doesn’t produce a .js file after compilation.

93. What are triple-slash directives?

Triple-slash directives are single-line comments that contain a single XML

tag.
TypeScript uses this XML tag as a compiler directive.
You can only place a triple-slash directive at the top of the containing file.
Only single
or multi-line comments can come before a triple-slash directive. TypeScript
treats
them as regular comments if it occurs in the middle of a code block, after a
statement.
The primary use of triple-slash directives is to include other files in the
compilation
process. For example, the following directive instructs the compiler to
include a file
specified by the path in the containing TypeScript file.
/// <reference path="..." />
Triple-slash directives also order the output when using --out or --outFile. The
output
files are produced to the output file location in the same order as the input
files.

94. Explain the purpose of the ‘in’ operator.

The in operator is used to find if a property is in the specified object. It

returns true if the
property belongs to the object. Otherwise, it returns false.
const car = { make: 'Hyundai', model: 'Elantra', year: 2017 };
console.log('model' in car); // true
console.log('test' in car); // false
95. What are the ‘implements’ clauses in TypeScript?

An implements clause is used to check that a class satisfies the contract

specified by an
interface. If a class implements an interface and doesn’t implement that
interface, the
TypeScript compiler issues an error.
interface Runnable {
run(): void;
}
class Job implements Runnable {
run() {
console.log("running the scheduled job!");
} }
// Class 'Task' incorrectly implements interface 'Runnable'.
// Property 'run' is missing in type 'Task' but required in type
'Runnable'.(2420)
class Task implements Runnable {
perform() {
console.log("pong!");
} }
A class can implement more than one interface. In this case, the class has to
specify all
the contracts of those interfaces.

96. What are string literal types?

In TypeScript, you can refer to specific strings and numbers as types.

let foo: "bar" = "bar";
// OK
foo = "bar";
// Error: Type '"baz"' is not assignable to type '"bar"'.(2322)
foo = "baz";
String literal types on their own are not that useful. However, you can
combine them
into unions. This allows you to specify all the string values that a variable can
take, in
turn acting like enums. This can be useful for function parameters.
function greet(name: string, greeting: "hi" | "hello" | "hola") {
// ...
}
greet("John", "hello");
// Error: Argument of type '"Howdy?"' is not assignable to parameter
of
type '"hi" | "hello" | "hola"'.(2345)
greet("Mary", "Howdy?");
String literal types can help us spell-check the string values.

97. What are template literal types?

Template literal types are similar to the string literal types. You can combine
them with
concrete, literal types to produce a new string literal type. Template literal
types allow
us to use the string literal types as building blocks to create new string literal
types.
type Point = "GraphPoint";
// type Shape = "Grid GraphPoint"
type Shape = `Grid ${Point}`;
Template literal types can also expand into multiple strings via unions. It
helps us create
the set of every possible string literal that each union member can
represent.
type Color = "green" | "yellow";
type Quantity = "five" | "six";
// type ItemTwo = "five item" | "six item" | "green item" | "yellow
item"
type ItemOne = `${Quantity | Color} item`;

98. Explain the concept of inheritance in TypeScript.

Inheritance allows a class to extend another class and reuse and modify the
behavior
defined in the other class. The class which inherits another class is called the
derived
class, and the class getting inherited is called the base class.
In TypeScript, a class can only extend one class. TypeScript uses the
keyword ‘extends’
to specify the relationship between the base class and the derived classes.
class Rectangle {
length: number;
breadth: number
constructor(length: number, breadth: number) {
this.length = length;
this.breadth = breadth
}
area(): number {
return this.length * this.breadth;
} }
class Square extends Rectangle {
constructor(side: number) {
super(side, side);
}
volume() {
return "Square doesn't have a volume!"
} }
const sq = new Square(10);
console.log(sq.area()); // 100
console.log(sq.volume()); // "Square doesn't have a volume!"
In the above example, because the class Square extends functionality from
Rectangle,
we can create an instance of square and call both the area() and volume()
methods.

99. What are conditional types? How do you create them?

A conditional type allows you to dynamically select one of two possible types
based on
a condition. The condition is expressed as a type relationship test.
C extends B ? TypeX : TypeY
Here, if type C extends B, the value of the above type is TypeX. Otherwise, it
is TypeY.

100. What is the Function type in TypeScript?

Function is a global type in TypeScript. It has properties like bind, call, and
apply, along
with the other properties present on all function values.
function perform(fn: Function) {
fn(10);
}
You can always call a value of the Function type, and it returns a value of
‘any’ type.
101. List some of the utility types provided by TypeScript and explain
their usage.

TypeScript provides various utility types that make common type

transformations easy.
These utility types are available globally. Here are some of the essential
utility types
included in TypeScript.
-Partial<Type>: Constructs a type with all properties of Type set to optional.
-Required<Type>: Constructs a type consisting of all properties of Type set
to required.
-Readonly<Type>: Constructs a type with all properties of Type set to
readonly.
-Record<Keys, Type>: Constructs an object type with property keys are of
type keys,
and values are Type.