JavaScript Variables and Data Types Explained

Every program, simple or complex, does one thing constantly: it works with information. A username, a price, whether someone is logged in, a list of products. To do anything useful, your code needs a way to store those pieces of information and pull them back out later. That’s exactly what variables are for — and the kind of information each one holds is its data type.

These two ideas sit at the very foundation of programming. Once they click, everything else in JavaScript builds straight on top of them. So let’s nail them down.

What a variable is

A variable is a named container for a value. You give it a name, drop a value inside, and from then on that name stands in for the value wherever you use it. Here’s the simplest possible example:

let name = "John Doe";
console.log(name);   // prints: John Doe

Reading that line: let creates a new variable, name is the name we chose, = assigns a value, and "John Doe" is the value being stored. After that, writing name anywhere gives you back "John Doe". Think of the variable as a label on a box, and the box holds the value.

Why bother? Because one value can be reused as many times as you like, updated in a single spot, and stored even when you don’t yet know what it’ll be — like whatever the user happens to type. Variables are simply how a program remembers things.

Declaring variables: let and const

Modern JavaScript gives you two main keywords for creating variables: let and const. The difference between them is small but matters a lot.

let creates a variable whose value you can change later:

let score = 0;
score = 10;     // allowed — let can be reassigned
console.log(score);   // prints: 10

const creates a variable whose value you cannot change after setting it. “const” is short for “constant”:

const birthYear = 1995;
birthYear = 2000;   // ERROR — const cannot be reassigned

So which one should you reach for? Here’s the practical rule experienced developers live by:

You might also run into an older keyword, var. It’s how variables were declared before let and const came along. It still works, but it has a few confusing quirks — quirks that let and const were specifically designed to fix. Stick with let and const in your own code; just know what var is so it doesn’t trip you up in older examples.

Naming variables

A few rules and conventions for naming:

• Names can contain letters, numbers, $, and _, but can’t start with a number.
• They’re case-sensitive: name and Name are different variables.
• The convention is camelCase — start lowercase, then capitalize each new word: firstName, totalPrice, isLoggedIn.
• Choose descriptive names. userAge tells you what it holds; x or a tells you nothing.

Good names make code readable. Remember, you’re not only writing for the computer — you’re writing for the next person who reads it, and that person is usually you, six months from now.

Data types: what kind of value is it?

Every value in JavaScript has a type — a category that describes what kind of data it is. There’s only a handful of basic types, and these are the ones you’ll reach for constantly.

Strings (text)

A string is text, written inside quotes. You can use single or double quotes (just be consistent):

const greeting = "Hello, world";
const city = 'Jakarta';

Strings hold anything textual — names, messages, addresses, you name it. You can stitch them together (this is called concatenation) with +, or use a cleaner modern syntax called template literals, written with backticks and ${ }:

const name = "John Doe";
const message = `Hello, ${name}!`;   // "Hello, John Doe!"

Template literals let you drop variables right into a string, which reads far cleaner than gluing fragments together with +.

Numbers

A number is exactly what it sounds like — JavaScript uses one number type for both whole numbers and decimals:

const age = 28;
const price = 19.99;

You can do math with them directly using +, -, * (multiply), and / (divide):

const total = price * 2;   // 39.98

Booleans (true/false)

A boolean has only two possible values: true or false. They capture yes/no, on/off kinds of situations, and they’re the backbone of every decision your code makes:

const isLoggedIn = true;
const hasPermission = false;

Booleans really come into their own in the next article, where we’ll use them to send our code down different paths depending on what’s true.

Undefined and null

Two special types represent “no value”:

• undefined means a variable has been declared but hasn’t been given a value yet.
• null is a value you deliberately set to mean “intentionally empty / nothing here.”

let result;            // undefined — declared but no value yet
const chosen = null;   // null — deliberately set to "nothing"

The distinction is subtle but real: undefined usually means “not set yet,” while null means “set, on purpose, to nothing.” You’ll bump into both all the time.

Arrays and objects (a preview)

There are also two important types for holding collections of values: arrays (ordered lists) and objects (labeled groups of values). Each is big enough to earn its own article later in this section, so we’ll leave the details for then. For now, just know they exist — they’re how you bundle several values together.

Checking a value’s type

If you’re ever unsure what type a value is, JavaScript has a built-in typeof operator that tells you:

console.log(typeof "hello");   // "string"
console.log(typeof 42);        // "number"
console.log(typeof true);      // "boolean"

It’s a handy debugging trick when code misbehaves — more often than not, the culprit is a value that’s a different type than you assumed (the string "5" sneaking in where you expected the number 5, say).

Wrapping up

You’ve got the foundation that everything else in programming sits on:

• A variable is a named container for a value. Create one with const (can’t be reassigned) or let (can be reassigned) — prefer const, use let only when you need to change the value.
• Name variables in camelCase, and make the names descriptive.
• Every value has a data type. The core types are strings (text, in quotes), numbers, booleans (true/false), and the “empty” types undefined and null.
• Template literals (backticks with ${ }) are a clean way to build strings with variables in them.
• typeof tells you a value’s type — handy for debugging.

With variables and types under your belt, you can store and label every piece of information your programs need. Next, we’ll start doing things with those values: operators and conditionals — running calculations, comparing values, and making your code branch in different directions depending on what’s true.