• Hajipur, Bihar, 844101

☰
❮
❯

JavaScript

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 Objects

JS Classes & Modules

JS Async Programming

JS Advanced

JS HTML DOM

JS BOM (Browser Object Model)

JS Web APIs

JS AJAX

JS JSON

JS Graphics & Charts

JavaScript

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 Objects

JS Classes & Modules

JS Async Programming

JS Advanced

JS HTML DOM

JS BOM (Browser Object Model)

JS Web APIs

JS AJAX

JS JSON

JS Graphics & Charts

Function Definitions

← Previous Next →

📘 JavaScript Function Definitions – 4 Powerful Ways to Define Functions

JavaScript supports multiple ways to define a function. Each has its own use-case, scope rules, and behavior.

🔹 1. Function Declaration (Function Statement)

✅ Most common way to define a named function.

function greet(name) {
  return "Hello, " + name;
}

  • Hoisted (can be used before it’s defined).

  • Can be reused multiple times.

🔹 2. Function Expression

✅ A function assigned to a variable.

const add = function(a, b) {
  return a + b;
};

  • Not hoisted.

  • Useful when passing functions as values (like in callbacks).

🔹 3. Arrow Function (ES6+)

✅ Shorter syntax and no own this.

const multiply = (x, y) => x * y;

  • Ideal for one-liners or functional programming.

  • Cannot be used as constructors.

  • No arguments object or this binding.

🔹 4. Function Constructor

✅ Rarely used; not recommended due to security and performance concerns.

const subtract = new Function("a", "b", "return a - b");
console.log(subtract(10, 5)); // Output: 5

🔹 Named vs Anonymous Functions

  • Named function has a name: function sayHi() {}

  • Anonymous function does not have a name: function() {}

Often used in expressions or as arguments to other functions.

🔹 Example Comparison

// Declaration
function square(x) {
  return x * x;
}

// Expression
const squareExpr = function(x) {
  return x * x;
};

// Arrow
const squareArrow = x => x * x;

Practice Questions

Q1. What is a function declaration and how is it different from a function expression?

Q2. How do arrow functions handle the this keyword differently than regular functions?

Q3. What is a function expression and when should you use it?

Q4. Can a function expression be named? Show an example.

Q5. Write a function using all three: declaration, expression, and arrow syntax for adding two numbers.

Q6. Is a function declaration hoisted in JavaScript? Explain with an example.

Q7. What is the purpose of the Function constructor, and why is it rarely used?

Q8. What are the risks of using the Function constructor in JavaScript?

Q9. Can an arrow function be used as a constructor? Why or why not?

Q10. Write an arrow function that returns the square of a number, and a function expression that returns its cube.

Function Definitions Quiz

Q1: Which is a function declaration?

A. const x = function() {}
B. function x() {}
C. () => {}
D. new Function()

Q2: Which function type is hoisted?

A. Arrow function
B. Function expression
C. Function declaration
D. All of the above

Q3: Which function type does NOT have its own this?

A. Function declaration
B. Function expression
C. Arrow function
D. All have their own this

Q4: What is a valid arrow function syntax?

A. x => return x * 2;
B. x => x * 2
C. x -> x * 2
D. arrow(x) => x * 2

Q5: Which function type is commonly used in callbacks and event handlers?

A. Function constructor
B. Arrow function
C. Named function declaration
D. Anonymous function expression

Q6: Can a function expression be anonymous?

A. No
B. Yes
C. Only in ES6
D. Only if assigned to a variable

Q7: Which of the following is discouraged for defining functions due to security risks?

A. Arrow function
B. Function expression
C. Function constructor
D. Function declaration
← Previous Next →
Login
Go Back Top