What Is JavaScript? How It Runs in the Browser, ECMAScript and Your First Line

Version note: The code in this post targets ES2026 and current browsers (Chrome, Edge, Firefox, Safari).

Predict First

Before explaining anything, let's start with a small question. What do the two lines below print to the console?

console.log(2 + 2);
console.log("2" + 2);

Make a guess before you keep reading and keep it in the back of your mind. We will see the answer halfway through the post, when we run it together in your own browser. We'll use this habit a lot throughout the series: predict first, then try, then explain. When your guess is right, the knowledge sticks; when it's wrong, you never forget that topic again.

The Three Layers of a Web Page

Think of a web page as a house. HTML is the skeleton: walls, doors, rooms. CSS is the paint, the furniture, the lighting; it makes the house look good. JavaScript is the electrical wiring. It is what makes the light turn on when you flip the switch, the door open when someone rings, the thermostat react to the temperature.

In other words, JavaScript is the language that gives a page behavior. A menu opening when a button is clicked, an email address being checked before a form is sent, new products appearing in a list without reloading the page: all of that is JavaScript's job. HTML and CSS on their own are static; the moment JavaScript steps in, the page starts responding to the user.

A Short History: The Language Written in Ten Days

JavaScript was designed in 1995 by Brendan Eich at Netscape, reportedly in about ten days. The "Java" in its name was purely a marketing decision; apart from the similar name it has almost nothing in common with Java. It is still one of the most persistent sources of confusion in the software world.

The language spread quickly, and once different browsers started adding their own interpretations, a standard was needed. That standard is called ECMAScript. In short, JavaScript is the everyday name of the language that implements the ECMAScript standard. When you hear that a feature "came with ES2015" or "was added in ES2023," it refers to that year's edition of the standard.

ECMAScript and TC39: How the Language Evolves

The standard is managed by a committee called TC39. Browser vendors, large companies and independent experts meet in this committee. A new feature starts as a proposal, matures stage by stage, and once it reaches the final stage it goes into that year's edition.

Since 2015 a new edition has been published every year. ES2015 (also known as ES6) was a major update that changed the face of the language; things we use every day, such as let, const, arrow functions, classes and modules, arrived with it. The editions of the following years took smaller but steady steps. At the time of writing, the latest edition is ES2026, approved in June 2026.

This has a practical benefit for you: if you know which edition a feature came with and whether browsers support it before you use it, you avoid writing code that breaks for some of your users. Throughout the series, whenever we touch a new feature, we will also mention which edition it belongs to.

The Engine: Who Runs Your Code?

To understand JavaScript, the browser carries a JavaScript engine inside it. Chrome and Edge run V8, Firefox runs SpiderMonkey, and Safari runs JavaScriptCore. The engine's job is to read the text you write, turn it into instructions the machine understands, and run them.

Modern engines are remarkably smart. They start running the code quickly, notice which parts run often, and compile those parts into faster machine code in the background. This is called JIT (Just-In-Time) compilation. Thanks to it, JavaScript started out as an interpreted language and has become quite performant today. We will dig into what happens inside the engine, with concepts like the call stack and the event loop, in upcoming posts.

A small note: JavaScript doesn't live only in the browser. Thanks to the V8 engine, the same language can also run on the server; we do that with Node.js, and we will cover it in a separate series. In this series our focus is JavaScript itself and its life in the browser.

Your First Line: The Browser Console

You don't need to install anything to start writing JavaScript. The browser on your computer is already a JavaScript environment. On any page, open the developer tools: F12 or Ctrl+Shift+J on Windows and Linux, Cmd+Option+J on macOS. Switch to the Console tab in the panel that opens. The blinking cursor at the start of the line is where you can talk to the engine directly.

Paste this into the console and press Enter:

console.log("Hello JavaScript!");

You'll see your message printed below. console.log is a function that prints whatever value you give it to the console, and it will be your best friend throughout this series. Now let's go back to the opening question; paste both lines into the console:

console.log(2 + 2);   // 4
console.log("2" + 2); // "22"

The first line is 4, as you'd expect. The second is 22. The "2" in quotes is not a number but a piece of text (a string). When JavaScript meets a string and a number with +, instead of adding them it puts them side by side. This behavior is called type coercion, the automatic conversion of types. It is one of the most surprising sides of JavaScript, and we'll cover it in full detail in the post on operators.

Let's Play in the Console a Bit More

The console also works like a calculator. If you enter an expression without console.log, it shows the result directly:

10 * 3
"Java" + "Script"
Math.max(4, 19, 7)

You'll see 30, "JavaScript" and 19 in turn. Now try this:

document.title

Out comes the title of the open page. document is the object the browser gives you to represent the current page. Now a slightly bolder line:

document.body.style.background = "gold";

The page background turned gold. Don't worry, everything goes back to normal when you reload the page; the change only applies in your browser and only for that moment. But you just changed a web page live with JavaScript. We will learn this structure, which we call the DOM, step by step in upcoming posts.

How These Series Will Unfold

We teach JavaScript in three series. In the Basics series we learn the building blocks of the language: variables, data types, operators, conditions, loops, strings, arrays, functions, objects and JSON. Then we move to the browser and build our first interactive pages with the DOM, events, forms and browser objects.

In the Intermediate series we cover modern syntax, deep language concepts such as closures and this, classes, and asynchronous programming, meaning promises, async/await and the Fetch API. In the Advanced series we go down to prototypes, the inner workings of the event loop, memory management, performance, Web Workers and Web Components.

In every post we want you to run the examples in your own browser. Reading is one thing; running and breaking things with your own hands is something else entirely.

A Small Experiment

★☆☆ Open the console and use console.log to print your name, your age and your favorite city separately. Then print all three in a single console.log, separated by commas, and notice the difference in the output.

★★☆ Predict before running, then try: "5" - 2, "5" + 2, "5" * "2". We saw that the string wins in addition; what happens with subtraction and multiplication? Which of your guesses were right?

★★☆ Open the console on a site you like and type document.title = "My Page". Look at the title in the browser tab. Then reload the page and explain in your own words why it went back to how it was.

The console is great for experiments, but the code of a real page lives in a file. In the next post we'll see how to connect JavaScript to an HTML file, the difference between defer and async, and our first step into debugging with the developer tools.