What is JavaScript?

JavaScript is the programming language of the web. HTML describes what is on a page and CSS describes how it looks; JavaScript decides what happens when someone uses it. This lesson explains where JavaScript runs, what it is good at, and how it fits alongside the languages you already know.

Three languages, three jobs

Every web page you visit is built from up to three languages, each with its own job:

Keeping these jobs separate makes pages easier to build and maintain. A well-built page still shows its content without JavaScript, then JavaScript adds behaviour on top. This approach is called progressive enhancement, and you will see it throughout the course.

What makes a page interactive

Without JavaScript, a browser can still do a lot. Links navigate, forms submit, details elements open and close, and CSS can react to hover and focus. JavaScript is what you reach for when the page itself needs to change in response to something:

• Responding to people. Filtering a list as someone types, showing the next quiz question, opening a menu.
• Checking input. Telling someone their password is too short before they submit, in plain words beside the field.
• Loading data. Fetching fresh prices or new comments without reloading the whole page.
• Remembering things. Saving a draft or a preference in the browser.
• Drawing and animating. Charts, games and visualisations.

All of this works the same way. The browser builds a live model of the page, called the DOM (Document Object Model), from your HTML. JavaScript reads and changes that model, and the browser updates the screen to match. You will learn the DOM properly in lesson 14; for now, picture it as a tree of objects, one for each element, that your code can talk to.

Here is a small taste of what that looks like. You do not need to understand it yet:

const button = document.querySelector("button");

button.addEventListener("click", () => {
  button.textContent = "Thanks!";
});

When the button is clicked, the code changes the button's text. Find an element, listen for something to happen, change the page: most front-end JavaScript follows that pattern.

Where JavaScript runs

JavaScript needs a program to run it, called a JavaScript engine. Every modern browser includes one:

• V8 in Chrome, Edge and other Chromium-based browsers
• SpiderMonkey in Firefox
• JavaScriptCore in Safari

The engine runs the language itself: variables, functions, maths, text. Everything to do with the page, such as document, buttons and clicks, comes from the environment the engine is running in. In a browser, that environment provides the DOM and other Web APIs for things like network requests, timers and storage.

Outside the browser

In 2009, Node.js took the V8 engine out of the browser and wrapped it in a different environment. Node.js has no document and no buttons. Instead it provides APIs for reading files, running web servers and talking to databases. Today JavaScript runs in many places:

• Browsers, for interactive pages and web apps
• Servers, with Node.js and similar runtimes such as Deno and Bun
• Build tools, which bundle, test and check front-end code
• Elsewhere, such as desktop apps and serverless functions

The core language is the same everywhere. What changes is the set of APIs around it. A loop or a function works identically in Chrome and in Node.js, but document.querySelector only exists in the browser. Keeping that split in mind will save you confusion when an example works in one place and not the other.

What ECMAScript means

You will see the name ECMAScript in documentation and in names such as "ES2015" or "ES6". ECMAScript is the official name of the language standard. JavaScript is the name everyone uses for the language that follows it.

The standard is maintained by a committee called TC39, made up of browser makers, companies and invited experts. They publish a new edition every year. Each edition adds a handful of features, and once a feature is in the standard, the browsers implement it.

A few names you will meet:

• ES5 (2009): the version most older tutorials use.
• ES2015, also called ES6: a large update that added let, const, arrow functions, classes, modules and promises. Most "modern JavaScript" starts here.
• ES2016 onwards: yearly editions, each named after its year.

Two promises make the yearly cycle safe. First, the web is never broken on purpose: old code keeps working, even code with known design mistakes. Second, new features only arrive once there are working implementations. So learning modern JavaScript does not mean throwing away what came before; it means having better tools available.

JavaScript is not Java

Despite the name, JavaScript has nothing to do with the Java programming language. The name was a marketing decision in 1995, when Java was fashionable. The two languages look a little alike, because both borrow their curly-brace syntax from C, but they work differently and are used for different things.

What JavaScript is like as a language

A few traits will shape how you write it:

• Dynamically typed. You do not declare whether a variable holds a number or text. The type belongs to the value, and a variable can hold any type. This is flexible but means some mistakes only show up when the code runs.
• Interpreted and compiled on the fly. You do not compile JavaScript yourself. The engine reads your source code and compiles it while the page runs.
• Single-threaded with an event loop. JavaScript runs one piece of code at a time. Slow work such as network requests happens in the background and your code is told when it finishes. You will learn how this works in the asynchronous lessons.
• Functions are values. You can store a function in a variable and pass it to another function, as the click example above does. This idea appears everywhere in JavaScript.

When not to use JavaScript

Good developers know when to leave JavaScript out. Use HTML and CSS when they can do the job:

• A link that goes to another page should be an a element, not a button with a script.
• A form can submit and validate basic input with HTML attributes alone.
• Hover effects, transitions and many animations belong in CSS.
• A disclosure widget can be a details element.

Native HTML is faster, works before scripts load, and is accessible by default. JavaScript is for the behaviour HTML and CSS cannot provide. Every script you add is code that must be downloaded, run and maintained, and if it fails, the page should still work.

What you need for this course

You need a modern browser such as Chrome, Firefox, Safari or Edge, and a code editor such as VS Code. Node.js is optional but useful for running examples outside the browser. The next lesson shows you three ways to run JavaScript: in the browser console, in a page with a script element, and with Node.js.

Summary

• HTML provides structure, CSS provides presentation and JavaScript provides behaviour.
• JavaScript makes pages interactive by reading and changing the DOM, the browser's live model of the page.
• A JavaScript engine runs the language; the environment, such as a browser or Node.js, supplies extra APIs.
• ECMAScript is the official standard. TC39 publishes a new edition every year, and old code keeps working.
• JavaScript is not related to Java.
• Use HTML and CSS first, and add JavaScript for behaviour they cannot provide.