History: Javascript

The pur­pose of this les­son is to teach you en­ough javascript so you can use node.js. You should know the basics of html and css for gett­ing the best of this co­ur­se.

Javascript is a pro­gramm­ing lan­guage created in 1995 for the use on web brows­ers and has since be­come the most used lan­guage in Git­hub. In re­cent years Node.js has em­er­ged as a new tech­nology for power­ing the serv­ers with javascript, thanks in part to the javascript's en­gine V8 and a com­mun­ity of pas­sionate de­velop­ers.

Vari­ables

There are many ways to re­present in­for­ma­tion. You can re­present the numb­er of students with an in­teg­er, your name with a str­ing (text), etc. But in pro­grams you might want to reuse these so you store them some­where: in vari­ables.

A vari­able is a place where you store some in­for­ma­tion. Im­agine that you want to store a hy­pot­het­ical numb­er of students of Libre Uni­vers­ity, 80. You would do so like this in javascript:

var students = 80;

We are creat­ing the vari­able students with the keyword var and as­sign­ing it the value of 80. Now we want to get the numb­er of students for next year, tak­ing into ac­count that 20 students will graduate and 30 new students will join. We could do it like this:

var students = 80;
var graduating = 20;
var joining = 30;
var nextyear = students + joining - graduating;

Vari­able types

Some ex­am­ples of vari­ables with a com­ment ( // ... ) nam­ing them:

// Number:
var years = 24;

// Boolean:
var married = true;

// String:
var address = "Street 24, New York";

// Array (of strings):
var friends = ["Mary", "John", "July"];

// Object
var friend = { firstname: "Peter", lastname: "Smith" };

To dis­play them you can use the func­tion alert() and a pop-up will show you the value.

Con­trol struc­tures

The pro­grams nor­mal­ly ex­ecute from top to bot­tom, line by line. Howev­er there are few struc­tures in javascript that can chan­ge this, one being con­trol struc­tures. The charac­teris­tic of them is that they are a single op­era­tion fol­lowed by a code block de­limited by { }, and that block is the part that gets modified.

if ( con­di­tion )

When using the vari­ables men­tioned above some­times you want that a piece of code is ex­ecuted in one situa­tion or not. For doing this we use the if clause:

var name = "John";
if (name == "Peter") {
  alert("Hello Peter");
}
if (name == "John") {
  alert("Hello John");
}

Notice how we use == in­stead of =. This is be­cause a single equal sign is used to as­sign a vari­able, while a doub­le (or tri­ple) equal is used to com­pare two th­ings.

But what do you do when you also want to do some­th­ing when the state­ment is not true? Then you can use the else clause:

var name = "Peter";
if (name == "Peter") {
  alert("Hello Peter");
}
else {
  alert("You are not Peter!");
}

We can com­pare any type of vari­able. You can also com­pare numb­ers and op­era­tions like great­er than or small­er than like this:

var age = 17;
if (age >= 18) {
  alert("You are allowed to see this page");
}
else {
  alert("This page is only for adults");
}

for ( in­iti­al ; con­di­tion ; chan­ge )

There's an­oth­er im­por­tant con­trol struc­ture cal­led for. It is used when you want to per­form an op­era­tion many times but you don't want to write the same code over and over again. For ex­am­ple, say Bloody Mary 3 times:

for(var i = 0; i < 3; i++) {
  alert("Bloody Mary");
}

Note how we put i < 3 to dis­play it three times, since it will be ex­ecuted when i is 0, when i is 1 and when i is 2. If we had said i <= 3 then we'd also ex­ecute the block when i is 3, so it'd be 4 times in total.

.forEach(func­tion(){})

A similar one would be .forEach(). It is used to loop an array, howev­er we'll see it later since it in­vol­ves met­hod and callbacks, some more ad­vanced tech­niques.

Func­tions

A func­tion is a piece of code that takes an input and re­turns an out­put. Let's see a typ­ical ex­am­ple, the func­tion "sum":

function sum (a, b) {
  return a + b;
}

This func­tion ac­cepts two ar­gu­ments and re­turn the sum of them. To use it you can test this code:

function sum (a, b) {
  return a + b;
}
var result = sum(5, 7);
alert(result);

Ob­jects and met­hods

An ob­ject is a type of vari­able that can con­tain other ele­ments cal­led pro­pert­ies. It is dif­ferent from an array in that each ele­ment has a name. For ex­am­ple, you can have the ob­ject per­son:

var person = {
  firstname: "John",
  lastname: "Doe",
  age: 21
};

To read or write one of the pro­pert­ies of per­son you can ac­cess them using a .:

var person = {
  firstname: "Jonh"
};

// Oops, we made a typo in firstname. Fix it:
person.firstname = "John";

// Display the name of the person
alert(person.firstname);

Ob­jects can also store func­tions. Let's allow for the pre­vi­ous per­son to say his name:

var person = {
  firstname: "John",
  sayHi: function(){
    alert("Hi, I'm John");
  }
};

// It shows "Hi, I'm John"
person.sayHi();

this

To ac­cess a vari­able with­in an ob­ject or func­tion, you can use this keyword. For the last ex­am­ple:

var person = {
  firstname: "John",
  sayHiTo: function(to){
    var name = this.firstname;

    // Join the string with the name
    alert("Hi " + to + ", I'm " + name);
  }
};

// It shows "Hi Peter, I'm John"
person.sayHiTo("Peter");

Async

Async...