πŸ“˜ JavaScript Function Call

βœ… 1. What Is a Function Call?

A function call executes the code inside a function definition.

jsCopyEditfunction greet() {
  console.log("Hello!");
}

greet(); // πŸ‘ˆ This is a function call

πŸ“Œ 2. Calling a Function with Arguments

Functions can accept parameters when called:

jsCopyEditfunction add(a, b) {
  return a + b;
}

console.log(add(2, 3)); // 5
  • a and b are parameters
  • 2 and 3 are arguments

πŸ“Œ 3. Calling a Function Stored in a Variable

jsCopyEditconst sayHi = function() {
  console.log("Hi!");
};

sayHi(); // Function call

πŸ“Œ 4. Calling Arrow Functions

jsCopyEditconst double = x => x * 2;

console.log(double(5)); // 10

πŸ“Œ 5. Function Call Inside Another Function

jsCopyEditfunction multiply(x, y) {
  return x * y;
}

function square(n) {
  return multiply(n, n);
}

console.log(square(4)); // 16

πŸ“Œ 6. Method Call (Function inside an Object)

jsCopyEditconst person = {
  name: "Alice",
  greet: function() {
    console.log("Hello, my name is " + this.name);
  }
};

person.greet(); // "Hello, my name is Alice"

πŸ“Œ 7. Function Call with call() and apply()

Used to control the this value during a call.

jsCopyEditfunction showName() {
  console.log(this.name);
}

const user = { name: "Bob" };

showName.call(user);  // "Bob"
showName.apply(user); // "Bob"

call(arg1, arg2, ...) passes arguments individually
apply(arg1, [arg2, arg3]) passes arguments as an array


πŸ“Œ 8. Function Call with bind()

Returns a new function with this fixed.

jsCopyEditconst user = { name: "Dana" };

function introduce() {
  console.log("I am " + this.name);
}

const boundIntro = introduce.bind(user);
boundIntro(); // I am Dana

πŸ“Œ 9. Self-Invoking Function (IIFE)

jsCopyEdit(function() {
  console.log("Runs immediately!");
})();

πŸ“Œ 10. Callback Function Calls

Passing a function as a value to another function.

jsCopyEditfunction process(callback) {
  callback();
}

process(function() {
  console.log("Callback was called!");
});

πŸ§ͺ Practice Tasks

  1. Create a function welcome(name) that returns "Welcome, <name>".
  2. Create an object car with a method start() that prints "Engine started".
  3. Use call() to call a function with a custom object as this.

🧠 Quick Recap Table

Call TypeExamplethis Value
Regular callmyFunc()undefined or window
Method callobj.method()obj
call()func.call(obj)obj
apply()func.apply(obj)obj
bind()func.bind(obj)Returns new function with bound this
IIFE(function() {})()Immediate execution

Would you like this tutorial in:

  • πŸ“„ PDF format for printing/studying?
  • πŸ’» Live example playground (CodePen, JSFiddle)?
  • 🧠 Practice quiz?