JavaScript is an interpreted language, not a compiled language. An interpreter in the browser reads over the JavaScript code, interprets each line, and runs it. Nowadays modern browsers use a technology known as Just-In-Time (JIT) compilation, which compiles JavaScript to executable bytecode just as it is about to run.

Events are "things" that happen to HTML elements. When JavaScript is used in HTML pages, JavaScript can react on these events. Some of the examples of HTML events are,
Web page has finished loading
Input field was changed
Button was clicked

The Browser Object Model (BOM) allows JavaScript to "talk to" the browser. It consists of the objects navigator, history, screen, location and document which are children of window. The Browser Object Model is not standardized and can change based on different browsers.

The setTimeout() method is used to call a function or evaluates an expression after a specified number of milliseconds.

The setInterval() method is used to call a function or evaluates an expression at specified intervals (in milliseconds).

JavaScript is a single-threaded language. Because the language specification does not allow the programmer to write code so that the interpreter can run parts of it in parallel in multiple threads or processes. Whereas languages like java, go, C++ can make multi-threaded and multi-process programs.

When sending data to a web server, the data has to be in a string format. You can achieve this by converting JSON object into a string using stringify() method.

When receiving the data from a web server, the data is always in a string format. But you can convert this string value to javascript object using parse() method.

The clearTimeout() function is used in javascript to clear the timeout which has been set by setTimeout() function before that. i.e, The return value of setTimeout() function is stored in a variable and it’s passed into the clearTimeout() function to clear the timer.

Rest parameter is an improved way to handle function parameter which allows us to represent an indefinite number of arguments as an array.
function total(…args) {
let sum = 0;
for(let i of args) {
sum+=i;
}
return sum;
}
console.log(fun(1,2)); //3
console.log(fun(1,2,3)); //6
console.log(fun(1,2,3,4)); //13
console.log(fun(1,2,3,4,5)); //15

Object.isFrozen() method is used to determine if an object is frozen or not. An object is frozen if all of the below conditions hold true,
If it is not extensible.
If all of its properties are non-configurable.
If all its data properties are non-writable.

The Object.is() method determines whether two values are the same value.
Two values are the same if one of the following holds:
both undefined
both null
both true or both false
both strings of the same length with the same characters in the same order
both the same object (means both object have same reference)
both numbers and both +0 both -0 both NaN both non-zero and both not NaN and both have the same value

If an object is frozen using the Object.freeze() method then its properties become immutable and no changes can be made in them whereas if an object is sealed using the Object.seal() method then the changes can be made in the existing properties of the object.

The Object.values() method's behavior is similar to Object.entries() method but it returns an array of values instead [key,value] pairs.

You can use Object.keys() method which is used return an array of a given object's own property names, in the same order as we get with a normal loop.

An anonymous function is a function without a name! Anonymous functions are commonly assigned to a variable name or used as a callback function.

An iterator is an object which defines a sequence and a return value upon its termination. It implements the Iterator protocol with a next() method which returns an object with two properties: value (the next value in the sequence) and done (which is true if the last value in the sequence has been consumed).

A decorator is an expression that evaluates to a function and that takes the target, name, and decorator descriptor as arguments. Also, it optionally returns a decorator descriptor to install on the target object.

Synchronous functions are blocking while asynchronous functions are not. In synchronous functions, statements complete before the next statement is run. In this case, the program is evaluated exactly in order of the statements and execution of the program is paused if one of the statements take a very long time. Asynchronous functions usually accept a callback as a parameter and execution continue on the next line immediately after the asynchronous function is invoked. The callback is only invoked when the asynchronous operation is complete and the call stack is empty. Heavy duty operations such as loading data from a web server or querying a database should be done asynchronously so that the main thread can continue executing other operations instead of blocking until that long operation to complete (in the case of browsers, the UI will freeze).

The event loop is a single-threaded loop that monitors the call stack and checks if there is any work to be done in the task queue. If the call stack is empty and there are callback functions in the task queue, a function is dequeued and pushed onto the call stack to be executed.

Variables declared using the var keyword are scoped to the function in which they are created, or if created outside of any function, to the global object. let and const are block scoped, meaning they are only accessible within the nearest set of curly braces (function, if-else block, or for-loop).
var allows variables to be hoisted, meaning they can be referenced in code before they are declared. let and const will not allow this, instead throwing an error.
Redeclaring a variable with var will not throw an error, but 'let' and 'const' will.
let and const differ in that let allows reassigning the variable's value while const does not.

A higher-order function is any function that takes one or more functions as arguments, which it uses to operate on some data, and/or returns a function as a result. Higher-order functions are meant to abstract some operation that is performed repeatedly. The classic example of this is map, which takes an array and a function as arguments. map then uses this function to transform each item in the array, returning a new array with the transformed data. Other popular examples in JavaScript are forEach, filter, and reduce. A higher-order function doesn't just need to be manipulating arrays as there are many use cases for returning a function from another function. Function.prototype.bind is one such example in JavaScript.

A closure is a function defined inside another function (called parent function) and has access to the variable which is declared and defined in parent function scope.
The closure has access to the variable in three scopes:
Variable declared in his own scope
Variable declared in parent function scope
Variable declared in the global namespace

forEach
The closure has access to the variable in three scopes:
Iterates through the elements in an array.
Executes a callback for each element.
Does not return a value.
map
Iterates through the elements in an array.
"Maps" each element to a new element by calling the function on each element, creating a new array as a result.
The main difference between .forEach and .map() is that .map() returns a new array. If you need the result, but do not wish to mutate the original array, .map() is the clear choice. If you simply need to iterate over an array, forEach is a fine choice.

Slice
Doesn't modify the original array(immutable)
Returns the subset of original array
Used to pick the elements from array
Splice
Modifies the original array(mutable)
Returns the deleted elements as array
Used to insert or delete elements to/from array

The async() Attribute The async attribute is used to indicate to the browser that the script file can be executed asynchronously. The HTML parser does not need to pause at the point it reaches the script tag to fetch and execute, the execution can happen whenever the script becomes ready after being fetched in parallel with the document parsing.
script async src="script.js"
The defer() Attribute
The defer attribute tells the browser to only execute the script file once the HTML document has been fully parsed.
script defer src="script.js"

When an async() function is called, it returns a Promise. When the async() function returns a value, the Promise will be resolved with the returned value. When the async() function throws an exception or some value, the Promise will be rejected with the thrown value.
An async function can contain an await() expression, which pauses the execution of the async() function and waits for the passed Promise's resolution, and then resumes the async() function's execution and returns the resolved value.

JavaScript-powered content needs to be rendered before it can output meaningful code and be displayed for the client. These are the different steps involved in the JavaScript rendering process:
JavaScript Rendering Process
JavaScript: Typically JavaScript is used to handle work that will result in visual changes.
Style calculations: This is the process of figuring out which CSS rules apply to which elements. They are applied and the final styles for each element are calculated.
Layout: Once the browser knows which rules apply to an element it can begin to calculate how much space it takes up and where it is on screen.
Paint: Painting is the process of filling in pixels. It involves drawing out text, colors, images, borders, and shadows, essentially every visual part of the elements.
Compositing: Since the parts of the page were drawn into potentially multiple layers they need to be drawn to the screen in the correct order so that the page renders correctly.
The main responsibility of the rendering engine is to display the requested page on the browser screen. Rendering engines can display HTML and XML documents and images.

The unshift() method adds one or more elements to the beginning of an array and returns the new length of the array.

A callback function is a function passed into another function as an argument, which is then invoked inside the outer function to complete some kind of routine or action.

a.) array.join(): The join() method creates and returns a new string by concatenating all of the elements in an array (or an array-like object), separated by commas or a specified separator string. If the array has only one item, then that item will be returned without using the separator.
b.) array.pop(): The pop() method removes the last element from an array and returns that element. This method changes the length of the array.
c.) array.push(): The push() method adds one or more elements to the end of an array and returns the new length of the array.
d.) array.shift(): The shift() method removes the first element from an array and returns that removed element. This method changes the length of the array.
e.) array.unshift(): The unshift() method adds one or more elements to the beginning of an array and returns the new length of the array.
f.) array.concat(): The concat() method is used to merge two or more arrays. This method does not change the existing arrays, but instead returns a new array.
g.) array.map(): The map() method creates a new array with the results of calling a provided function on every element in the calling array.
h.) array.filter(): The filter() method creates a new array with all elements that pass the test implemented by the provided function.
i.) array.reduce(): The reduce() method executes a reducer function (that you provide) on each element of the array, resulting in a single output value.
j.) array.reduceRight(): The reduceRight() method applies a function against an accumulator and each value of the array (from right-to-left) to reduce it to a single value.
k.) array.every(): The every() method tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value.
l.) array.some(): The some() method tests whether at least one element in the array passes the test implemented by the provided function. It returns a Boolean value.
m.) array.indexOf(): The indexOf() method returns the first index at which a given element can be found in the array, or -1 if it is not present.
n.) array.lastIndexOf(): The lastIndexOf() method returns the index within the calling String object of the last occurrence of the specified value, searching backwards from fromIndex. Returns -1 if the value is not found.
o.) array.find(): The find() method returns the value of the first element in the provided array that satisfies the provided testing function.
p.) array.findIndex(): The findIndex() method returns the index of the first element in the array that satisfies the provided testing function. Otherwise, it returns -1, indicating that no element passed the test.
q.) array.includes(): The includes() method determines whether an array includes a certain value among its entries, returning true or false as appropriate.

Callback hell is a phenomenon that afflicts a JavaScript developer when he tries to execute multiple asynchronous operations one after the other. Some people call it to be the pyramid of doom.
Techniques for avoiding callback hell
Write comments
Split functions into smaller functions
Using Async.js
Using Promises
Using Async-Await

Encryption
Encryption is the process of encoding simple text and other information that can be accessed by the sole authorized entity if it has a decryption key. It will protect your sensitive data from being accessed by cyber criminals. It is the most effective way of achieving data security in modern communication systems. There are a number of encryption systems, where an asymmetric encryption is also known as public-key encryption, symmetric encryption and hybrid encryption are the most common.
Symmetric encryption – Uses the same secret key to encrypt and decrypt the message. The secret key can be a word, a number or a string of random letters. Both the sender and the receiver should have the key. It is the oldest technique of encryption.
Asymmetric encryption – It deploys two keys, a public key known by everyone and a private key known only by the receiver. The public key is used to encrypt the message and a private key is used to decrypt it. Asymmetric encryption is little slower than symmetric encryption and consumes more processing power when encrypting data.
Hybrid encryption – It is a process of encryption that blends both symmetric and asymmetric encryption. It takes advantage of the strengths of the two encryptions and minimizes their weakness.
Purpose of encryption
Confidentiality – Encrypted message cannot be read or changed by another person.
Encrypt – It transforms data in such a way that only specific individuals can transform the message.
Granular access control – Users are limited to what they can see and do.
It makes auditing for accountability easy. In the case of message leaked, it is easy to trace who did that and when thus security breaches can be sorted out efficiently.
Authentication – the origin of the message received can be traced thus facilitating authentication.
Hashing
In hashing, data is converted to the hash using some hashing function, which can be any number generated from string or text. Various hashing algorithms are MD5, SHA256. Data once hashed is non-reversible.
Hash function can be any function that is used to map data of arbitrary size to data of fixed size. The data structure hash table is used for storing of data.
For example: When images are sent to different server and text is sent to a different server for efficiency purposes. So for verifying images that the images are not tampered in between data transfer over the internet, hashing algorithm like MD5(), SHA() algorithm can be used.
Purpose of hashing
Hashing can be used to compare a large amount of data. Hash values can be created for different data, meaning that it is easier comparing hashes than the data itself.
It is easy to find a record when the data is hashed.
Hashing algorithms are used in cryptographic applications like a digital signature.
Hashing is used to generate random strings to avoid duplication of data stored in databases.
Geometric hashing – widely used in computer graphics to find closet pairs and proximity problems in planes. It is also called grid method and it has also been adopted in telecommunications.

The window.location.url property will be helpful to modify the url but it reloads the page. HTML5 introduced the history.pushState() and history.replaceState() methods, which allow you to add and modify history entries.

Debouncing and throttling techniques are used to limit the number of times a function can execute. These are two widely-used techniques to improve the performance of code that gets executed repeatedly within a period of time.
Throttling enforces a maximum number of times a function can be called over time. As in "execute this function at most once every 100 milliseconds."
Debouncing enforces that a function not be called again until a certain amount of time has passed without it being called. As in "execute this function only if 100 milliseconds have passed without it being called."

Definition:
ES6: ECMA script is basically a trademarked scripting language specification defined by Ecma international.The sixth edition of the same is known as ES6.
ES5: ECMA script is a trademarked scripting language specification defined by ema international. The fifth edition of the same is known as ES5.
Using Arrow Functions
ES6: function keyword need not to be used to defined the function and also the return keyword can e avoided to fetch the computed value.
ES5: function keyword need to be used to define the functions.
Object Manipulation
ES6: Object manipulation can be processed more smoothly.(due to the presence of destructuring, speed operators) than its previous versions.
ES5: also provides the same features but it's a bit more time consuming than that of ES6.
Performance
ES6: With the help of newly implemented features and shorthand storage implementation, ES6 scores a higher performance rank than ES5.
ES5: due to the non-presence of a few features, its performance is a bit less than that of ES6
Support
ES6: There is also a lot of community support for ES6. However, it is lesser than that of ES5.
ES5: ES5 provide a larger range of community supports than that of ES6

JavaScript vs JScript Comparison
Type:
Javascript: It is a scripting language.
JScript: JScript is also a scripting language owned by Microsoft.
Verbosity/Simplicity
Javascript: With JavaScript, one needs to write scripts manually which is time-consuming.
JScript: JScript is the same as JavaScript in this context
Browser Compatibility: With JavaScript, one needs to handle multiple browser compatibility by writing code.
Javascript:With JavaScript, one needs to handle multiple browser compatibility by writing code.
JScript:JScript is only supported by Microsoft’s Internet Explorer.
Compilation:
Javascript:We need not compile JavaScript codes. Our browsers run them.
JScript: Codes are written in JScript support conditional compilation. With this, we can place codes in block comments and execute them selectively. Starting from Microsoft Internet Explorer 11, conditional compilation is no longer supported
Active Content Creation
Javascript: We can simply write JavaScript codes inside the script tag in HTML. We write JavaScript codes in OBSL syntax (Object Based Script language)
JScript: Same goes for JScript. Here also we write the syntax same as JavaScript.
Speed:
Javascript: JavaScript is fast.
JScript: JScript is also fast.
Client Side/Server Side Language:
Javascript: Commonly used on Client Side.
JScript: Commonly used on Client Side.
Type: Object Access
Javascript: JavaScript cannot access web browser objects.
JScript: JScript can access objects exposed by Internet Explorer. An example of such an object is ActiveX.

Bootstrap vs jQuery UI type:Development
Bootstrap:Developed by Twitter
jQuery: Developed by jQuery Project Group
type: Functionality
Bootstrap: Focus on design and appearance
jQuery:Provide pre-written functions to enhance the functionality
type: Purpose
Bootstrap: Mainly a CSS framework
jQuery: Make it easier to use JavaScript
type: Market
Bootstrap: Bootstrap is still behind jQuery in market share
jQuery: jQuery is leading on the web front, with top sites
type: Customization
Bootstrap:It can be customized in a variety of ways by overriding the default CSS
jQuery: Existing functions can be overridden to provide new functionality
type: Orientation
Bootstrap: Highly oriented toward responsiveness
jQuery:jQuery responsive nature is less sophisticated than Bootstrap
type:Written-in
Bootstrap:Written using HTML, CSS, JavaScript, Less, Sass
jQuery:Written using JavaScript
type:Release
Bootstrap: the First release on August 26, 2011,
jQuery:Written using JavaScript

JavaScript and AngularJS
Type: Definition
JavaScript: JavaScript is an object-oriented scripting language.
AngularJS: AngularJS is an open-source framework for creating dynamic web applications.
Type: Programmed
JavaScript: JavaScript most interpreters are written in C and C++
AngularJS: AngularJS is written in JavaScript.
Type: Applications
JavaScript: JavaScript used for creating dynamic web applications.
AngularJS: AngularJS used for creating large single-page applications.
Type: Developed
JavaScript: It was mainly developed by Netscape Communications.
AngularJS: It was mainly developed by Google.
Type:Concept
JavaScript: JavaScript-based on the concept of dynamic typing as an interpreted language
AngularJS: It is based on the concept of a model view controller to build apps.
Type: Syntax
JavaScript: JavaScript syntax is complex as compared to AngularJS.
AngularJS: AngularJS syntax is simple.
Type: Learn ability
JavaScript: JavaScript is complex to learn.
AngularJS: AngularJS can learn easily if one knows JavaScript.
Type: Filters
JavaScript: JavaScript does not support filters.
AngularJS: AngularJS does support filters.

JavaScript vs Node JS:
type:
JavaScript: JavaScript is a programming language. It is running in any web browser with a proper browser engine.
NodeJs: It is an interpreter and environment for JavaScript with some specific useful libraries which JavaScript programming can use separately.
Utility:
JavaScript:Mainly using for any client-side activity for a web application, like possible attribute validation or refreshing the page in a specific interval or provide some dynamic changes in web pages without refreshing the page.
NodeJs: It mainly used for accessing or performing any non-blocking operation of any operating system, like creating or executing a shell script or accessing any hardware-specific information or running any backend job.
Running Engine:
JavaScript: JavaScript running any engine like Spider monkey (FireFox), JavaScript Core (Safari), V8 (Google Chrome).
NodeJs: Node JS only run in a V8 engine which mainly used by google chrome. And javascript program which will be written under this Node JS will be always run in V8 Engine.

Apply vs Call:
Type: Definition
Apply: JavaScript Apply function used to borrow functions and to set this value.
Call: JavaScript call function is derived from borrowing and invoking functions.
Type: Arguments
Apply: JavaScript Apply function takes the arguments as an Array.
Call: JavaScript Call function takes the arguments separately.
Type: Adding Elements
Apply: In JavaScript Apply, elements can be further added to another array.
Call: In the Call function, we have to add an element to the list only.
Type: Built-in function
Apply: In Javascript, the Apply method can use the built-in function like min and max functions.
Call: In the call function, the built-in functions cannot be used.
Type: Constructor
Apply: Apply function can be used for chain constructors for an object.
Call: The call function does not have this feature.
Type: Variadic Functions
Apply: Apply function able to use variadic functions
Call: Call function not able to use.

JavaScript vs JQuery
type:
JavaScript: It is a programming language.
JQuery: It is an API (application programming interface.)
type: Language
JavaScript: It is written in C. It is an interpreted language.
JQuery: Uses resources given by JavaScript to make things easier.
type: Verbosity/Simplicity
JavaScript: With JavaScript, one needs to write their own scripting, which is time-consuming.
JQuery: With JQuery, one need not write much as scripting already exists.
type: Compatibility
JavaScript: With JavaScript, one needs to handle multiple- browser compatibilities by writing their own code.
JQuery: With JQuery, as we all know that it is a multi-browser library.
type: Length of Code
JavaScript: With JavaScript, one has to write more lines of code.
JQuery: With JQuery, one has to write fewer lines of code than JavaScript.
type: Speed
JavaScript:Pure JavaScript is faster in accessing DOM (document object model.) as it cut the overhead which JQuery has.
JQuery: JQuery is also fast with modern browsers and modern computers. Suited for complex operations where developer are prone to mistakes and writing poor lines of code
type: Client-Side/Server Side Language
JavaScript: Commonly used on Client-Side
JQuery: Same for JQuery, it is also commonly used on the Client Side.
type:Light/Heavy Weight
JavaScript:Other than raw JavaScript, it is heavier than JQuery.
JQuery: It is lightweight as compared to other JavaScript libraries