Data Types

---

Data Types

When working with a programming language, the main thing to keep in mind is that you're working with information in the form of data. Computers are particular about how data is formatted depending upon its type.

Types allow us to know, with certainty, how different pieces of information will be treated and what they're capable of doing in our code. In JavaScript, we'll separate types of data into two categories: primitive and structural.

Primitives

In all, there are six primitive data types in JavaScript. However, for this course, we'll keep it simple and start by focusing on only three.

Boolean

Boolean is a simple true or false value.

1let isRaining = true; // It's currently raining
2let hasUmbrella = false; // Stinks for that person...

Boolean values are incredibly useful. As we progress in this module, we'll reach the point where certain actions are happening in our code only when certain conditions are met; often these boolean values are the determining factor in whether certain code runs or not.

Number

Numbers are...numbers. Technically, this is a numeric data type wherein we can perform arithmetic operations.

1let x = 14;
2let y = 12;
3
4x + y; // returns 26

String

Strings are basically text. Their syntax is a bit different, and more open to personal style, than numbers or boolean values. In the examples below, you'll see that we wrap strings in punctuation to distinguish them from other data types.

1const firstName = "Homer"; // Quotation marks are the OG
2const lastName = `Simpson`; // Backticks are the GOAT as we'll see in a bit when we get fancy with including other variables in strings

Are there other (primitive) data types? Absolutely! We'll encounter a few, like undefined as we work through this course. However, for our purposes, we'll focus on learning how to write and interact with the ones above.

Structural Data Types

Structural data types work a bit differently than primitive values. Notably, structural data is mutable, meaning it can be modified.

A string like Simpson can't be changed to simpson. However, the variable representing that string can be modified to the new value.

1console.log(`Simpson`); // will always be Simpson with a capital `S` -- we can't change the string itself
2let name = `Simpson`;
3console.log(name); // will log `Simpson`
4
5name = `simpson`;
6console.log(name); // will log `simpson`

As we'll see later, we can directly modify the values of structural data types.

Array

Arrays are the JavaScript version of everyday lists. They're wrapped in square brackets and each item within the array is separated by commas. We can store all different types of variables inside an array; they don't have to all be the same either.

1const colors = [`red`, `green`, `blue`];
2const ages = [12, 13, 13, 12, 13];
3const meals = [
4  [`eggs`, `OJ`],
5  [`hot dog`, `soda`],
6  [`salad`, `water`],
7];
8const stats = [182.88, 81.6, `brown hair`];

Object

Objects can be confusing at first, but are one of the most common types of intricate data storage we'll use. Objects, like arrays, are meant to store multiple pieces of information; however, they use key-value pairs - like we saw in CSS - to take characteristics of the object, known as properties, and assign them values. The syntax uses curly brackets to wrap the object and properties followed by colons, separated by commas, to set the values.

Think of this example below with a person:

1const person = {
2  name: `Homer Simpson`,
3  age: 42,
4  children: [`Maggie`, `Lisa`, `Bart`],
5  spouse: `Marge Simpson`,
6  bald: true,
7};

Coming Up

As we'll see, there's a lot of overlap and using of these different data types together. However, they each have 'jobs' wherein they're the best choice for a particular use case.

---

Previous and Next Lessons: