What is JavaScript?

In short: a web page is built from three layers, each in its own language. HTML says what exists, CSS says how it looks, and JavaScript says what happens. JavaScript is a full programming language — variables, conditions, loops, functions, objects — and despite the name it is unrelated to Java. It runs inside every browser, and outside browsers too, through runtimes such as Node.js. It is also dynamically typed: a variable can hold a number now and text a moment later.

Sort a play button into its layers

You open a music site, press Play, and the button turns into Pause while a progress bar starts moving. Nothing reloaded — something inside the page noticed the click and reacted. Split what you see by asking one question for each piece: is this a thing, a look, or an action?

• The button existing at all, with the label "Play" — a thing — is HTML.
• Round, green, growing slightly on hover — a look — is CSS.
• Noticing the click and starting the song — an action — is JavaScript.

A listener is just a function that runs when something happens. Here it is without the real browser wiring, so you can run it:

Remove the JavaScript and the button still appears, and still looks green — it simply does nothing when clicked. The thing and the look survive without the action layer; the action never survives without the other two, since it has nothing to react to.

A variable that changes its type

JavaScript never asks you to declare "this variable holds a number". The value carries its own type, and a variable can point at a different kind of value later — this is what "dynamically typed" means:

Both lines run without error. A language such as Java would refuse the second assignment at compile time; JavaScript simply allows it. This is convenient, but it is also why typos and unexpected values travel further before they cause a problem — a running theme in the Data Types section.

Not Java, and not only for small effects

The similar name was a 1995 marketing choice, made while Java was fashionable; the two languages were designed independently and share almost nothing beyond curly braces. And JavaScript has grown far past decorating pages — entire applications such as online code editors, maps and chat apps run mostly in JavaScript. The three-layer split still holds; the action layer has simply grown enormous.

Quick practice

🎯 Your turn

A playlist page shows a list of songs, highlights the current song in bold orange, and moves to the next song automatically when one ends. Sort each part into HTML, CSS or JavaScript, and explain your reasoning using the thing / look / action split.

Write your explanation and submit it — there's no code to run here, just your reasoning.