JavaScript Cheatsheet

What is JavaScript#

…#

Objects#

Almost everything in JavaScript is an Object. Objects can be defined as variables.
A simple example is a String, which is also an Object.

var name = "Bob";

However, an Object can also contain multiple values. In an Object, you can store properties as well as methods.

var person = {
    firstName:  "Joey",
    lastName: "Bobby",
    age: 14,
    state: "CA"
}

In this person Object above, we have 4 properties stored in the format of property: value
We can change & access properties like this:

console.log(person.firstName);
console.log(person.age);
person.age = 15;
console.log(person.age);

Output:

Joey
14
15

We can also have methods:

var person = {
    firstName: "Joey",
    lastName: "Bobby",
    age: 14,
    state: "CA"
    printName: function() {
        return this.firstName + " " + this.lastName;
    }
}

console.log(person.printName());
// output: Joey Bobby
person.firstName = "Alvin";
console.log(person.printName());
// output: Alvin Bobby

Check out this article for more on Objects in JavaScript.

Constructors#

Constructors are very similar to Objects, however, they act as Blueprints or Classes. Consider this example below:

function person(first, last, age, state){
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.printName = function() {
        return this.firstName + " " + this.lastName;
    }
}

var bobby = new person("Bobby", "Joe", 19, "CA");
console.log(bobby.age);
console.log(bobby.printName());

As you can see above, Constructors can be thought of as blueprints for Objects. The above example prints 19 then Bobby Joe. The variable bobby becomes an Object and can be treated like an Object.

Check out this article for more on Constructors in JavaScript.

Callbacks#

In JavaScript, Callbacks allow to call a function after another function finishes. Consider this example below where the function first has a 500 millisecond code delay.

function first(){
    setTimeout(() => {
        console.log(1);
    }, 500)
}

function second(){
    console.log(2);
}

first();
second();

Output:

2
1

Although the function first() is called before second(), the 500 millisecond delay causes 2 to be printed before 1. To fix this, we can use a Callback. Callbacks allow us to pass another function into the first function like this:

function first(callback){
    setTimeout(() => {
        console.log(1);
        callback();
    }, 500);
}

function second(){
    console.log(2);
}

first(second);

This outputs 1 then 2. The parameter named callback takes in a function name, then calls the function with callback() after the console.log(1). Another way to utilize a Callback is like this:

function first(callback){
    setTimeout(() => {
        console.log(1);
        callback();
    }, 500);
}

first(() => console.log(2));

Also outputs 1 then 2, except the function is passed as the parameter.

Check out this article for more on Callbacks in JavaScript.

This is still a work in progress.
Created By: WHS Comp Sci Club Officers