TypeScript Interview Questions: Part 1

TypeScript Interview Questions: Part 1
TypeScript Interview Questions: Part 1

Introduction

TypeScript is a programming language developed and maintained by Microsoft. The inadequacies of JavaScript in the development of large-scale applications led to the creation of TypeScript. It’s a strict superset of JavaScript with the addition of optional static typing.

The link between TypeScript and JavaScript is peculiar. All of JavaScript’s functionalities are available in TypeScript and an additional layer: TypeScript’s type system. A typescript program is compiled into plain JavaScript code. A JavaScript program is also a valid TypeScript program and vice-versa.

One interesting fact about Typescript is, the typeScript compiler is itself written in the TypeScript programming language.

This blog has various typescript interview questions and answers for experienced candidates as well as for freshers. This blog is the first blog in the 50 most asked TypeScript interviews questions. After completing this, do visit Part-2 of this series.

TypeScript Interview Questions

  1. What is TypeScript?

Answer: TypeScript is a programming language that is a superset of JavaScript. The TypeScript programs are compiled into plain JavaScript code. It is a pure object-oriented and statically typed programming language.

TypeScript is essentially the ES6 version of JavaScript with a few more capabilities. TypeScript code is written in a .ts file, which is then compiled into JavaScript by the compiler. The file can be written in any code editor, but the compiler must be installed. 

The command tsc <filename>.ts compiles TypeScript code into a plain JavaScript file.

  1. What do you mean by static type checking? Is TypeScript a static type checking language?

Answer: Static checking is the process of detecting errors in code without running it. Static type checking determines an error based on the types of values being used. 

TypeScript is a static type checking language that checks a program for errors before executing it, and it does so based on the types of values.

For example, there is an error in the below program because of the type of obj. 

const obj = { width: 10, height: 15 };
// Why is this NaN? Spelling is hard!
const area = obj.width * obj.heigth;

Here’s the error TypeScript mentioned:

Property 'heigth' does not exist on type '{ width: number; height: number; }'. Did you mean 'height'?
  1. What are the fundamental differences between TypeScript and JavaScript?

Answer: The basic differences between TypeScript and JavaScript are given below:

TypeScriptJavaScript
TypeScript is a programming language developed and maintained by Microsoft.Javascript is an open standard that is maintained by ECMA International and the W3C.
TypeScript is the superset of JavaScript.JavaScript is a subset of TypeScript.
TypeScript is an object-oriented language.JavaScript is a scripting language.
TypeScript has static type checking.JavaScript does not have static type checking.
The optional parameter function is supported.The optional parameter function is not supported.
TypeScript is a compiled language, that’s why errors are highlighted during the development time. JavaScript is an interpreted language, that’s why errors are highlighted during runtime.
TypeScript supports generic classes.JavaScript is a dynamically typed language and it doesn’t support generics.
  1. When JavaScript was available, why did TypeScript come into existence?

Answer: Various reasons led to the creation of TypeScript. Some of them include:

  1. JavaScript is dynamically typed, which means it doesn’t know what type a variable is until it’s used at runtime. JavaScript now has type support thanks to TypeScript.
  1. The use of type inference in TypeScript makes typing a little easier and a lot less explicit. Even if the types aren’t explicitly typed, they’re still there to prevent you from doing something that would otherwise result in a runtime error.
  1. The TypeScript development experience is far superior to that of JavaScript. TypeScript is well supported by various IDEs, including Visual Studio & VS Code, Atom, Sublime etc.
  1. Because TypeScript is closely connected to JavaScript, it has excellent interoperability. However, working with JavaScript libraries in TypeScript requires some additional effort.
  1. What are some of TypeScript’s most notable features?

Answer: Some of the striking features of TypeScript are mentioned below:

  • TypeScript is cross-platform, meaning it can be installed on any operating system, including Windows, macOS, and Linux.
  • TypeScript is an object-oriented language with features such as classes, interfaces, and modules. As a result, it can write object-oriented code for both client and server-side development.
  • TypeScript makes use of static typing, which aids type checking at compile time. As a result, you can detect problems while creating the code rather than waiting for the script to run.
  • TypeScript also allows optional static typing.
  • TypeScript can be used to manipulate the Document Object Model (DOM) to add and remove elements.
  • TypeScript incorporates most of the proposed ECMAScript 2015 (ES 6, 7) features, such as class, interface, arrow functions, and so on.

Note: ECMAScript is the specification for a general-purpose scripting language. This is a standard published by Ecma International. 

illustrative_diagram
Source:edureka
  1. What are the advantages of using TypeScript?

Answer: The following are some of the advantages of utilising TypeScript:

  • TypeScript is a fast, efficient, and easy-to-learn scripting language that works with any browser or JavaScript engine.
  • It has syntax and semantics that are comparable to JavaScript. This makes it easier for backend developers to write frontend code.
  • We can use an existing JavaScript code to call TypeScript code. It also seamlessly integrates with existing JavaScript frameworks and libraries.
  • The .d.ts extension in the definition file indicates that it supports current JavaScript libraries such as Jquery, D3.js, etc.
  • It includes ES6 and ES7 capabilities that can be used with ES5 JavaScript engines like Node.js.

Note: ES7, ES6 and ES5 etc. are the various versions of ECMAScript, which defines the standard for scripting languages.

  1. What are the disadvantages of TypeScript?

Answer: For decades, web developers have relied on JavaScript, and TypeScript adds nothing new to the scene. Some of the disadvantages of TypeScript are:

  • The compilation of TypeScript code takes a long time.
  • Abstract classes are not supported in TypeScript.
  • If we launch the TypeScript program in the browser, we’ll need to compile it first to convert it to JavaScript.
  • The definition file is required to use any third-party library.
  1. What are the essential components of TypeScript?

Answer: TypeScript has three essential components, language, compiler and services provided by the language.

  • Language: Syntax, keywords, and type annotations. 
  • The TypeScript Compiler: Tool to compile TypeScript code.
  • The Language Service:  Compatibility with a wide range of editors.
  1. Who created Typescript, and what is the most recent stable version?

Answer: TypeScript was created by Anders Hejlsberg. He was an essential part of the C# language development team as well. Typescript was first released on October 1st, 2012. However, Microsoft created and maintained it under the Apache 2 licence. It was designed to develop a significant application.

The current stable version of TypeScript is 4.2, which was released on February 25th, 2021.

  1. What are the different ways to install TypeScript?

Answer: The TypeScript language is supported in various editors such as Visual Studio Code. However, the TypeScript compiler, tsc, is not included. To convert TypeScript source code to JavaScript, we’ll need to install the TypeScript compiler globally or in our workspace. 

Another method to install TypeScript is by using Node.js Package Manager, npm.

The Node.js Package Manager is the easiest way to install TypeScript. TypeScript can be installed if you have npm installed. We can install TypeScript globally (-g) on our computer by using the following syntax:

npm install -g Typescript

  1. How can we compile TypeScript files?

Answer: TypeScript is a superset of JavaScript. That’s why any JavaScript file is also a TypeScript file. The extension of a TypeScript file is “.ts”, and it is “.js” for JavaScript. TypeScript file will be ready after changing the extension from “.js” to “.ts.”.

The following command is used to compile a TypeScript file:

tsc <File Name>

For example: If we have a file named “codingNinjas.ts”, to compile it, The Undefined type represents all uninitialised variables, we’ll write:

tsc codingNinjas.ts

And the output file would be codingNinjas.js

  1. Is it possible to integrate several TypeScript files into a single JavaScript file?

Answer: Yes, we can combine several TypeScript files into a single JavaScript file. During compilation, we just need to add an extra parameter i.e outFile <OutputJSFileName>. Here, OutputJSFileName is the name of the output file. If we don’t provide it, the first file will act as an output file.

For example: To compile 3 TypeScript files cn1.ts, cn2.ts, cn3.ts into a single “combine.js” file, the syntax is: 

tsc –outFile combine.js cn1.ts cn2.ts cn3.ts

  1. What are the various data types of TypeScript?

Answer: The unique part of TypeScript is its type system. The Type System is a representation of the various sorts of values that the language supports. Before the program stores or manipulates the supplied values, it verifies their validity.

There are two main types of TypeScript: Built-in and User-defined.

  1. Built-in: It includes the predefined types such as number, boolean, string, void, null and undefined.
  2. User-defined: Users can create their data type as well. These are user-defined data types such as enumerations, classes, interfaces, arrays, and tuples.

  1. What are the different built-in data types in TypeScript?

Answer: Built-in data types are the ones that are predefined by the language. Built-in data types are also known as primitive data types. Following are the built-in data types of TypeScript.

Data typeDescription
numberBoth Integer and Floating-Point numbers are represented by it.
booleanThis type is used to represent only true or false types of values.
stringIt is a collection of characters encoded in Unicode UTF-16 code.
voidIt is used as a return type of function that doesn’t return any value.
nullIt denotes a variable with no defined value. It is not feasible to refer to a null type value directly.
undefinedThe Undefined type represents all uninitialised variables.
anyAny value can be assigned to a variable specified with any data type.
  1. What are variables in TypeScript, and how to declare them in the program?

Answer: A variable is a named memory location where values are stored. A colon (:), followed by the variable’s type, is the type syntax for declaring a variable in TypeScript. To declare a variable, we use the var keyword, which is similar to JavaScript. 

For example,  var name:string = ”CodingNinjas”

illustrative_diagram
Source:johnpapa

Following rules must be followed while declaring a variable in Typescript:

  • The variable name must be composed of alphabets or digits.
  • A variable name cannot begin with a digit.
  • A variable name cannot contain spaces or special characters except for the underscore(_) and the dollar($) sign.
  1. What are the different ways of declaring a variable in TypeScript?

Answer: There are four ways to declare a variable in TypeScript, they are as follows:

  • Declaring type and value together.
var [identifier] : [type-annotation] = value; 
  • Declaring type only.
var [identifier] : [type-annotation]; 
  • Declaring value only.
var [identifier] = value; 
  • Declaring without value and type.
var [identifier]; 
  1. Is it possible to compile .ts files automatically in response to real-time changes?

Answer: Yes, we can build “.ts” automatically based on real-time changes in the file. The watch compiler option can be used to accomplish this.

The program below builds file1.ts in file1.js and then watches for changes in the file. It will build the file again if any changes are found. 

watch file1.ts tsc

When using the watch option, we need to make sure that the command prompt does not close.

  1. What are the various object-oriented keywords supported in TypeScript?

Answer: TypeScript is an object-oriented language. It supports the following object-oriented features:

  • Modules
  • Classes
  • Interfaces
  • Inheritance
  • Data Types
  • Member functions
  1. What are classes in TypeScript? List out some of the features.

Answer: The class keyword, which was introduced in ES2015, is fully supported in TypeScript. TypeScript adds type annotations and additional syntax, similar to other JavaScript language features, to define connections between classes and other types. A class in TypeScript can have constructors, properties and methods.

  1. What access modifiers does TypeScript support?

Answer: As shown below, TypeScript supports public, private, and protected access modifiers, which determine the accessibility of members of the class. Because of its convenient nature, if an access modifier is not given, it is assumed to be public.

  • Public: Accessible to all the class members, child classes, and the instance of the class.
  • Protected: Accessible to all the members of the class and child classes. But inaccessible to the instance of the class.
  • Private: Only accessible to the members of the class.
  1. What are modules in TypeScript?

Answer: A module is a powerful way to group variables, functions, classes, and interfaces, among other things. It can only be used in its scope, not in the global scope. You cannot directly access the variables, functions, classes, and interfaces declared in a module outside it.

The export keyword can be used to create a module, and the import keyword can be used to import it into other modules.

  1. What is the difference between the internal module and the external module?

Answer: The primary difference between the internal and external modules in TypeScript are given in the table below:

Internal ModuleExternal Module
Internal modules were introduced in the earlier version of Typescript.External modules were introduced in the latest version.
These are local or exported members of other modules.These are separately loaded groups of code referenced using external module names.
Internal modules are declared using ModuleDeclarations that specify their name and body.An external module is written as a separate source file that contains at least one import or export declaration.
Internal modules group classes, interfaces, functions, variables into a single unit and exported in another module.An external module is written as a separate source file that contains at least one import or export declaration.
  1. What makes TypeScript a statically typed language with the option of being statically typed?

Answer: Optionally statically typed variables are available in TypeScript, which means you can tell the compiler to ignore the type of a variable. We can assign any value to the variable using any data type. During compilation, TypeScript will not check for errors.

For example:

var unknownType: any = 4;
unknownType = "Welcome to Coding Ninjas"; //string
unknownType = false; // A boolean.
  1. What is a namespace in Typescript, and how can it be declared?

Answer: Namespaces are logically organized groups of functions. These preserve the legacy code of TypeScript internally. It encapsulates the features and objects that are linked in some way. Internal modules are another term for a namespace. To support a group of related functionalities, a namespace can also comprise interfaces, classes, functions, and variables.

Syntax: A simple declaration of a namespace is given below:

namespace <namespace_name> 
{
export interface I1 { }
export class c1{ }
}
  1. Is function overloading supported in TypeScript?

Answer: Yes, TypeScript allows function overloading. However, the implementation is strange. As a result, when using TypeScript to overload, you only have one implementation with various signatures.

For example:

class Customer 
{
name: string;
Id: number;
add(Id: number);
add(name:string);
add(value: any) {
if (value && typeof value == "number") 
{
//Do something
}
if (value && typeof value == "string") 
{
//Do Something
}
}

The first signature has one numeric parameter, whereas the second signature has a string parameter. The actual implementation is included in the third function, which has a parameter of type any. The implementation then examines the type of the supplied parameter and runs a separate piece of code depending on the type of the supplied argument.

With this, we’ve reached the end of typescript interview questions: Part 1. Let’s see some of the frequently asked questions regarding this article.

Frequently Asked Questions

How do I prepare for a TypeScript interview?

Interview Preparation requires clear concepts and a basic understanding of the topic. TypeScript is more like an up-gradation of JavaScript, so most of the questions will be based on the differences in characteristics between the two.

What are the features of TypeScript?

TypeScript is cross-browser, cross-device, and cross-platform. It can run in any environment that supports JavaScript. TypeScript, unlike its competitors, does not require a dedicated virtual machine or a specific runtime environment to run.

What is TypeScript used for?

TypeScript is a large-scale application development language that transcompiles to JavaScript.

Is TypeScript frontend or backend?

JavaScript is generated from TypeScript. As a result, TS may be used anywhere JS can be used, including the frontend and backend.

Key Takeaways

This is a complete package consisting of 50 most asked Typescript interview questions, divided into two blogs. After revising typescript interview questions | Part 1, it is recommended to visit the TypeScript interview questions | Part 2. 

If you are going to appear for an interview related to TypeScript, this series has it all. These two blogs give a glance at all the basic and essential concepts. Answers to the questions are precise and to the point. 

Javascript is one of the most powerful and widely used programming languages on the web. Check out  Top 100 Javascript Interview Questions to help you crack your interviews and get your dream job.

Happy Learning!

By: Vaishnavi Pandey