JavaScript basics for the web

JavaScript is the only programming language that runs natively in web browsers, which makes it the language of interactive websites. Everything that moves on this very page is JavaScript. You can try it right now: open your browser's developer tools (F12) and type into the Console.

Variables and text

Use let for a value that can change and const for one that can't. Text (a “string”) goes in quotes, and backticks let you drop values straight into text with ${…}.

const name = "Sepehr";
let visits = 3;
visits = visits + 1;
console.log(`${name} visited ${visits} times`);

Functions

A function is a named block of code that takes inputs and gives back a result. It lets you write something once and use it many times.

function area(width, height) {
  return width * height;
}
console.log(area(4, 5)); // 20

Making the page react

JavaScript's real job in a browser is to respond to the user. You find an element on the page and tell it what to do when something happens — here, when a button is clicked.

const button = document.querySelector("#hello");
button.addEventListener("click", () => {
  alert("You clicked me!");
});