JavaScript Cheat Sheet

 11 + 1     // 12
'11' + 1;   // 111
 11 – 1;    // 10
 // magic trick:
'11' — 1    // 10
 // WTF?

0.1 + 0.2   // 0.30000000000000004
2.3 * 100   // 229.99999999999997

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

// one param missing — won’t work:
add(2); // NaN

// one param too much — doesn’t care:
add(2, 2, 10); // 4

let name = ‘Max’

setTimeout(function() {
  name = ‘Tom’
}, 1000)

console.log(name)  // Max

function hello() {
    message = ‘Hello!’
}
console.log(message) // message is not defined

hello()

hello()

console.log(message) // Hello

function hello() {
  message = ‘Hello!’
}

!![]            // true
[] == true      // false

!!null          // false
null == false   // false

'' == '0'     // false
'' == 0       // true
false == '0'  // true
'\t\r\n' == 0 // true
12 == '12'     // true

'' === '0'     // false
'' === 0       // false
false === '0'  // false
'\t\r\n' === 0 // false
12 === '12'     // false

typeof undefined  // 'undefined'
typeof 'Max'      // 'string'
typeof 2.71       // 'number'
typeof [1, 2]     // 'object'
typeof Date.now() // 'number'
typeof Date.now   // 'function'
typeof NaN        // 'number'

function greetUser(username) {
    return username
}
greetUser('Max') // 'Max

const greetUser = (username) => {
    return username
}

const greetUser = username => ( 
    username 
)
// or: 
const greetUser = username => username 

const people = []

const people = new Array()

let people = ["Max", "Tom"]
people[2] = "Carl"
// or:
people.push("Matt")
people // [ 'Max', 'Tom', 'Carl', 'Matt' ]

let people = ["Max", "Tom", "Carl"]

for(let i = 0; people.length > i; i++) {
    console.log(people[i])
}

let people = ["Max", "Tom", "Carl"]

people.map(name => console.log(name))

let people = ["Max", "Tom", "Carl"]
let ages = [21, 25, 32]

const profiles = people.map((name, i) => 
    [name, ages[i]]
)

// [ [ 'Max', 21 ], [ 'Tom', 25 ], [ 'Carl', 32 ] ]

let first = [1, 2]
let second = [3, 4]

first.push(...second)

first // [ 1, 2, 3, 4 ]

class Car {
    constructor(speed) {
        this.speed = speed
    }
    drive() {
        console.log("wrooooom")
    }
}

let lambo = new Car(250) // executed constructor 
lambo.drive() // wrooooom

class Car {
    constructor(speed) {}
    drive() {
        console.log(speed) // speed is not defined
    }
}

class Car {
    constructor(speed) {
        this.speed = speed
    }
    drive() {
        console.log(this.speed) 
    }
}

console.log(this)   // Window or Global
console.log(window)  // Window...

setTimeout() // or:
window.setTimeout() // in Node.js:
global.setTimeout()

// old-school workaround: duplicating this
class Car {
    drive() {
        let _this = this
        setTimeout(function() {
            console.log(this)   // window object
            console.log(_this)  // the correct this
        }, 1000)
} }

// new workaround: using an arrow-function
class Car {
    drive() {
        setTimeout(() => {
            console.log(this)   // the correct this
        }, 1000)
} }

class Car {
    constructor(speed) {
        this.speed = speed
    }
    drive() {
        console.log(this.speed)
    }
}

const lambo = new Car(120)
lambo.drive()  // 120 - as expected

const driveMethod = lambo.drive 
driveMethod() // error - this.speed is not defined

class Car {
    drive() {
      console.log("driving")
    }
}
  
const mercedes = new Car()
mercedes.drive() // driving

// would not work:
Car.drive()

class Car {
    static drive() {
      console.log("driving")
    }
}
  
Car.drive() // driving 

class Car {
    constructor(speed) {
        this.speed = speed
    }
    drive() {
        console.log("wrooooom")
    }
}
class Truck extends Car {
    addTrailer() {
        console.log("trailer added")
    }
}

const UPS_Truck = new Truck(120)
UPS_Truck.drive()       // from the Car class
UPS_Truck.addTrailer()  // from the Truck class

class Truck extends Car {
    constructor(speed, trailers) {
        super(speed)
        this.trailers = trailers
    }
    addTrailer() {
        console.log(this.trailers)
    }
}

const UPS_Truck = new Truck(140, 2)
UPS_Truck.drive()       
UPS_Truck.addTrailer()

class Car {
    drive() {
        console.log("wrooooom")
    }
}
class Truck extends Car {
    drive() {
        console.log("the second drive()")
    }
}

const UPS_Truck = new Truck()
UPS_Truck.drive()  // the second drive()

class Car {
    drive() {
        return "wrooooom"
    }
}
class Truck extends Car {
    drive() {
        return super.drive() + 
        " the second drive()"
    }
}

const UPS_Truck = new Truck()
console.log(UPS_Truck.drive()) 
//wrooooom the second drive()

window  // Window { ... }
this    // Window { ... }
// in Node.js:
window  // not defined
this    // global { ... }

window.outerWidth 
window.outerHeight
// return the dimension of 
// the browser window itself

window.innerWidth
window.innerHeight
// return the dimensions of 
// the website displayed effectively

document.readyState()
// returns the current status:

window.location.href 
// "https://codingcheats.io/javascript"

window.location.hostname 
// "codingcheats.io"

window.location.pathname 
// "/javascript" 

if (6 > 5) {
    console.log('6 is greater')
} else {
    console.log('6 is less than or equal')
}

console.log(6 > 5 ? '6 is greater' : '6 is less')
// basic syntax:
condition ? if true : if false

let output = true ? 'true' : 'false'
output // 'true'

let numbers = [2, 3]
let fullNumbers = [1, ...numbers, 4, 5]
fullNumbers // [1, 2, 3, 4, 5]

let people = ['Max', 'Anna', 'Tom']
let [firstBoy, , secondBoy] = people
firstBoy // Max
secondBoy // Tom