Closure:
A closure is a feature in JavaScript where an inner function has access to the outer (enclosing) function’s variables. Whenever a function is called, a new scope is created for that call. The local variable declared inside the function belongs to that scope; they can only be accessed from that function.
Example:
function add(n) {
var b = n;
function result(m) {
var a = m;
return a+b;
}
return result;
}
var x=add(2);
console.log(x(3));
Output: 5
Here we have two functions.
- add() creates a local variable called b and returns the result() function.
- The result() function is an inner function that is defined inside add() and is only available within the body of the add() function. Note that the result() function has local variable a.
However, since inner functions have access to the variables of outer functions, result() can access the variable b declared in the parent function, add(). If result() were to have its own b local variable, it would use this instead. The result() function return sum of the a and b value.
In our example, the result() function had preserved the value of b when the add() function was executed, and continued to preserve (closure) it.
Higher Order Function
Before Higher order function we have to know about function. So let us introduce a function.
What is a function?
A function is a block of code that can solve a particular task and give result. A function must have a name and body. And also can have argument if needed by which it works and prepare output.
Functions are executed when they are called by name.
Example:
function Add(A,B) {
return A+B;
}
Now What is Higher order function?
Higher order function is a function that can receive another function as argument and return a function as output.
Sometimes we need to do some task in a function and one of the task is already done in another function which is created. At that moment to reduce code or complexity we can use this function as argument or return value.
Example:
Output: hello hamidur
here, hello() is a higher order function which take print() function as it’s argument. and return value from print() function.
Here we can see that filterEven is a function that filter all even numbers from an array. To find even numbers it use another function named test as it’s argument.
Filtering Array:
Array can be filtered it’s component on condition using filter() method. Filter() is a method of array that used to filter an array.
The filter array method creates a new array with all elements that pass the test implemented by the provided function.
Suppose we want to filter an array to even numbers. To find the even number it declare a function findEven(). And finally it find the even numbers by calling filter() method with argument findEven().
Example:
We can also write the function in this way… output will be same.
Output: 2,4,6,8
Summarizing with Reduce:
The reduce() method applies to a function against an accumulator to find a single value from an array based on condition.
Reduce() method provide a loop for the array and execute the function for each value of the array. The Return value is stored in the accumulator.
Example: Suppose we want to find the maximum value from an array . To solve this problem a function findMax() is used . In this function val is the accumulator which store the result. And maximum value is found by calling reduce() method with findMax() method.
Here the output is 9.
Another example is here, the reduce method is used to find the sum of all values in the array.
Transform with map:
map() is an array method to update the old array values. It calls with a function and create a new array with the result of calling function which works for every element of the array.
Example: Suppose we want to update an array for any reason . we want that every element of the array will be update by increasing 2.
Output: 3,4,5,6,7
We can also create a mapped function. In the example bellow we convert every element of the array into uppercase.
Output: A,B,C
Prototype-
In JavaScript , every objects have an internal property which is called Prototype. To understand this we will go through an example-
Watch closely!
We have created an object of Customer. It has property value FirstName & LastName. Customer has no property named toString().Then how Customer.toString() returns a value?
Here comes the idea of Prototypes. A prototype is object that is associated with every functions and objects by default in JavaScript, where function’s prototype property is accessible and modifiable and object’s prototype property is not visible.
So what is in the prototype of Customer object? Let’s see-
To see the prototype of an object or function we may use object.getPrototypeOf().
Adding property in prototype-
We can add any property value or method in prototype of an object. Let’s see how to do this-
So, we have added a new property method in prototype of Customer and get access through reference
Customer.
The Array object has a prototype Array.prototype and the object instance inherits the properties of the Array object.
Similarly, Functions derived from Function.prototype.
So, from above discussion we can say that the prototype object is special type of enumerable object to which additional properties can be attached to it which will be shared across the instance of it’s constructor.