Through all the years of teaching web/mobile development at our JavaScript Full-Stack Bootcamp sometimes we've had students struggling to grasp the way programming works and computers operate on the fundamental level.
This article is written mostly for people who are just starting to learn programming. I'd love to hear from you, is it "clicking" or not? As my main goal as an educator is to constantly search for the new approaches working best on different types of learners all the feedback is hugely welcome 🖤
Abstraction of logic and data is often the main challenge to these students. We try different approaches in these cases and one of them is to explain programming concepts with offline real-world examples from our lives.
In this article, I am going to share these thoughts with you and hope it will help you to understand those concepts if you are struggling with them as well.
Variables
Let's start with a variable. If we say that a variable is a named container which can store some data, how do we find an example of a variable in real life?
How about a name each one of us has? It can definitely contain known or unknown data. Virtually every person has a name and we can use it even without knowing what the actual name is.
Let's create a person and call this person Laura. Now the value of the variable name would be Laura. Can we use this variable before we will know the actual name? Sure thing!
Imagine that we are about to meet this person for the first time. We are preparing our "logic" by getting ready for this dialogue:
Me: Hi, my name is George, and you are?
Person: Hi George, I am _name_, nice to meet you!
Me: Nice to meet you too _name_!
So in a way, we pre-write the script to run when we first will meet this person without knowing her name. Doesn't matter if her name would be Laura or Mike, it will follow the same scenario, only instead of name we will have Laura, like this:
Me: Hi, my name is George, and you are?
Person: Hi George, I am Laura, nice to meet you!
Me: Nice to meet you too Laura!
And this "meeting someone for the first time" scenario is an algorithm we create in our head before a certain situation.
The same happens in programming – we re-write our code to run the same logic in the same situations but with different data. I can easily reuse this "meeting someone for the first time" scenario with another person and it could go like this:
Me: Hi, my name is George, and you are?
Person: Hi George, I am Antonello, nice to meet you!
Me: Nice to meet you too Antonello!
So we can see that the logic didn't change, only the actual data, which is the person's name in this case.
Arrays or lists
Now the array is an ordered collection of several data items and we use them every day in our life when we are making… well, lists!
Imagine that you are writing a shopping list of groceries on a piece of paper. You have: 'bananas', 'kiwis', 'oranges' and if you write them down in a column you will have:
1. bananas
2. kiwis
3. oranges
Every item in the grocery list has its own number, even if you do not put them down, you still can tell immediately which one is the first, second, and the last one!
The same with arrays in programming – they keep a list of items by default stored in the order of how they were being added.
The only big difference is that in programming we usually start counting with 0 so the first item will have position number (or index) 0, and the second item will have index 1, etc…
Now the most common way of getting the item from the list in programming would be by using the index of an element, which in our example translates into something like "grocery list item number 0" and we get bananas.
If we have another list of let's say movies we want to watch and it goes like this:
Batman
Superman
Nightman
To get the Superman movies we will need to tell the computer: get me movies list item with index 1. One because we start counting from zero, remember?
Objects/dictionaries
Now if we speak about an object we know that it is an unordered collection of key/value pairs where the key represents the name of data and value holds the data itself. But what does it mean in real life?
The answer is – many everyday things could be imagined as objects. For example, a person could be seen as an object with many key/value pairs which are characteristics of any person like the first name, last name, age, hair color, favorite coffee drink, pets owned, etc...
All of these properties are describing the person since we all have more than one "variable" to define us. And we all share most of these properties – like first name and last name – but the values are different.
For example, person/object Laura has:
firstName: Laura,
lastName: Casa,
petsOwned: cat,
favoriteCoffeeDrink: Latte
But person/object Antonello while sharing the same properties has different values:
firstName: Antonello,
lastName: Sanna,
petsOwned: dog,
favoriteCoffeeDrink: Espresso
To know the second person's lastName we always say something like Antonello's last name which is essentially how we do in programming – the name of the object followed by name of the key (property).
Pretty much anything could be described as an object since most of the things/beings surrounding us can't be described with a single item of data like "variable".
A book at least will have a title, author, number of pages, synopsis, price. A cat will have a name, age, color, breed, number of legs 😀, etc...
Functions
Functions are named blocks of code that we can reuse by executing them, or calling them by name, and believe it or not we use functions every day in our lives!
Function fill up your car with gas, for example. It has a predefined algorithm of steps needed to achieve the goal and we repeat them or execute this "function" every time we need to pour more gas into the car.
It can go like this:
fill up the car with gas:
get in the _car_
start it up
drive to _gas station_
fill it up
pay
drive away
As we can see, we do not mix data and logic here, we never mention a specific name or address of the gas station, we do not say which car we want to fill with gas, we only have logical steps we repeat for whatever data is incoming – it could be my own car and the gas station nearby or the rental car in some other country and the gas station I googled a moment ago.
All these variable data, like which car and gas station, are coming into the function as arguments, so once we are actually "executing" this function and need to fill a car with gas it will look slightly different – our variables car and gas station will use actual data values like so:
fill up the car with gas:
get in the _rental car i've got on holidays_
start it up
drive to _the gas station hotel clerk suggested_
fill it up
pay
drive away
As you can see, the logic will still work with actual data as well!
Loops
Let's say we are having a party and making sandwiches for all. We need to make 5 of them and they all are the same - this is a perfect loop example. We need to repeat the same sequence of action several times.
We take toast, add ham, cheese, salad, another toast, done! And repeat so 5 times. So with pseudo-code it will look like this:
start loop, do 5 times
take a toast
add ham
add cheese
add salad
put toast on top
end loop
So we can not go to making the next sandwich before we will finish the current one, and in programming, loops work the same - we need to complete the current iteration before going to the next one.
We are looping daily, even then reading a book – this loop will be done unknown number of times, since we do not know in advance until which page we are going to read this time, so in the loop we have two actions – turn page, read page - then repeat again.
Conditionals
Every day we have to make decisions, what to eat, what to wear, where to go, what to buy in the supermarket. Essentially it's a conditional logic in real life. It could be simple like:
if I am hungry in the morning
I will have breakfast
else
Will only drink coffee
Or more complex with nested conditionals for more possibilities:
Level A: eating at home
Level B: do I have bread?
make a sandwich
Level B: if not
go buy bread
Level C: do they have a baguette?
buy one
Level C: if not
buy pita
Level A: eating out
go to a restaurant
So if we decide to eat at home we check if there is bread if there is we make a sandwich but if there is not we go to a bakery where they might or might not have a baguette and if they don't we buy pita.
In the very same way conditionals in the programming languages work - there is always only one of them being selected and executed – the one which gives us a logical "true". And if we have nested conditionals - like in case we are staying at home we want to check if we have bread – those nested conditionals will be checked only if parent condition is "true" – we are eating at home in this example.
Hope this was helpful a bit, please share your thoughts with me, would be great to know how it settles.
See you in school.
George
This article was first published at Barcelona Code School’s website