JavaScript Syntax & Statements

JavaScript is a versatile programming language that powers web development, server-side applications, and more. Understanding its syntax rules and statements is crucial for writing effective and error-free code. In this tutorial, we will explore the basics of JavaScript syntax, including semicolons, whitespace, and overall code structure.

Introduction

JavaScript syntax defines the rules and structures that make up a valid JavaScript program. Proper syntax ensures that your code is executed correctly by the JavaScript engine. Whether you're writing simple scripts or complex applications, mastering JavaScript syntax will help you write cleaner, more maintainable code.

In this tutorial, we'll cover:

• Basic syntax rules
• Statements in JavaScript
• The use of semicolons
• Importance of whitespace and formatting

By the end of this tutorial, you'll have a solid understanding of how to structure your JavaScript code effectively.

Core Content

Basic Syntax Rules

JavaScript follows a set of basic syntax rules that dictate how code should be written. These rules ensure consistency across different JavaScript environments and make it easier for developers to read and maintain code.

Variable Declaration

Variables are declared using the let, const, or var keywords. Here's an example:

1let x = 10;
2const y = 20;
3var z = 30;

Data Types

JavaScript supports several data types, including numbers, strings, booleans, objects, arrays, and more. Here are some examples:

1let num = 42; // Number
2let str = "Hello"; // String
3let bool = true; // Boolean
4let obj = { key: "value" }; // Object
5let arr = [1, 2, 3]; // Array

Statements

Statements are the building blocks of JavaScript programs. They perform actions and control the flow of execution. Here are some common types of statements:

Conditional Statements

Conditional statements like if, else if, and else allow you to execute code based on certain conditions.

1let age = 18;
2 
3if (age >= 18) {
4  console.log("You are an adult.");
5} else if (age >= 13) {
6  console.log("You are a teenager.");
7} else {
8  console.log("You are a child.");
9}

You are an adult.

Loop Statements

Loop statements like for, while, and do...while allow you to repeat code execution.

1for (let i = 0; i < 5; i++) {
2  console.log(i);
3}

0
1
2
3
4

Semicolons

Semicolons are used to terminate statements in JavaScript. While they are optional due to automatic semicolon insertion (ASI), it's a good practice to include them for clarity and to avoid potential errors.

1let x = 10;
2let y = 20;
3let sum = x + y;
4console.log(sum);

Whitespace and Formatting

Whitespace, including spaces, tabs, and newlines, is used to improve code readability. JavaScript engines ignore extra whitespace, but consistent formatting helps maintain clean and organized code.

1function add(a, b) {
2  return a + b;
3}
4 
5let result = add(5, 3);
6console.log(result); // Output: 8

Code Structure

JavaScript code is typically structured into functions, loops, and conditional statements. Proper structure makes your code easier to understand and maintain.

1function greet(name) {
2  if (name) {
3      console.log("Hello, " + name + "!");
4  } else {
5      console.log("Hello, Guest!");
6  }
7}
8 
9greet("Alice");
10greet();

Hello, Alice!
Hello, Guest!

Practical Example

Let's create a simple JavaScript program that calculates the factorial of a number. This example will demonstrate basic syntax rules, statements, and code structure.

1function factorial(n) {
2  if (n < 0) {
3      return "Factorial is not defined for negative numbers.";
4  } else if (n === 0 || n === 1) {
5      return 1;
6  } else {
7      let result = 1;
8      for (let i = 2; i <= n; i++) {
9          result *= i;
10      }
11      return result;
12  }
13}
14 
15console.log(factorial(5)); // Output: 120
16console.log(factorial(-3)); // Output: Factorial is not defined for negative numbers.

120
Factorial is not defined for negative numbers.

Summary

In this tutorial, we covered the fundamental syntax rules and statements in JavaScript. Key points include:

• Variable declaration using let, const, and var.
• Basic data types like numbers, strings, booleans, objects, and arrays.
• Conditional and loop statements for controlling code flow.
• The importance of semicolons for statement termination.
• Whitespace and formatting for better readability.
• Proper code structure using functions, loops, and conditionals.

Mastering these basics will help you write clean, efficient, and error-free JavaScript code.

What's Next?

In the next tutorial, we'll explore how to add comments to your JavaScript code. Comments are essential for documenting your code and making it easier for others (and yourself) to understand in the future.

Stay tuned!