-
Hajipur, Bihar, 844101
Hajipur, Bihar, 844101
JS Basics
JS Variables & Operators
JS Data Types & Conversion
JS Numbers & Math
JS Strings
JS Dates
JS Arrays
JS Control Flow
JS Loops & Iteration
JS Functions
JS Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Web APIs
Web API Intro
Web Validation API
Web History API
Web Storage API
Web Worker API
Web Fetch API
Web Geolocation API
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Graphics & Charts
In JavaScript, a function call is the process of executing a function that has been defined earlier. Calling a function allows the program to reuse logic, process dynamic data, and organize code efficiently. Understanding how to call functions correctly is essential for writing modular and maintainable JavaScript programs.
This tutorial explains function calls in detail, covering syntax, different types of calls, practical examples, common mistakes, best practices, and real-world applications.
Function calls are important because they:
Execute reusable blocks of code whenever needed.
Pass data into functions through arguments for dynamic behavior.
Allow functions to return results for further use in the program.
Help organize code into modular, manageable units.
Form the foundation for advanced concepts like callbacks, closures, and asynchronous operations.
Without function calls, defined functions remain inactive, and the logic inside them is never executed.
A function is called by writing its name followed by parentheses. You can include arguments within the parentheses if the function accepts parameters:
function greet(name) {
console.log("Hello, " + name + "!");
}
greet("Aarushi");
greet("Priya");
Output:
Hello, Aarushi!
Hello, Priya!
Here, the function greet is called twice with different arguments, producing dynamic results.
Functions can return values, which can be captured when the function is called:
function add(a, b) {
return a + b;
}
let sum = add(10, 15);
console.log(sum);
Output:
25
The returned value can be stored, used in calculations, or passed to other functions.
A function can accept multiple arguments during a call:
function multiply(a, b, c) {
return a * b * c;
}
console.log(multiply(2, 3, 4));
console.log(multiply(5, 6, 2));
Output:
24
60
Each argument corresponds to a parameter in the function definition, ensuring proper computation.
Functions can be called inside other functions:
function square(x) {
return x * x;
}
function sumOfSquares(a, b) {
return square(a) + square(b);
}
console.log(sumOfSquares(3, 4));
Output:
25
Nested calls allow complex calculations to be structured into smaller, reusable functions.
When a function is a property of an object, calling it is known as a method call:
const student = {
name: "Isha",
greet: function() {
console.log("Hello, " + this.name + "!");
}
};
student.greet();
Output:
Hello, Isha!
Calling the function as a method sets this to the object it belongs to, allowing access to object properties.
call()The call() method calls a function with a specific this value and individual arguments:
function greet(city) {
console.log(this.name + " is from " + city);
}
const student = { name: "Saanvi" };
greet.call(student, "Patna");
Output:
Saanvi is from Patna
apply()apply() works like call() but accepts arguments as an array:
greet.apply(student, ["Patna"]);
Output:
Saanvi is from Patna
bind()bind() returns a new function with this set to a specific object. The returned function can then be called:
const greetStudent = greet.bind(student, "Patna");
greetStudent();
Output:
Saanvi is from Patna
bind() is particularly useful for event handlers and callbacks that require a specific context.
Forgetting parentheses () when calling a function, which references it instead of executing it.
Passing the wrong number of arguments, causing undefined parameters.
Misunderstanding the value of this in different contexts.
Using arrow functions as constructors—they cannot be called with new.
Nesting too many function calls without breaking them into smaller functions.
Always use parentheses when calling a function unless intentionally passing a reference.
Pass arguments in the correct order and type.
Break complex operations into smaller functions and call them as needed.
Understand the behavior of this when calling methods.
Use default or rest parameters to handle missing or variable arguments.
Calculating totals, averages, or other values dynamically.
Processing user input from forms or API responses.
Performing repeated operations using loops combined with function calls.
Executing callbacks in events or asynchronous operations.
Creating reusable utilities for formatting, sorting, or validating data.
A function call is the process of executing a defined function in JavaScript. Function calls allow you to pass arguments, receive return values, and execute reusable logic. Functions can be called directly, as object methods, through nested calls, or using call, apply, and bind for context-specific execution. Understanding how to call functions correctly ensures dynamic behavior, proper this binding, and maintainable, modular code. Mastery of function calls is essential for building scalable and efficient JavaScript applications.
Q1. Write a function sayName(greeting) that prints "greeting, my name is [this.name]". Use call() with { name: "Anjali" } and "Hello" as argument.
Q2. Create a function multiply(x, y) and call it using call() with null as this and numbers 4 and 5 as arguments.
Q3. Create two objects a and b. Let a have a method show() that prints this.value. Use call() to run a.show using b’s context.
Q4. Define a function introduce(city, country) and call it with call() using { name: "Meena" } and arguments "Mumbai", "India". Print a full sentence.
Q5. Create a function area(length, width) and invoke it with call() to calculate and log area of a rectangle.
Q6. Write a function describeRole() that logs this.name + " is a " + this.role. Use call() with two different objects.
Q7. Use a standalone function showBrand() and invoke it with call() using an object { brand: "Nike" } to print the brand.
Q8. Write a function sum(a, b, c) and use call() to pass the values 2, 3, 4 and log the result.
Q9. Create a method showDetails() in object user1 and use call() to reuse it for user2. Both objects should have name and age.
Q10. Create a function combine(first, second) and use call() with an object { separator: " & " } to print "first & second".
JS Basics
JS Variables & Operators
JS Data Types & Conversion
JS Numbers & Math
JS Strings
JS Dates
JS Arrays
JS Control Flow
JS Loops & Iteration
JS Functions
JS Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Web APIs
Web API Intro
Web Validation API
Web History API
Web Storage API
Web Worker API
Web Fetch API
Web Geolocation API
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Graphics & Charts
