Hey!! Friends, welcome to our new article of javascript tutorial beginners. Here we will start from where we finished in the previous article. Previously, we talked about Objects and of Arrays javascript Tutorials for Beginners. Here we started the tutorial with functions in javascript, Scope, and Closure.
If you missed the previous article, then check once Objects and Arrays.
| What’s inside: Function Scope JavaScript Closure FAQs: |
Function
A function is a set of statements that performs a task or calculates a value. Functions may also take inputs, process them, and return the output:
Like most programming languages, the function is a piece of code that can be isolated to be called multiple times.
For example :
function Hello(string)
{
return “Hello” + " " + string;
}
Hello( “Tom”); /* returns “Hello Tom” */
Function as value
Functions are values in JavaScript. A function can assign as a value to a variable.
var f = function foo()
{
console.log("Hello");
};
f(); /* returns "Hello" */
Function as argument
A JavaScript function can be passed as an argument to another function.
var f = function()
{ console.log("Hello");
};
var executor = function(fn)
{ fn();
}
executor(f); /* returns "Hello" */
JavaScript Nested Functions
All functions in Javascript have access to the global scope in JavaScript.
In fact, functions in JavaScript all have access to the scope “above” them.JavaScript supports nested functions. Nested functions have access to the scope “above” them.
In this example, the inner function plus() has access to the counter variable in the parent function:
For example:
function add() {
var counter = 0;
function plus() {counter += 1;}
plus();
return counter;
}The Function() Constructor
As you have examined in the previous examples, JavaScript functions are defined with the function keyword.
The Functions can also be defined with a built-in JavaScript function constructor called Function().
For example:
var myFunction = new Function("a", "b", "return a * b");
var x = myFunction(4, 3);
Definition and Usage
The forEach() method calls a function already for each element in an array, in order.
Note: the JavaScript function is not executed for array elements without values.
Syntax
array.forEach(function(currentValue, index, arr), thisValue)
Scope
- Scope applies to the part of the program in which a variable can be accessed.
- JavaScript has two types of scopes: Local and Global.
- Variables with global scope can be accessed anywhere in the program, and the variables with a local scope can be accessed within the block or function within which they are declared.
For example :
Here name1 is a global variable and name2 is a local variable
var name1 = "ben";
myFunction();
function myFunction() {
var name2 = "bob";
console.log(name1);
console.log(name2);
}
console.log(name2);
Console
ben
bob
Uncaught ReferenceError: name2 is not defined
Closure
- A closure is blank but a function inside a function.
- This closure function uses variables within its scope, variables from external functions, and global variables.
For example
In this example, whenever we call myClosure the function of the value of I will be increased by one. I will be set to zero only once, and only the internal function will be called whenever myClosure is called
var myClosure = (function () {
var i = 0;
return function () {return i += 1;}
})();
myClosure();//i=1
myClosure();//i=2
myClosure();//i=3
When to use Closure?
The closure is useful in hiding implementation detail in JavaScript. In other words, it is useful to create private variables or functions.
The following example shows how to create private functions & variable.
<!DOCTYPE html>
<html>
<body>
<h1>Demo: Closure</h1>
<script>
var counter = (function() {
var privateCounter = 0;
function changeBy(val) {
privateCounter += val;
}
return {
increment: function() {
changeBy(1);
},
decrement: function() {
changeBy(-1);
},
value: function() {
return privateCounter;
}
};
})();
alert(counter.value());
counter.increment();
counter.increment();
alert(counter.value());
counter.decrement();
alert(counter.value());
</script>
</body>
</html>In the above example, increment (), decryption (), and value () become public functions because they are included in the return object. In contrast, the change () function becomes a private function because it is not returned and only pay. Increment () is used internally by decrement ().
FAQs:
Object’s properties are similar to variables and methods are similar to _________.
Ans: Function
What is true about functions in Javascript? I) Functions are objects II) Can be assigned to a variable III) Can be anonymous IV) Return value type has to be defined in a function declaration
Ans: I, II, IV
What is the output for the following code?
(function f(){ function f(){ return 1; } return f(); function f() { return 2; } })();
Ans: 2
What is the output for the following expression?
function test(x) { while(x < 5) { x++; } return x; } alert(test(2));
Ans: 3
Above all, we learned about The functions in javascript, Scope, and Closure, which are a very important topic of JavaScript. In the coming article, we learn about DOMS and their types.
So,Please stay with us on this journey 🙂