Values of Data in Everyday Life

Software developers work with all kinds of data, produced by all kinds of people and processes. Medical records, food and drink sales, atmospheric condition, transportation patterns... these things all get produced from data.

Going to the store

For example, imagine you make a trip to the grocery store this weekend. Here's what you buy.

1. Four oranges
2. One loaf of bread
3. Two bags of chips
4. One gallon of milk
5. Three cans of tomato sauce

Describing the Data

There are two ways to look at that data. First, you can describe the quantity of each thing you bought.

"I bought 4, 1, 2, 1, and 3 at the grocery store"

Of course, people would look at you funny. A better way would be to provide a label for what each of those numbers mean - which is how normal people talk.

"I bought 4 oranges, 1 loaf of bread, 2 bags of chips, 1 gallon of milk, and 3 cans of sauce.

An experienced software developer looks at that sentence very differently than you do. They see it as five, different data points about quantities. Each data point has two parts.

1. The descriptive label for the quantity
2. The quantity itself (i.e. the value of the quantity)

The labels are "oranges", "bread", "bags of chips", "milk", "tomato sauce".
The values are 4, 1, 2, 1, 3

Second trip to the store

Two weeks later, you need to make another trip to the store. However, on this trip, the data is different. You buy the same things, but in different quantities because you know your sister is coming over for the weekend.

1. Seven oranges
2. Two loaves of bread
3. Three bags of chips
4. One gallon of milk
5. Six cans of tomato sauce

Again, the labels are still "oranges", "bread", "bags of chips", "milk", "tomato sauce".
This time, though, the values are 7, 2, 3, 1, 6.

Each time you go to the store, the labels will remain the same, but the values attached to those labels varies. This are what developers use variables for. Words that human beings can read and understand (the label) which can be assigned a value.

Your First Variables

Variables are labels for values that vary over time.

Time to see your first variables in JavaScript to represent the first trip to the store.

let oranges = 4
let breadLoaves = 1
let bagsOfChips = 2
let milk = 1
let tomatoSauce = 3

You use the keyword of let to "declare a variable". In other words, it tells JavaScript that the word immediately to the right is going to be a variable. Then you type an equal sign, and then finally what value you want to be assigned to the variable.

You can make the variable name ANYTHING YOU WANT. You are the software developer, so you have that power. One thing that confuses many beginners is that they think the variable name matters. It doesn't. JavaScript doesn't care - at all - what your variables are. All it cares about is the values.

However, other developers do care what you name your variables. Imagine how frustrated you would be if instead of using the descriptive names above for the variables, you saw this code instead.

let o = 4 
let bl = 1 
let boc = 2 
let m = 1 
let ts = 3

The developer who wrote this code knew that "o" was an abbreviation for "oranges", but you would have no idea that it was. How annoying!

Camel Case

Speaking of naming variables, it is a convention in the JavaScript developer community to name variables with camel case. This means that the variable starts with a lower-case letter, but each additional word in the variable name should start with a capital letter.

Bad variable naming

let bagofdonuts = 2

Good variable naming

let bagOfDonuts = 2

Good variable naming because it is a single word

let cucumbers = 3

Bad variable naming

let icecream = 1

Good variable naming

let iceCream = 1

Changing a Variable's Value

Remember that the main purpose of a variable declared with let is that the value varies. You can change the value assigned to all of the variables to reflect your second trip to the store.

oranges = 7
breadLoaves = 2
bagsOfChips = 3
milk = 1
tomatoSauce = 6

In case you didn't notice the difference, there is no let keyword at the beginning of those lines of code. You are not declaring the variables any more. You already did that. This time you are changing the value of the variables.

Adding the Values in Variables

In this introduction, the values for each of your variables are numbers. In this case, they are integers. The variables are placeholders, or labels, for those values. What this allows you to do is perform mathematical operations on the numbers by using the variables.

Look at the values for your first shopping trip again.

let oranges = 4
let breadLoaves = 1
let bagsOfChips = 2
let milk = 1
let tomatoSauce = 3

Now assume you want to know the total quantity of items that you bought at the store on that day. You can use the plus sign to add then all up.

const total = oranges + breadLoaves + bagsOfChips + milk + tomatoSauce

It looks weird to be adding words, but you need to remember that you're not adding the variables. You are adding the values that those variables represent. JavaScript interprets that code as the following.

const total = 4 + 1 + 2 + 1 + 3

Um, wait a second. What is that new keyword of const?

It's short for "constant value". This means that you can't change the value of the variable you are declaring. If you try to, JavaScript will be angry with you. You can try this out for yourself. In the code editor, enter in the following two lines of code there, and click the "run >" button.

const bananas = 4
bananas = 10

You will immediately see an angry, red message in the console below it with the message

SyntaxError: Assignment to constant variable: bananas

• The let keyword for declaring variables will allow you to change the value.
• The const keyword for declaring variables will not allow you to change the value.

Why would you choose const instead of let for the totalQuantity variable? Well, that's a value that you don't want to be mistakenly change later in the code. Humans make mistakes all the time, and you don't want other code that you write to modify that total value.

Your First Exercise

Now it is time for you to write your own code. Imagine that you want to determine what your electric bill costs are for an entire year. You gather all twelve electric bills in front of you and want to add them together. Instead of just entering in the numbers, you are going to assign those numbers as values to variables. Each variable will represent a single month's electric bill charge.

There is some code already provided for you in the editor to the right. Take a look...

const yearlyElectricCosts = () => {
  let januaryBill = 43.11
}

Your job is to write eleven more variables to represent the charges for February, March, April, May, June, July, August, September, October, November, and December. Here are the charges that you need to assign to each variable.

• You spent 50.21 in February
• You spent 48.92 in March
• You spent 62.36 in April
• You spent 54.64 in May
• You spent 49.30 in June
• You spent 61.93 in July
• You spent 68.54 in August
• You spent 71.77 in September
• You spent 70.28 in October
• You spent 59.56 in November
• You spent 62.04 in December

After you have made all of your variables, declare one more at the end to store the total yearly charges. Remember that you can name the variable whatever you want.

Use the const keyword to declare this variable instead of let. You can name it anything you want, as long as it is descriptive. Here are some options, or you can choose your own.

• total
• yearlyTotal
• totalCharges

After you have added all of the numbers, you need to return the value of the variable. For example, if you chose totalCharges as your variable name, the next line of code after you added everything should be...

return totalCharges

Testing Your Code

Click the Attempt button in the lower-right corner of the screen any time your want to see if you got the code written correctly.