What is "Primitives and Strings" about?

Understand the basic building blocks of JavaScript: numbers, strings, booleans, undefined, and null.

What topics does "Primitives and Strings" cover?

This article covers: javascript primitives, javascript strings, typeof javascript, javascript null vs undefined.

Primitives and Strings

The Essentials

Primitive Data Types: The foundational building blocks of data in JavaScript. The most common are string, number, boolean, undefined, and null.
The typeof Operator: A built-in way to ask JavaScript what type of data it thinks a value is.
Strings: Textual data enclosed in single quotes, double quotes, or backticks. Strings are made up of individual characters.
String Methods: Built-in functions like indexOf(), includes(), startsWith(), and toLowerCase() that let you search and manipulate text.

Up until now, I have just been typing commands into the console and watching the DOM change. But if you want to actually write logic, you have to understand the entities those commands are operating on. In programming, these entities are called values, and every value has a specific type.

If you type 42 into the console, JavaScript sees a number. If you type "42" inside quotes, it sees a string. To us, they look like the same thing. To JavaScript, they are fundamentally different.

If you are ever unsure what type of value you are dealing with, there is a built-in operator that can tell you: typeof.

JavaScript

typeof 42       // "number"
typeof "42"     // "string"
typeof true     // "boolean"

The Primitive Types

In JavaScript, there are basically two categories of things in the world: primitive values and objects. I will get to objects later, but primitive values are the simplest chunks of data you can have.

There are five primitive types that you will use constantly:

Numbers: Integers, decimals, negative numbers, and even Infinity. Unlike some languages, JavaScript does not distinguish between integers and floats; they are all just a number.
Strings: Textual data, wrapped in quotes.
Booleans: Logical entities that can only be true or false.
Undefined: A blank void. It usually means "a value was supposed to be here, but nothing has been assigned yet."
Null: Another blank void, but intentional. It usually means "I explicitly want there to be nothing here."

There is one famous historical quirk you should know about. If you type typeof null, JavaScript will return "object". This is a bug from the very first version of JavaScript written in 1995 that has never been fixed because it would break too many existing websites. null is a primitive type, even if typeof lies and says it is an object.

Working with Strings

Strings are essentially friendship bracelets. They are sequences of individual characters strung together.

Because they are a sequence, JavaScript assigns a numerical position to every character in the string. This is called an index. But critically, JavaScript starts counting at 0, not 1.

If you have the string "ALOHA":

A is at index 0
L is at index 1
O is at index 2
H is at index 3
A is at index 4

If you want to know how many characters are in a string, you can check its .length property. "ALOHA".length returns 5. Even an empty string "" has a length, which is 0.

String Methods

Because strings are so common, JavaScript provides a ton of built-in ways to inspect and manipulate them.

Finding Characters You can ask JavaScript to find the index of a specific character or substring using .indexOf().

JavaScript

"ALOHA".indexOf("L")  // Returns 1
"ALOHA".indexOf("HA") // Returns 3
"ALOHA".indexOf("Q")  // Returns -1

If the string is not found, JavaScript returns -1. This is a standard convention meaning "I searched everywhere, but it is not here." Note that these methods are completely case-sensitive. "ALOHA".indexOf("l") will also return -1.

Checking Contents Sometimes you do not care where something is, just if it is there. For that, you can use .includes() or .startsWith(). These return a boolean.

JavaScript

"ALOHA".includes("HA")     // Returns true
"ALOHA".startsWith("AL")   // Returns true

Modifying Strings You can stitch strings together using the + operator, a process known as concatenation.

JavaScript

"ALOHA" + "!" // Returns "ALOHA!"

And if you need to standardize your text, you can easily change its casing:

JavaScript

"ALOHA".toLowerCase() // Returns "aloha"

These might seem like small tools right now, but when you are building real applications (validating user input, searching through databases, formatting UI elements) these string methods become the absolute workhorses of your code.

Primitives and Strings

The Essentials

The Primitive Types

Working with Strings

String Methods

Further Reading and Watching