Welcome to the world of JavaScript! If you're looking to learn the basics of JavaScript, you're in the right place. JavaScript is a versatile programming language that powers the web. Let's dive in and explore the fundamentals.

Getting Started

Before you start writing JavaScript code, make sure you have a text editor installed. You can use any text editor of your choice, such as Visual Studio Code, Sublime Text, or Atom. Once you have your text editor ready, create a new file and save it with a .html extension, for example, index.html.

Here's a simple HTML structure to get you started:

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript Basics</title>
</head>
<body>
  <h1>Hello, World!</h1>
  <script>
    // JavaScript code goes here
  </script>
</body>
</html>

In this example, we have an HTML file with a <script> tag. This is where you will write your JavaScript code.

Variables

One of the first things you'll learn about JavaScript is variables. Variables are used to store data values. In JavaScript, you can declare a variable using the var, let, or const keyword.

var message = "Hello, World!";
let name = "Alice";
const pi = 3.14159;

Data Types

JavaScript has several data types, including:

  • String: Represents text, such as "Hello, World!".
  • Number: Represents numerical values, such as 42 or 3.14.
  • Boolean: Represents a true or false value, such as true or false.
  • Object: Represents a collection of key-value pairs, such as { name: "Alice", age: 25 }.
  • Array: Represents a list of values, such as [1, 2, 3, 4, 5].

Loops

Loops are used to repeat a block of code multiple times. In JavaScript, you can use the for, for...in, for...of, while, or do...while loops.

Here's an example of a for loop that prints the numbers from 1 to 5:

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

Functions

Functions are blocks of code that can be executed multiple times. To create a function in JavaScript, you use the function keyword followed by a name and a set of parentheses.

function greet(name) {
  console.log(`Hello, ${name}!`);
}

greet("Alice"); // Output: Hello, Alice!

DOM Manipulation

One of the most powerful features of JavaScript is its ability to manipulate the Document Object Model (DOM). The DOM represents the structure of an HTML document and allows you to modify its content.

For example, you can use JavaScript to change the text of an element:

let heading = document.querySelector("h1");
heading.textContent = "Welcome to JavaScript!";

Learn More

To continue learning JavaScript, I recommend checking out our JavaScript Advanced course.

Images