JavaScript Advance Concepts

01. Title: Checking value type of JavaScript

Description: we can easily identify which type of value by using type of. Such as value like string, number, Boolean, object, function

Example:

console.log(typeof(2)); // “number”

console.log(typeof(“hello”)); // “string”

console.log(typeof(undefined)); // “undefined”

console.log(typeof({})); // “object”

console.log(typeof([])); // “object”

console.log(typeof(x => x * 2)); // “function”

02. Title: Error Handling with try and catch

Description: The try…catch mainly two blocks, first try then catch:

try {

// code…

} catch (err) {

// error handling

}

How try and catch works:

1. First, try {…} will execute.

2. If no error found then catch will not executed. If any error found then catch will execute.

03. Title: Hoisting use in JavaScript

Description:

We can declare a variable after its used

In the other hand variable can be use before its declaration

Example 1 gives the same result as Example 2:

Example 1:

x = 10; // here Assign 10 to x

var x; // Declare x

Example 2:

var x; // Declare x
x = 5; // Assign 5 to x

To use this, you have to know hoisting

Hoisting is JavaScript’s Default uses. It’s always declared to the top from its current position.

Let & Const

Let and const not initialized but both are hoisted to top of the block

04. Title: Block Bindings

Usually, bindings use when we declare or set value in a variable. For example, we use var, let and const to declare or assign a variable.

var a = 1
let b = 2
const c = 3

05. Title: Block Binding in Loops

Block-level is very useful when dealing with loops in JavaScript. It is best practice to use let instead of var because var is being hoisted. See the following example:

for (var i = 0; i < 10; i++) {
// some code
}
// i is accessible here because we declare using var
console.log(i) // 10
for (let i = 0; i < 10; i++) {
// some code
}
// i is inaccessible here because we declare using let
console.log(i) // error- i is not defined

06. Title: Global Block Bindings

Global scope behavior for var is different than let and const. For example, when var is used in the global scope, a new global variable is created, which is a property on the global object (window in browsers), but if you use let or const in the global scope, a new binding is created in the global scope but no property added to the global object (window in browsers). That means for var you can accidentally overwrite an existing global, but if you use let or const you cannot overwrite. Here’s the example:

When var is being used:

// in a browser
var greeting = 'Hello, Good Morning'
console.log(window.greeting) // Hello, Good Morning
var person = 'Hello there'
console.log(window.person) // Hello there

When let is being used:

let greeting = 'Hello, Good Morning'
console.log(greeting) // Hello, Good Morning
console.log(window.greeting === greeting) // false
const person = 'Hello there'
console.log(person) // Hello there
console.log(person in window) // false

07. Default parameters

If the value is empty it will by default return undefine.

In the following example, if no value is provided for b when multiply is called, b’s value would be undefined when evaluating a * b and multiply would return NaN.

function multiply(a, b) {

return a * b

}

multiply(5, 2) // 10

multiply(5) // NaN !

08. Working with Unnamed Parameters

So far, the examples in this chapter have only covered parameters that have been named in the function definition. However, JavaScript functions don’t limit the number of parameters that can be passed to the number of named parameters defined. You can always pass fewer or more parameters than formally specified. Default parameter values make it clear when a function can accept fewer parameters, and ECMAScript 6 sought to make the problem of passing more parameters than defined better as well.

09. Rest Parameters

A rest parameter is indicated by three dots (...) preceding a named parameter. That named parameter becomes an Array containing the rest of the parameters passed to the function, which is where the name “rest” parameters originate. For example, pick() can be rewritten using rest parameters, like this:

1. function pick(object,…keys){

2. let result =Object.create(null);

3.

4. for(let i =0, len = keys.length; i < len; i++){

5. result[keys[i]]=object[keys[i]];

6. }

7.

8. return result;

9. }

In this version of the function, keys is a rest parameter that contains all parameters passed after object (unlike arguments, which contains all parameters including the first one). That means you can iterate over keys from beginning to end without worry. As a bonus, you can tell by looking at the function that it is capable of handling any number of parameters.

I> Rest parameters do not affect a function’s length property, which indicates the number of named parameters for the function. The value of length for pick() in this example is 1 because only object counts towards this value.

10. Title: Uses of Spread Operator in JavaScript

the spread operator is useful for many different routine tasks in JavaScript, including the following:

· Copying an array

· Concatenating or combining arrays

· Using Math functions

· Using an array as arguments

· Adding an item to a list

· Adding to state in React

· Combining objects

· Converting NodeList to an array