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-levelscope(e.g.,inside{ }):Variablesdeclaredwithvar
do not respect block scope. This means that a var variable
 declared inside a block (like anif statement or loop) can be
accessed outside of that block.

let:
2

● 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
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 ?

callback

callback logs 10.

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

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

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

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 index8 of the first element
in the array that satisfies , If no elements satisfy the condition, it
returns -1.
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.

Summar y:

● Arrow functions provide a concise syntax for writing

functions.
● They do not have their own this context and inherit this
from their lexical scope. 10

● 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.
1. Shorter Syntax:

● Forasingleexpression,thennoneedto return a statement.

● Ifthereisonlyoneparameter,thennoneedto parentheses

11

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.
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. ClassDeclaration:
○ Theclasskeywordisusedtodefineaclass.
○ Aclassbodycontainsmethodsandaspecialmethodcalled

constructor.
2. ConstructorMethod:
○ Theconstructormethodisaspecialmethodthatiscalledwhen
an instance of the class is created.

13
3 . Methods:

● Methodsaredefinedinsidetheclassbodyand itsuserdefinedfunction
is also called prototype function.

4 . Static Methods:

● Staticmethodsarecalledontheclassitself,notoninstancesofthe
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:

15

● Thesuperkeywordisusedtocallmethodsandconstructorsfrom
the parent class.
● Wecansuper()mathedinsidethechildclassconstructor.
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
Summar y.

17

● Constructor method initializes new instances of a class. and

● Methods and Static Methods allow defining behaviors
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.
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.

18

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.
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.

19

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

Arrays:

● Therestoperatorcanbeusedtocollecttheremainingelementsofan
array into a new array during destructuring.
● Itisallowsyoutounpackvaluesfromarraysorpropertiesfromobjects
into distinct variables.

3. Destructuring Objects:

● Therestoperatorcanbeusedtocollecttheremainingpropertiesofan
object into a new object during destructuring.
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.

21

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.
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:Theinitialstateofapromise.Thepromiseisneitherfulfilled
nor rejected.
● Fulfilled: The state of a promise when the asynchronous operation is
completed successfully.
● Rejected: The state of a promise when22the asynchronous operation
fails.

2.Promise Object:

● ThePromiseobjecthasmethodstohandleasynchronousresults:
then(), catch(), and finally().
Handling Multiple Promises:

23
Summar y

● 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
24
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() methodallowsyoutoexecutecoderegardlessofthe
promise’s outcome.
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).

26
Returns true if the
value is NaN, and false otherwise.
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
Keep Exploring
Javascript with
us!
29