Home › Courses › Function Declaration - Hoisting, Parameters vs Arguments, Rest

Function Declaration - Hoisting, Parameters vs Arguments, Rest

35 / 57

What is Function Declaration?

  1. Function declaration is the most common way to create a function in JavaScript.
  2. It uses:
  3. function keyword
  4. function name
  5. parameters (optional)
  6. curly braces {}

Example


function fruit(item){
console.log(item);
}

fruit("apple");

  1. "apple" is passed → output will be: apple


Hoisting in JavaScript

  1. Function declarations are hoisted.
  2. This means:
  3. You can call a function before declaring it

fruit("apple");

function fruit(item){
console.log(item);
}

  1. Function declarations are moved to the top during execution.


Variable vs Function (Hoisting Difference)


console.log(x);
let x = "Anil Sidhu";

  1. This gives an error

But function works:


fruit("apple");

function fruit(item){
console.log(item);
}


Type of Function


console.log(typeof fruit);

Output: "function"


Instance Check


console.log(fruit instanceof Object);

Output: true


console.log(fruit instanceof String);

Output: false


Parameter vs Argument


function fruit(item){ // parameter
console.log(item);
}

fruit("apple"); // argument

  1. Parameter → variable inside function (item)
  2. Argument → value passed ("apple")


Default Parameter


function fruit(item, item2="no other fruit"){
console.log(item, item2);
}


fruit("apple");

Output:

apple no other fruit


fruit("apple", "banana");

Output:

apple banana


Multiple Arguments Problem


fruit("apple","banana","orange","pineapple");

If function is:


function fruit(item){
console.log(item);
}

Only "apple" will be used.


Rest Operator


function fruit(...items){
console.log(items);
}

Output:

["apple","banana","orange","pineapple"]

Access values:


console.log(items[0]); // apple
console.log(items[1]); // banana


Check Number of Parameters


function fruit(item,a,b,c){
console.log(item);
}

console.log(fruit.length);

Output: 4


Final Example (From Your Code)


function fruit(item,a,b,c){ // parameter
console.log(item);
}

console.log(fruit.length);

fruit("apple","banana","orange","pineapple") // argument


Share this lesson: