ES6 Concepts
Published: 2022-03-05 10:55:37


**Tell me about Es6**
  **Or what ES6 features did you use?**

Ans: ES6 was released in June 2015, which was developed by Brendan Eich and that is the sixth edition of the language. Primarily, it was named ES6 which is renamed as ECMAScript 2015 later. This edition includes several new features that are Let and const keywords, spread operators,  class, arrow functions, for...of loop, modules, iterators, promises, and many more.


**What are the differences between var, let, and const?**
 
Ans: There few differences between var, let, const which are given below:

- Var declaration are globally scoped or functioned scoped whereas let and const are block scoped.

- Var variables can be updated and redeclared whereas let and const both variables can not be redeclared. However, let variable can be updated but const variable not.

- Var and let variable can be declared without being initialized whereas const variable must be initialized during declaration.
 
**Why will you use default parameters?**

Ans: If no value or undefined is passed then we can use the default parameters to set default values for named parameters.

**How does the Spread operator work?**

Ans: The list of parameters is obtained using the spread operator. Three dots (...) are used to represent it and it divides an iterable (such as an array or a string) into individual elements. It's mostly used in JavaScript to make shallow copies of JS and to join two arrays together or to concatenate them. 

**Difference between class and object**
Ans: 

**Object**

- Object is an instance of a class.
- Object is a real world entity such as pen, laptop, mobile, bed, keyboard, mouse, chair etc.
- Object is a physical entity.
- Object is created many times as per requirement.
- Object allocates memory when it is created.

**Class**

- Class is a blueprint or template from which objects are created.
- Class is a group of similar objects.
- Class is a logical entity.
- Class is declared once.
- Class doesn't allocated memory when it is created.


**What is a Prototype chain?
   Or how does inheritance work in JavaScript?**

Ans: Prototype is basically a property of a JavaScript function. At each time we create a function in JavaScript, JavaScript engine adds an extra property called prototype to the created function.

In JavaScript, each object contains a prototype object that acquires properties and methods from it. Again an object's prototype object may contain a prototype object that also acquires properties and methods, and so on. It can be seen as prototype chaining.

**Explain Call by value vs call by reference**

Ans: While calling a function, we pass values of variables to it and these functions are known as “Call By Values”.
While calling a function, instead of passing the values of variables, we pass address of variables(location of variables) to the function, and this function is known as “Call By References”.
 
**What is scope in JavaScript?**
**Or Explain JavaScript scope, Block scope, and global scope?**

Ans: Scope refers to the area where an item such as a function or variable is visible and accessible to other code.

When a variable is defined inside a block and it is only accessible to the code within the curly braces { } is called block scope

Variables declared outside any function have Global Scope. Global variables can be accessed from anywhere in a JavaScript program.

**What is a Higher-order Function?**
Ans: A higher-order function can be defined as a function that accepts one or more functions as arguments and returns a function as a result. Using higher-order functions in our code enhances the execution speed of our code and speeds up our development skills.
 
**What is API? Difference between Get vs post?**

Ans: API is the abbreviation of the term Application Programming Interface is used to communicate between apps and to access and fetch the required information.

Difference between Get and Post are given below:

**Get**

- GET requests are often used for fetching documents and GET parameters are used to describe which document we are looking for (or)  what page we are on (or) things of that nature. 
- GET Parameters are included in URL
- Get request is not secured because data is exposed in URL bar.
- Get request is more efficient and used more than Post.

**Post**

- POST parameters are often used for updating data for actually making changes to the server (or) to the data held on the server
- POST parameters are included in the body
- Post request is secured because data is not exposed in URL bar.
- Post request is less efficient and used less than get.

**Difference between local storage and Session storage**

Ans: Session storage is similar to local storage but the difference is that while data in local storage doesn't expire, data in session storage is cleared when the page session ends.

**What are cookies? And why will you use it?**

Ans: Cookies are files that hold information about you, your web browser and your behavior on the internet. They are tiny files stored on your PC or device, which can be used by websites or web apps to tailor your online experience.

Cookies  are used to identify my computer as I use a computer network. Specific cookies known as HTTP cookies are used to identify specific users and improve your web browsing experience. 

Data stored in a cookie is created by the server upon internet connection. This data is labeled with an ID unique.

**What is object-oriented programming?**

Ans: The word object-oriented is the combination of two words that is object and oriented. Object-oriented programming (OOP) is a computer programming model that organizes software design around data, or objects, rather than functions and logic. An object can be defined as a data field that has unique attributes and behavior.

**How will you debug a JavaScript application?**

Ans: Debugging is not easy but fortunately, all modern browsers have a built-in JavaScript debugger. Built-in debuggers can be turned on and off, forcing errors to be reported to the user. With a debugger, I can also set breakpoints and examine variables while the code is executing otherwise have to follow the steps at the bottom of that page and activate debugging in browser with the F12 key, and select "Console" in the debugger menu.

**What is arrow function? What are the advantages of arrow function?**

Ans: Arrow functions are introduced in ES6 and the definition of the arrow function consists of parameters, followed by an arrow (=>) and the body of the function. An Arrow function is also called as 'fat arrow' function. We cannot use them as constructors.

The advantages of the arrow function are listed below:
It reduces code size.

The return statement is optional for a single line function.
Functional braces are optional for a single-line statement.

**What are the template literals in ES6?**

Ans: Template literals are a new feature introduced in ES6 which provides an easy way of creating multiline strings and performing string interpolation. Template literals are enclosed by the backtick (` `) character and template literals were referred to as template strings prior to ES6.

**What is Babel?**

Ans: Babel is one of the popular and open-source transpilers of JavaScript. It is mainly used for converting the ES6 plus code into the backward-compatible version of JavaScript that can be run by previous JavaScript engines.

**Define about set.**

Ans: A set is a data structure that allows us to create a collection of unique values. It is a collection of values that are similar to arrays and it does not include any duplicates. It is used to support both object references and primitive values.

`Example
let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);    
console.log(colors);    
Output: set{'Green', 'Red', 'Orange', 'Yellow', 'Red'}`

**What is the purpose of using destructuring?**
Ans: Destructuring was introduced in ES6 as a way to extract data from arrays and objects into a separate variable. It is used to extract smaller fragments from objects and arrays.

 **What are the new String methods introduced in ES6?**

Ans: Four string methods introduced in ES6 that are listed below:

**string.startsWith() :** It determines if a string begins with the characters of a given string.

**string.endsWith() :**  It determines if a string ends with the characters of a given string.

**string.includes() :** It will return true if the given argument is present in the string.

**string.repeat() :** It creates and returns a new string which contains the given number of copies of the string on which this method was called, concatenated together.

**Explain difference between for…of and for…in.**

Ans: It is similar to for loop that iterates through the properties of an object. It is useful when we require to visit the properties or keys of the object.

However, for-of loop which allows us to iterate over arrays very easily and the code inside the loop is executed for each element of the iterable array.

**What is Bubbling and Capturing?**

Ans: The event bubbles up or goes to its parent, grandparents, and grandparent's parent until it reaches the window in the Bubbling Phase and the event starts out from window down to the element that prompted the event or the event target in the Capturing Phase.

**What is the difference between const and Object.freeze()?**

Ans: Const creates an immutable binding, which means you can't change its value whereas  Object.freeze() method freezes an object that prevents new properties from being added to it and this method prevents the modification of existing property, attributes, and values.