Control Structures and Functions

In this lesson, we’ll explore how JavaScript handles control structures and functions, comparing them to their Java counterparts. While you’ll find many similarities, JavaScript introduces some unique features and syntax that can enhance your coding flexibility.

Control Structures

If/Else Statements

JavaScript’s if/else statements are syntactically similar to Java:

// JavaScript
if (condition) {
    // code block
} else if (anotherCondition) {
    // code block
} else {
    // code block
}

However, JavaScript also offers the ternary operator, which provides a concise way to write simple if/else statements:

// JavaScript
let result = condition ? valueIfTrue : valueIfFalse;

Switch Statements

Switch statements in JavaScript are similar to Java, but with a key difference:

// JavaScript
switch (expression) {
    case value1:
        // code block
        break;
    case value2:
        // code block
        break;
    default:
        // code block
}

Note: In JavaScript, if you omit the break statement, execution will “fall through” to the next case, which can lead to unexpected behavior. This is different from Java, where omitting a break statement results in a compilation error.

Loops

JavaScript supports familiar loop structures:

// JavaScript
// For loop
for (let i = 0; i < 5; i++) {
    console.log(i);
}

// While loop
let i = 0;
while (i < 5) {
    console.log(i);
    i++;
}

// Do-while loop
let j = 0;
do {
    console.log(j);
    j++;
} while (j < 5);

JavaScript also introduces the for...of loop, which is similar to Java’s enhanced for loop:

// JavaScript
let array = [1, 2, 3, 4, 5];
for (let value of array) {
    console.log(value);
}

Functions

Functions in JavaScript are more flexible than methods in Java. They are first-class citizens, meaning they can be assigned to variables, passed as arguments, and returned from other functions.

Function Declaration

The basic syntax for declaring a function is:

// JavaScript
function functionName(parameter1, parameter2) {
    // function body
    return result;
}

Function Expressions

Functions can also be assigned to variables:

// JavaScript
let greet = function(name) {
    return `Hello, ${name}!`;
};

This is a key difference from Java, where methods must be declared within a class.

Arrow Functions

ES6 introduced arrow functions, a concise syntax for writing function expressions:

// JavaScript
let greet = (name) => `Hello, ${name}!`;

// With multiple statements
let greetFormal = (name) => {
    let greeting = `Hello, ${name}!`;
    return `${greeting} How may I assist you?`;
};

Arrow functions have a shorter syntax and lexically bind this, which can be particularly useful in callback scenarios.

Default Parameters

JavaScript allows you to set default values for function parameters:

// JavaScript
function greet(name = "Guest") {
    return `Hello, ${name}!`;
}

console.log(greet()); // Outputs: "Hello, Guest!"
console.log(greet("Alice")); // Outputs: "Hello, Alice!"

Rest Parameters

The rest parameter syntax allows a function to accept an indefinite number of arguments as an array:

// JavaScript
function sum(...numbers) {
    return numbers.reduce((total, num) => total + num, 0);
}

console.log(sum(1, 2, 3, 4)); // Outputs: 10

This is similar to Java’s varargs, but with a different syntax.

Conclusion

In this lesson, we’ve explored how JavaScript handles control structures and functions. While many concepts are similar to Java, JavaScript offers additional flexibility with features like arrow functions, default parameters, and rest parameters. These features, combined with JavaScript’s treatment of functions as first-class citizens, open up new possibilities for writing concise and expressive code.

In the next lesson, we’ll dive into Arrays and Objects in JavaScript, exploring how these fundamental data structures differ from their Java counterparts and the powerful methods JavaScript provides for working with them.