<< Home

Chapter 1: Introduction to JavaScript

JavaScript is one of the most influential programming languages ever created. It began in 1995 when Netscape engineer Brendan Eich was tasked with adding a lightweight scripting language to the web browser. The result was a simple language designed to make web pages more dynamic and interactive. Though it started small, JavaScript quickly became an essential part of the web’s foundation, alongside HTML and CSS.

In its early years, JavaScript was mainly used to add basic effects such as image rollovers, simple validation, and pop-ups. Over time, as browsers improved and standardisation arrived through the ECMAScript specification, the language evolved into a robust, full-featured tool. Each new version brought refinements and features that made JavaScript faster, more reliable, and easier to use for complex applications.

Today, JavaScript is everywhere. It runs in every major web browser, on almost every device, and even on servers. Thanks to Node.js, developers can use JavaScript not just for front-end interfaces but also for backend logic, APIs, and command-line tools. This single-language approach allows entire systems to be built using the same core language from end to end.

One reason for JavaScript’s continuing popularity is the rich ecosystem that has grown around it. Frameworks such as React, Vue, and Angular simplify the creation of complex interfaces, while libraries like Express make building server applications straightforward. Package managers such as npm provide access to millions of reusable components, encouraging fast and efficient development.

Another strength is JavaScript’s constant evolution. The ECMAScript standard is updated regularly, introducing features such as arrow functions, classes, modules, async programming, and pattern matching. These improvements keep the language modern and expressive while remaining compatible with older code. Few languages have managed to grow so rapidly without losing their core simplicity.

💡 JavaScript’s flexibility means you can use it in many ways: to build websites, automate tasks, write games, or power entire applications. It rewards curiosity and experimentation.

Because JavaScript runs in browsers by default, it has become the most accessible language for new programmers. You can start experimenting immediately in your browser’s developer console, or install Node.js to run scripts locally. Whether you are creating a small interactive feature or building a large-scale web application, JavaScript adapts easily to your needs.

In this chapter, we will look at what JavaScript is today, how it runs in different environments, and how to execute simple code examples yourself. By understanding its origins and the forces that shaped it, you will be better prepared to explore its syntax, structure, and unique features in the chapters that follow.

⚠️ The name “JavaScript” is historical. Despite sounding similar, it has no real connection to Java. The similarity was originally a marketing decision from the 1990s.

Who this book is for

This book is for anyone who wants to learn JavaScript in a clear and straightforward way. It avoids unnecessary jargon and long-winded explanations, focusing instead on what the language does and how to use it effectively. Each topic is presented simply, with examples that can be understood without any prior experience of web development.

If you already know another programming language, you will find many familiar concepts here. Variables, loops, functions, and data structures all exist in JavaScript, though often with their own syntax and behaviour. The book highlights these differences so you can quickly adapt your existing knowledge to JavaScript’s style.

For those new to programming, JavaScript is a friendly place to start. You can try code instantly in your browser, see the results immediately, and make changes without installing complex tools. The examples are short, the explanations are direct, and everything builds step by step from first principles to more advanced features.

JavaScript also suits anyone who wants to understand how the modern web works. It is the language that drives interactivity in browsers and increasingly powers the backend through Node.js. Whether your goal is to write front-end scripts, automate simple tasks, or build complete web applications, this book provides the foundation you need.

By the end of the book you will be able to read, write, and reason about JavaScript with confidence. You will understand its syntax, its key features, and its modern capabilities, and be ready to explore frameworks, libraries, or more advanced tools if you wish.

💡 The only things you need to follow along are a browser, a text editor, and curiosity. Everything else can be learned as you go.

What JavaScript is today

Modern JavaScript is the result of almost three decades of steady growth and refinement. What began as a small browser scripting tool has become a mature, general-purpose programming language. Its official name is ECMAScript, a standard maintained by the ECMA International organization, which ensures that JavaScript behaves consistently across browsers and environments.

The ECMAScript specification defines the syntax, data types, operators, and core features that make up the language. The name “JavaScript” refers to the common implementation of this standard in browsers and other platforms. Each new version of ECMAScript adds features that make the language cleaner, safer, and more powerful, while preserving compatibility with older code so that decades of existing scripts still run correctly.

Significant milestones include ES5 (released in 2009), which stabilised the language and introduced strict mode, and ES6 (formally called ECMAScript 2015), which brought major improvements such as classes, arrow functions, modules, promises, and template literals. Since then, new versions have appeared yearly, introducing smaller but important updates like optional chaining, nullish coalescing, and pattern matching.

⚠️ Not every browser or runtime supports the latest features immediately. Tools such as Babel can translate modern syntax into older JavaScript for full compatibility.

This continuous evolution keeps JavaScript modern without forcing constant rewrites. Developers can gradually adopt new features as needed, confident that older syntax remains supported. The result is a language that feels both familiar and forward-looking—a rare combination in software development.

Although the ECMAScript specification defines the language itself, real-world JavaScript also includes APIs provided by the environments where it runs. In browsers, these include the Document Object Model (DOM) for interacting with web pages, and in Node.js, modules for file handling, networking, and system access. Together they extend JavaScript far beyond its original role as a simple scripting tool.

💡 When you see “ES6,” “ES2015,” or “ECMAScript,” they all refer to the same standard. Each year’s version adds refinements, but JavaScript remains the familiar language developers know.

Where JavaScript runs

JavaScript originally ran only inside web browsers, where it allowed developers to add interactivity to otherwise static pages. Each browser provides its own JavaScript engine that reads and executes code. Google Chrome uses the V8 engine, Firefox uses SpiderMonkey, Safari runs JavaScriptCore, and Microsoft’s Edge uses Chakra (or now also V8). These engines compile JavaScript into machine code for speed, making the language much faster than it was in its early years.

When JavaScript runs in a browser, it has access to the Document Object Model (DOM)—a live representation of the web page. Through this model, scripts can modify elements, respond to user input, and communicate with web services. This is how modern websites achieve animations, form validation, interactive menus, and dynamic content without reloading the page.

Beyond browsers, JavaScript also powers servers, tools, and applications thanks to Node.js. Node uses the same V8 engine as Chrome but runs outside the browser. It provides modules for working with files, the network, and the operating system. This allows developers to build web servers, command-line utilities, or complete back-end systems using the same language they use in the browser.

💡 The same JavaScript language runs almost everywhere, but the available APIs depend on the environment. For example, browsers provide document and window, while Node provides fs and http.

The emergence of Node.js marked a major turning point in JavaScript’s history. It made JavaScript a true general-purpose language, suitable for almost any task. From automating builds to managing databases and deploying APIs, Node has made it possible to use one consistent language across both client and server.

In addition, JavaScript now runs in many other environments: mobile applications built with React Native, desktop apps powered by Electron, embedded systems, and even IoT devices. Its versatility and small footprint have made it the universal language of modern computing.

⚠️ When following examples, be aware of which environment they apply to. Code that manipulates web pages will not work directly in Node, and Node-specific code will not run inside a browser.

Running JavaScript

Because JavaScript is built into every major browser and supported by Node.js on the desktop, you can begin experimenting immediately without installing complex tools. There are several easy ways to write and run JavaScript code, each suited to different kinds of learning and development.

Using the browser console

The quickest way to try JavaScript is in your browser’s developer console. Every modern browser includes one, and it can be opened with a keyboard shortcut such as F12 or Ctrl + Shift + I. Select the Console tab, type a command like 2 + 2, and press Enter. The result appears instantly below your input. You can run multiple lines, define functions, and inspect variables interactively.

This environment is ideal for short tests, exploring new syntax, or checking how built-in functions behave. You can also execute scripts that are already part of a web page and see how they interact with the DOM in real time.

💡 In most browsers you can log output from scripts directly into the console with console.log(). It is the simplest and most widely used debugging tool in JavaScript.

Using browser developer tools

Developer tools go beyond the console, allowing you to step through code, watch variables, and inspect network activity. The Sources or Debugger tab lets you view and edit JavaScript files, set breakpoints, and run code line by line to observe how it behaves. These tools are invaluable for understanding how programs execute and for finding logic errors.

You can also inject your own code into any page to test small changes or experiments. Simply open a script file, make an edit, and reload the page to see the effect immediately.

Running code with Node.js

Node.js provides a command-line environment for running JavaScript outside the browser. Once installed, you can run single files by typing node filename.js, or enter the REPL (Read-Eval-Print Loop) by typing node with no filename. The REPL works much like the browser console, to enter commands, press Enter, and see results straight away.

This makes Node ideal for trying examples from the book, running small utilities, or learning how JavaScript behaves without a web page. It also lets you explore server-side features such as file handling and networking when you reach those topics later.

⚠️ The Node.js REPL and the browser console look similar but have different available objects. For example, the browser provides document and window, while Node offers process, require(), and module.

Including JavaScript in web pages

The most common way to use JavaScript on a website is by placing it inside <script>…</script> tags within an HTML document. You can put these tags in the <head> or at the end of the <body> section. For example:

<script>
  console.log("Hello from JavaScript!");
</script>

Alternatively, you can keep your scripts in separate files and include them with a src attribute:

<script src="script.js"></script>

This method keeps your HTML cleaner and makes it easier to reuse code across pages. Browsers load and run the script automatically when they reach the tag.

Strict mode and common pitfalls it prevents

JavaScript has a flexible design that allows beginners to write useful programs quickly, but this flexibility can sometimes lead to errors that are hard to detect. To improve consistency and catch mistakes earlier, ECMAScript 5 introduced strict mode, which enforces a stricter set of rules on how JavaScript is written and executed.

Strict mode is enabled by placing the line "use strict"; at the top of a script or at the beginning of a function. Once active, it changes how some parts of the language behave, making JavaScript safer, clearer, and easier to debug.

How to enable strict mode

You can apply strict mode to an entire script file or just to a single function:

// Entire script in strict mode
"use strict";
let x = 10;
// Only this function in strict mode
function example() {
  "use strict";
  let y = 20;
}

If you use modern tools or frameworks, strict mode is often applied automatically, but it is still good practice to understand what it does.

What strict mode changes

Strict mode removes or restricts several features that have historically caused confusion or subtle bugs. Among the most important changes are:

"use strict";
x = 5; // ReferenceError: x is not defined

Without strict mode, the same statement would quietly create a global variable named x, which is a frequent source of hard-to-find bugs.

💡 Using "use strict"; at the start of your code or module is a simple way to avoid many logic errors. It enforces habits that modern JavaScript already expects.

Strict mode in modern JavaScript

All JavaScript modules and class definitions automatically run in strict mode, even if you do not include the directive. This means that most modern code already benefits from its safety improvements by default. You only need to enable it explicitly in older scripts or inline code that is not treated as a module.

⚠️ Strict mode can sometimes reveal issues in older code that relied on outdated behaviour. If enabling it causes errors, review variable declarations and function scopes carefully as these are the most common problem areas.

Overall, strict mode helps make JavaScript more reliable and less error-prone. It encourages cleaner code and better practices, which is why it has become the standard mode for all modern JavaScript development.