A function is a part of code that does a particular operation that is written by the user and called by name independently. A function may be passed some data and it may also return some data. On the other hand, you can think of methods as defined properties of objects that can be called with reference from the object of the class only. Objects that are associated with methods are basically window objects. The syntax of defining a method and a function is different in JavaScript. Methods are only used to define window objects. The way of defining a method is different than defining a function in JavaScript.
The four different ways of invoking a function are as follows:
- Invoking a function as a function
- Invoking a function as a method
- Invoking a function as a constructor
- Invoking a function with a function method
All these methods were discussed in detail in the previous chapter. There is a different way of initializing the this keyword. When you call a function, it starts a function. However, when you invoke a function, it executes it.
When you define a function, your script will not execute, but when you invoke a function, the script will execute. A JavaScript function performs a particular task. When any object calls this function, it starts working. To define a function in JavaScript, we use the function keyword. A function can have multiple parameters depending on the task. You can find more detail for this in Chapter 8, JavaScript Implementations, Syntax Basics, and Variable Types.
In JavaScript, a function can have number of arguments. A function may be called with a number of arguments. If you do not provide any argument in a function, then it will become undefined. Arguments are optional in a JavaScript function. If you do not pass any argument in a function, then it will set it to default. Here is an example:
Function arg(x,y) {
Console.log(x+y);
Arg(2);
Arg(2,1);
}In this example, we passed two arguments in the function: arguments x and y. When the first function arg(2) is called, then a=2 and b will be undefined. When the second function is called, a=2 and b=1.
We know we can pass arguments in a function. A function returns a value to perform a different operation in your script. There are two ways to pass a value into a function:
- Pass by value: When we pass any variable (of primitive data types) as an argument in the function, we pass it by value. For example, first, the value is
2. After passing, it is3:var a=2; console.log(a); // shows 2 functionpassVal(a);{ a=3; } console.log(a); // shows 3 - Pass by reference: When you pass a value to an object, it is passed by reference:
functionpassingVariables(a, b, c) { a = a + 10; b.value = "changed"; c = {value: "changed"}; } varnum = 10; varvar1 = {value: "unaffected"}; varvar2 = {value: "unaffected"}; passingVariables (num, var1, var2); console.log(num); // 20 console.log(var1.value); // changed console.log(var2.value); // unaffected
Namespace is a set of logical identifiers grouped together. JavaScript does not provide a namespace facility by default. So, for creating namespaces in JavaScript, we declare a global object and make all functions and properties into that global object, for example:
var stud=student || {};
stud.student=function(name) {
this.name ;
}
var s=new stud.student("Ali");To write better code, we use closures in JavaScript. Better code means code that is creative and expressive. In JavaScript, you encounter closures repeatedly, whether you are a good JavaScript programmer or not. Depending on how you use closures in your code, it could be complex or easy.
Basically, closures are the inner functions of JavaScript used to access the outer function's scope. There are three scopes of a closure:
- Access of outer function variables
- Access to its own scope variables
- Access to its global variables
Inner functions also have access to outer function variables and parameters. In its own scope, variables are defined in curly brackets. Here is an example:
functionstudentName(name) {
varstdName="Student Name";
functionstdLastName(){
returnstdName+name; }
returnstdntLastName();
}To define a function in JavaScript, we use the function variable. This function can be called anywhere in your script. It could also be a function constructor. The attributes and their descriptions are as follows:
arguments: This is an array passed to a function as an argumentargument.length: This tells us the number of arguments in a functionconstructor: This is used to create an objectlength: This defines the number on an argumentprototype: This allows a function to add object propertiesarguments.callee: This tells us which function is executing currently
Actions performed on objects are known as methods in JavaScript. They contain function definitions. They are stored as object properties in a script. For example, you can create a method like this in JavaScript:
Student.FullName = function() {
// define your code here
}Here FullName is both a property (Student.FullName) and a method (Student.FullName()). When you access object properties without brackets, this will return a function definition. Here is an example:
Name=Student.FullName;
A function constructor is used to define a function dynamically. A new operator is use to define a function with the constructor method. You can also pass as many arguments you want to use in your script to a constructor. The last argument will be the body of the function. It can also contain statements separated by commas. Here is an example:
varobj = new Function('a', 'b', 'return a*b;');We cannot pass the same function name in a constructor as an argument, as it will create an error in the script. It can also create an unnamed function, known as an anonymous function.