Interactive Web with JavaScript

Lesson 1 of 17

Variables & types

Welcome to JavaScript — the language that makes web pages interactive. You've built pages with HTML and CSS (structure and style); JavaScript adds behaviour: responding to clicks, updating content, validating forms, fetching data. It runs right in the browser. We'll start with the basics — variables and types — then quickly move to making real pages do things.

Variables: storing values

A variable stores a value you can use and change. In modern JavaScript, you create them with let (for values that change) or const (for values that don't):

Try it Yourself
Loading editor…
Result
  • const — use this by default, for values that won't be reassigned. It signals "this won't change."
  • let — use when the value will change (a counter, a running total).
  • (You may see var in old code — avoid it; use let/const.)

Prefer const unless you know the value needs to change; it makes code safer and clearer.

The main data types

Try it Yourself
Loading editor…
Result

JavaScript's core types:

  • string — text in quotes: "Ada", 'hello'.
  • number — any number: 42, 3.14 (one number type for all).
  • booleantrue or false.
  • null / undefined — "no value" / "not set yet".

typeof tells you a value's type — handy for checking. Unlike some languages, you don't declare types; JavaScript infers them from the value.

Working with strings and numbers

Try it Yourself
Loading editor…
Result

The + operator joins strings and adds numbers. You'll combine text and values constantly to build messages and update the page. (JavaScript also has "template literals" using backticks for cleaner string building — very common in real code.)

The mistake beginners make

Using var (outdated, with confusing behaviour) instead of let/const — always use const by default and let when you need to reassign. Also, confusing = (assignment — sets a value) with ==/=== (comparison — tests equality, coming up). And forgetting quotes around strings (let name = Ada errors; it must be "Ada"). Prefer const, use let for changing values, and quote your strings.

Your turn

Try it Yourself
Loading editor…
Result

Your turn

  1. Create variables with const (default) and let (for values that change), and reassign a let.
  2. Use the core types: string, number, boolean, null — checking with typeof.
  3. Combine strings and numbers with + to build messages you'll later show on the page.

Key points

  • JavaScript adds behaviour (interactivity) to pages; it runs in the browser, on top of your HTML and CSS.
  • Store values in variables: const by default (won't change), let when the value will change. Avoid old var.
  • Core types: string (text), number, boolean (true/false), null/undefined — inferred from the value; check with typeof.
  • The + operator joins strings and adds numbers — you'll use it to build messages and update the page.

Q&A · 0

Enrol to ask questions and join the discussion.

No questions yet — be the first to ask.