Day 1 of 100

I’ve been using W3Schools to learn and relearn more about JS. Today I learned:

• Strict mode — Strict mode is a literal expression used in JavaScript to make sure that code is only being executed in “strict mode”. This means that values like undeclared will not be read when attempting to execute your code.
• To use strict mode you simply add “use strict”; to the beginning of your script (global) or function (local).

"use strict"; 

i = "rainbow"; //this will cause an error because i is not declared 

• The keyword ‘this’ in JavaScript — is in reference to an object. To determine what this is depends on how the keyword is being used. this can be used in different ways:
• in a method — this refers to the object when used in an object method

roleRoster: function() {
  return this.name + " " + this.occupation + " " + this.salary; 
}

• when used alone — this is the global object. This is also applicable in strict mode.

"use strict"; 

let banana = this; 

• when used in a function — the global object binds to this by default. Strict mode can’t be used here and will return undefined because strict mode doesn’t allow default binding.

function bananaMuffin() {
  return this; 
}

//returns [object Window] 

• when used in event handlers — this refers to the HTML element of the event
• when used in object method binding — this refers to the object

const dog = {
  name: "Kai", 
  age: 21,
  breed: "Miniature Pinscher",
  favoriteFood: "pup cups"
  kaisFunction: function() {
    return this.name + "says woof";
  }
}; 

//"this" refers to dog. 

• when used in explicit function binding — there are some prebuilt functions like bind(), call(), and apply() in JS that can be used to call object method with another object.
• call() — you can write a method that can be used on different objects. This method take arguments separately.

w3schools example

• apply() — you can write a method that can be used on different objects. the apply method takes arguments as an array.

w3schools example

• bind() — with this method, an object can borrow a method from another object.

w3schools example

• JavaScript Classes — you use the word class and you always add a method named constructor():

class ClassName{
  constructor() {...}
  method_1(){...}
  method_2(){...}
  method_3(){...}
}

ex. 

class Dog{
  constructor(name, age){
    this.name = name; //initializing the variables 
    this.age = age; 
  }
  
  age() {
    let date = new Date();
    return date.getFullYear() - this.year; 
  }
}

• the constructor method — is used to initialize object properties and is automatically executed when the new object is created. You should always have a constructor method.
• after the constructor method- you can add methods to your class

• JSON(JavaScript Object Notation) — A format for storing and moving data. JSON format is text only, but code for reading and generating JSON data can be written in any language.
• JSON must be — in name/value pairs; separated by commas, the curly braces must hold objects and square brackets must hold arrays
• Converting a JSON text to a JS Object — use JSON.parse() to convert a string into a JS object

• Speeding up JS code — a area that I’m especially interested in right now: — Reduce the amount of activity in code. Every statment included in a loop is executed each time the loop is repeated. some statements like arr.length can be set to a variable and placed outside of the loop to make the loop run faster.

let j = arr.length - 1; 
for(let i = 0; i < j; i++){
}

• Another way to speed up code is to reduce access to the DOM — if you’re going to access the DOM on multiple occasions, access it one time and use it as a local variable.
• in addition, you can also reduce the number of elements in the DOM, and remove any variables that you don’t need

w3schools example

• This concluded my “learning” part of my day. For the rest of the day, I’ll dabble around with the JavaScript project that I’ve been working on since bootcamp and will give my brain a much deserved rest :). Time well spent today!

Vinia