Dwight Schrute's Intro to Programming

With comprehensive visual code examples attached to this document

This tutorial is a beginners approach to programming through the Javascript language.

Question: Do I think that even you can start to programming in Javascript?

Fact: If I can teach Mose what to do, sure you can do it to a computer browser.

I welcome you to this short introduction to the holy practices of Javascript programming my young padawan from now on. The force had brought you here, or maybe you are a forced coworked who I insisted to visit my post. Anyway, at least one force is present.

Enough of you, let's talk about what do you need to understand to begin to work with javascript:

• A text editor or an IDE:
  • Sublime Text is a text editor
  • Visual Studio Code is an IDE
  • Go and learn how to install one of them.
• You will be doing this go and forth to learn little things all the time, with no explanations how, so get used to it.
• Keep reading this post, that's it.

The very basics data types are:

• Strings: "Dunder Miflin, this is Pam" or "1234", it's a string too if it's surrounded by backticks, single or double quotes.
• Numbers: 0, -1, 0.3 - This ones are just the digits.
• Booleans: true or false, you will learn that almost everything can be reduced to this, it will be useful to remember this.
• Null: This means 'nothing', 'empty' of 'value unknown'.
• Undefined: You will learn about what this means sooner that later young apprentice. Let's treat it as a null.

Other types you must understand:

• Objects: We are no taking about a primitive type like the past ones. The difference is that the last ones can only contain one single value. Pathetic. Objects are like gods, they can store collections of data, you will love and hate treating with them sometimes. Know them very well before they know you and stab you from the back.
• Symbols: You should not worry for this ones yet. Learn objects very well is my personal recommendation.

It's time for the special detective of the data types: the typeoffunction. Some time from now, or if you are an adventurer and already know how to open the chrome developers tool to use the Javascript console and test this next thing, go on.

We will tell Javascript to run the typeof function and pass to it the value we want to know which type javascript guess:

// This entire line is a comment fi it begins with double forward slashes
// Telling Javascript to tell us the typeof of several values:

typeof undefined // "undefined"

typeof 0 // "number"

typeof true // "boolean"

typeof "Jim" // "string"

typeof Symbol("Michael") // "symbol"

typeof null // "object", yes, no time to get chatty here.

Learning by doing

My personal strategy is to start doing before start learning what you are doing, is the way mother's nature treat us.

I'm gonna let you read some code and then explain to you what is happening:

if (belt === "black") {
    alert("Must be Dwight");
}

This is simple if you read it like: lets check a condition here, check if the value of the belt is equal to "black", if so, you will have to bring an alert with the message "Must be Dwight".

It's called a condition because it does some stuff based if a certain situation turns out to be trueof false. There's even a way to check a lot of different situtations at once:

if (coworkerName === 'Jim') {
    denyAccess();
} if else (coworkerName === 'Michael') {
    allowAccess();
} else {
    denyAccess()
}

I guess now that you might understand what is happening. Check first if the name of the worker trying to access the building is "Jim" and execute a function that denies the access. But if it's "Michael", the allow the access executing the function.

Yes, there is a last else 'case' for when the coworkers name is different to those two ones. Could be "Toby" or someone else. Of course in that case I will want to deny access to him, or anyone else.

Question: Can we try to address some cases without making a lots of else if and making a mess with the curly braces?

True: Use a switch case statement:

switch (coworkerName) {
    case 'Dwight':
        allowAccess();
        break;
    case 'Jim':
        denyAccess();
        break;
    case 'Pam':
    case 'Michael':
        allowAccess();
        break;
    default:
        denyAccess();
}

Hear my words little programming lamb: The value of coworkerName will be tested in every case. And will execute everything that is below the colons until another case. We tell it to break so the checking doesn't go any further.

Final words:

Here I presented you a little taste about programming, this is, telling the computer how to behave. You must know that there are a lot of things that you can the computer to do and react to certain scenarios.

If you want to see more of this tutorials, comment below and I will keep posting this stuff on the internet for you.

Greetings!