Control Structures and Functions

Welcome to this lesson on control structures and functions in JavaScript! As a Python developer, you’ll find many familiar concepts here, but with some key differences in syntax and behavior. Let’s explore how JavaScript handles flow control and function declarations, comparing them to what you’re used to in Python.

Control Structures

If/Else Statements

While the concept of if/else statements is the same in JavaScript and Python, the syntax differs slightly:

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

In Python, you use colons and indentation to define blocks, but in JavaScript, we use curly braces {}. Also, conditions in JavaScript are always enclosed in parentheses.

Switch Statements

JavaScript has a switch statement, which doesn’t exist in Python. It’s useful for multiple condition checking:

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

This is somewhat similar to using multiple elif statements in Python, but can be more readable for certain types of comparisons.

Loops

JavaScript has several types of loops, some similar to Python and some unique:

For Loop

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

This is similar to Python’s range-based for loop, but with a different syntax.

While Loop

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

This is very similar to Python’s while loop.

Do-While Loop

JavaScript has a do-while loop, which Python doesn’t have:

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

This loop always executes at least once, even if the condition is false.

Iterating Over Arrays and Objects

JavaScript uses for...of for iterables (like arrays) and for...in for object properties:

// JavaScript
// For arrays (similar to Python's for item in list)
const arr = [1, 2, 3];
for (const item of arr) {
    console.log(item);
}

// For objects (similar to Python's for key in dict)
const obj = { a: 1, b: 2, c: 3 };
for (const key in obj) {
    console.log(key, obj[key]);
}

Functions

Function Declaration

In JavaScript, you can declare functions in several ways:

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

// Function expression
const greet = function(name) {
    return `Hello, ${name}!`;
};

// Arrow function (ES6+)
const greet = (name) => {
    return `Hello, ${name}!`;
};

// Shorthand arrow function (for single expressions)
const greet = name => `Hello, ${name}!`;

Arrow functions are a concise way to write functions, similar to Python’s lambda functions but more versatile.

Default Parameters

JavaScript supports default parameters, similar to Python:

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

Rest Parameters

JavaScript’s rest parameters are similar to Python’s *args:

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

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

Conclusion

In this lesson, we’ve covered the basics of control structures and functions in JavaScript, highlighting the similarities and differences with Python. You’ve learned about if/else statements, the switch statement, various types of loops, and different ways to declare and use functions in JavaScript.

In the next lesson, we’ll dive into Arrays and Objects in JavaScript, exploring how they compare to Python’s lists and dictionaries. We’ll look at various methods for manipulating these data structures and introduce concepts like destructuring, which can make your code more concise and readable.