JAVASCRIPT ES6

INTERVIEW GUIDE
]\

What is ECMA Script

ECMA stands for "European Computer Manufacturers Association."
This organisation provides standard javascript for different Browsers.

● ES6 was released june 2015 ad brought many new features,

improvements and syntactical enhancements to javaScript:
● ES6 allows you to make the code more modern and raladable .
● By using ES6 features we write less ad do more “ write less, do
more ”

1. Introduced let and const variables in JavaScript.

The let and const variables were introduced in JavaScript with the
ECMAScript 2015 (ES6) specification and both have Block-Level Scope.

var:

● Function-scoped: Variables declared with var are scoped to the

function in which they are defined. If declared outside a function,
they are globally scoped.
● Block-level scope (e.g., inside { }): Variables declared with var
do not respect block scope. This means that a var variable

1
]\

declared inside a block (like an if statement or loop) can be

accessed outside of that block.

let:

● Block Scope: let is block-scoped, meaning it is only accessible

within the block (e.g., inside a { }) where it is defined. This is
different from var, which is function-scoped.
● Reassignment: Variables declared with let can be reassigned
new values multiple times

2
]\

const:

● Block Scope: Like let, const is also block-scoped.

● Immutable Binding: Variables declared with const cannot be
reassigned once they are initialised. However, if a const variable
refers to an object or array, the properties or elements of that
object or array can still be modified.

3
]\

Key Differences:

4
]\

2. Hoisting in JavaScript ?
Hoisting in JavaScript means that when you declare variables or
functions, JavaScript moves their declarations to the top of the scope
before the code actually runs. However, only the declarations are
hoisted, not the initializations.

How Hoisting Works:

● Variable Declarations: The declarations are hoisted to the top, but

their initializations are not. This means that if you try to use a
variable before its declaration, it will result in undefined if
declared with var, and it will cause a ReferenceError if declared
with let or const.
● Function Declarations: Entire function declarations (both the
name and the body) are hoisted. This allows functions to be called
before they are defined in the code.

5
]\

3. What is the output Both the code ?

Since var is not block-scoped, the i inside the setTimeout callback

refers to the same i that the for loop modifies.
After the loop finishes, i is 10, so every setTimeout callback logs 10.

Output will be 10 times 10 .

With let, each iteration of the loop has a separate i value, so the
setTimeout callback will log the correct i value for each iteration.

Output will be 0,1,2,3,4,5,6,7,8,9

6
]\

4. Default Parameters in JavaScript ?

Default parameters in JavaScript allow you to set default values for
function parameters if no value or undefined is provided when the
function is called. This feature was introduced in ECMAScript 2015 (ES6).

Passing functions as default parameters can be particularly useful for

setting up customizable behaviours in your code.

7
]\

5. Template Literals in JavaScript ?

Template literals in JavaScript, introduced with ECMAScript 2015 (ES6),

provide a way that you can concat variable with strings .

Template literals use backticks (`) instead of single quotes (') or double
quotes (").

5. Find and FindIndex in JavaScript ?

The find method returns the first element in the array that
satisfies and The findIndex method returns the index of the first
element in the array that satisfies , If no elements satisfy the
condition, it returns -1.

8
]\

9
]\

6. Arrow Function in JavaScript ?

Arrow functions in JavaScript, introduced with ECMAScript 2015 (ES6),

provide a shorter syntax for writing functions. They also differ from
traditional function expressions in terms of how they handle the this
keyword.

Summary:

● Arrow functions provide a concise syntax for writing

functions.
● They do not have their own this context and inherit this
from their lexical scope.
● They cannot be used as constructors and do not have an
arguments object.
● They are particularly useful for writing shorter functions and
handling this more intuitively in callbacks.

10
]\

1. Shorter Syntax:

● For a single expression, then no need to return a statement .

● If there is only one parameter,then no need to parentheses

2.this Binding:

● Arrow functions do not have their own this context.

● This is particularly useful in cases where traditional functions
create issues with this in callbacks.

11
]\

12
]\

7. Classes in JavaScript ?
JavaScript classes, introduced with ECMAScript 2015 (ES6), provide a
more structured and syntactically clearer way to create and manage
objects and inheritance compared to traditional constructor functions.

1. Class Declaration:
○ The class keyword is used to define a class.
○ A class body contains methods and a special method called
constructor.
2. Constructor Method:
○ The constructor method is a special method that is called when
an instance of the class is created.

13
]\

3 . Methods:

● Methods are defined inside the class body and its user defined function
is also called prototype function.

4 . Static Methods:

● Static methods are called on the class itself, not on instances of the
class. They are defined using the static keyword.

14
]\

5. Inheritance:

● Classes can extend other classes using the extends keyword. The
child class inherits methods and properties from the parent class.

6. Inheritance with Super:

● The super keyword is used to call methods and constructors from

the parent class.
● We can super() mathed inside the child class constructor.

15
]\

7. Getters and Setters:

● Getters and setters allow you to define methods that get or set
the values of properties. They are defined using the get and set
keywords

16
]\

Summary.

● Constructor method initializes new instances of a class.

● Methods and Static Methods allow defining behaviors and
functionalities within a class.
● Inheritance is supported using the extends keyword.
● Getters and Setters allow for controlled access to properties.
● super is used to call methods or constructors from a parent class.

17
]\

4. Lexical Scope in JavaScript ?

Lexical scope in JavaScript refers to the visibility and accessibility of

variables based on where they are defined within the code. Iand nested
functions have access to variables defined in their outer (enclosing)
scopes.

In this example, the returned function from createCounter forms a

closure. It retains access to the count variable from its lexical scope,
even after createCounter has finished executing.

18
]\

5 . Rest Operator in JavaScript ?

The rest operator in JavaScript is a syntax introduced with ECMAScript

2018 (ES8) that allows you to represent an indefinite number of
arguments as an array. It is used to collect all remaining elements into a
single array parameter in function arguments, destructuring
assignments, and more.

The rest operator is denoted by three consecutive dots (...) followed by

the name of the parameter or variable.

1.Function Parameters:

The rest operator can be used in function parameters to collect multiple

arguments into an array.

In this example, the ...numbers parameter collects all the arguments passed
to the sum function into the numbers array.

19
]\

2. Destructuring Arrays:

● The rest operator can be used to collect the remaining elements of an

array into a new array during destructuring.
● It is allows you to unpack values from arrays or properties from objects
into distinct variables.

3. Destructuring Objects:

● The rest operator can be used to collect the remaining properties of an

object into a new object during destructuring.

20
]\

6 . Spread Operator in JavaScript ?

It allows you to expand or spread elements from an iterable (such as an

array or object) into individual elements or properties. It is denoted by
three consecutive dots (...) followed by the iterable.

In this example, ...fruits spreads the elements of the fruits array into the
moreFruits array.

In this example, updatedPerson is a new object with the properties from

person and additional or updated properties.

Shallow Copy: The spread operator creates a shallow copy of an array or

object. This means that if the array or object contains nested objects or arrays,
those nested structures are not deeply copied but referenced.

21
]\

7 . Promise in JavaScript ?

A Promise in JavaScript is an object representing the eventual

completion (or failure) of an asynchronous operation and its resulting
value. Promises are a way to handle asynchronous operations and are
part of the ECMAScript 2015 (ES6) specification.

Key Concepts :

1. States of a Promise:

● Pending: The initial state of a promise. The promise is neither fulfilled

nor rejected.
● Fulfilled: The state of a promise when the asynchronous operation is
completed successfully.
● Rejected: The state of a promise when the asynchronous operation
fails.

2.Promise Object:

● The Promise object has methods to handle asynchronous results:

then(), catch(), and finally().

22
]\

Handling Multiple Promises:

23
]\

Summary

● Promise represents the result of an asynchronous operation and can be

in one of three states: pending, fulfilled, or rejected.
● You create a promise using the Promise constructor and handle its
result with then(), catch(), and finally().
● Promises can be chained and combined using methods like
Promise.all(){“any is fail then all fail ”}, Promise.race(){“
fast one return “}, Promise.allSettled(){“if any how may pass
or how many fail its always give result“}
● The finally() method allows you to execute code regardless of the
promise’s outcome.

24
]\

8 . Async and await in JavaScript ?

async and await are modern JavaScript features introduced in

ECMAScript 2017 (ES8) that simplify working with asynchronous code.
They provide a cleaner syntax for handling asynchronous operations
compared to using callbacks or promises directly.

25
]\

9 . Global Function in JavaScript ?

Global functions are functions that are available globally, meaning they
can be accessed and invoked from anywhere in your code.

isFinite()

● Determines whether a value is a finite number. Returns true if the

value is a finite number, and false otherwise.

isNaN()

● Determines whether a value is NaN (Not-a-Number). Returns true if the

value is NaN, and false otherwise.

26
]\

10 . Generators in JavaScript ?

Generators in JavaScript are special functions that can be paused and

resumed, allowing them to yield multiple values over time. They provide
a way to work with sequences of values and manage asynchronous
operations more easily. Generators were introduced in ECMAScript 2015
(ES6).

27
]\

11 . Deep Copy and Shallow Copy JavaScript ?

when we copy one object to another object in this case object data is
not copied object reference is copied in this case we can used :

Shallow Copy :

A shallow copy creates a new object, but only copies the top-level
properties from the original object. Its work only single level .

28
]\

Deep Copy :

A deep copy creates a new object and recursively copies all properties and
nested objects from the original object.

Here we have a problem that function is remove here :

29