Basic Functions

Program demonstrating function declarations and expressions

BeginnerTopic: Function Programs
Back

JavaScript Basic Functions Program

This program helps you to learn the fundamental structure and syntax of JavaScript programming.

Try This Code
// Method 1: Function Declaration
function greet(name) {
    return "Hello, " + name + "!";
}

console.log("Function declaration:", greet("John"));

// Method 2: Function Expression
const greet2 = function(name) {
    return "Hello, " + name + "!";
};

console.log("Function expression:", greet2("Jane"));

// Method 3: Arrow Function (ES6)
const greet3 = (name) => {
    return "Hello, " + name + "!";
};

console.log("Arrow function:", greet3("Bob"));

// Method 4: Arrow Function (one-liner)
const greet4 = name => "Hello, " + name + "!";

console.log("Arrow one-liner:", greet4("Alice"));

// Method 5: Function with default parameters
function greet5(name = "Guest") {
    return "Hello, " + name + "!";
}

console.log("\nWith default:");
console.log(greet5("Tom"));
console.log(greet5());

// Method 6: Function with multiple parameters
function calculate(a, b, operation = 'add') {
    switch(operation) {
        case 'add':
            return a + b;
        case 'subtract':
            return a - b;
        case 'multiply':
            return a * b;
        case 'divide':
            return a / b;
        default:
            return "Invalid operation";
    }
}

console.log("\nCalculate function:");
console.log("10 + 5 =", calculate(10, 5, 'add'));
console.log("10 - 5 =", calculate(10, 5, 'subtract'));
console.log("10 * 5 =", calculate(10, 5, 'multiply'));
console.log("10 / 5 =", calculate(10, 5, 'divide'));
Output
Function declaration: Hello, John!
Function expression: Hello, Jane!
Arrow function: Hello, Bob!
Arrow one-liner: Hello, Alice!

With default:
Hello, Tom!
Hello, Guest!

Calculate function:
10 + 5 = 15
10 - 5 = 5
10 * 5 = 50
10 / 5 = 2

Understanding Basic Functions

This program demonstrates different ways to define functions in JavaScript.

Method 1: Function Declaration

Traditional function:

function functionName(parameters) {
}

    // code
    return value;

Characteristics:

•Hoisted (can call before declaration)
•Has its own this context
•Can be used as constructor

Method 2: Function Expression

Assign function to variable:

const func = function(parameters) {
};

    // code

Characteristics:

•Not hoisted
•Anonymous function assigned to variable
•Can be reassigned

Method 3: Arrow Function

ES6 syntax:

const func = (parameters) => {
};

    // code
    return value;

Method 4: Arrow Function (One-liner)

Implicit return:

const func = parameter => expression;

Arrow Function Features:

•Shorter syntax
•No this binding (uses parent scope)
•Cannot be used as constructor
•Implicit return for single expressions

Method 5: Default Parameters

ES6 feature:

function func(param = defaultValue) {
}

    // code

When to Use:

-

Declaration

: General purpose, hoisting needed

-

Expression

: When reassignment needed

-

Arrow

: Modern, concise, no this binding

-

Default params

: Optional parameters

Function vs Arrow Function:

| Feature | Function | Arrow |

|---------|----------|-------|

| this binding | Own context | Parent scope |

| Hoisting | Yes | No |

| Constructor | Yes | No |

| Arguments | Yes | No |

| Syntax | Verbose | Concise |

Best Practices:

•Use arrow functions for callbacks
•Use declarations for main functions
•Use default parameters for optional args

Let us now understand every line and the components of the above program.

Note: To write and run JavaScript programs, you need to set up the local environment on your computer. Refer to the complete article Setting up JavaScript Development Environment. If you do not want to set up the local environment on your computer, you can also use online IDE to write and run your JavaScript programs.

Practical Learning Notes for Basic Functions

This JavaScript program is part of the "Function Programs" topic and is designed to help you build real problem-solving confidence, not just memorize syntax. Start by understanding the goal of the program in plain language, then trace the logic line by line with a custom input of your own. Once you can predict the output before running the code, your understanding becomes much stronger.

A reliable practice pattern is to run the original version first, then modify only one condition or variable at a time. Observe how that single change affects control flow and output. This deliberate style helps you understand loops, conditions, and data movement much faster than copying full solutions repeatedly.

For interview preparation, explain this solution in three layers: the high-level approach, the step-by-step execution, and the time-space tradeoff. If you can teach these three layers clearly, you are ready to solve close variations of this problem under time pressure.

Next
Callback Functions
Next
Callback Functions

Table of Contents