Javascript Side Notes

These are some common pointers which may confuse me.

Distinction between the prototype property on construction functions and an object’s prototype.

Note: It’s important to understand that there is a distinction between an object’s prototype (available via Object.getPrototypeOf(obj), or via the deprecated proto property) and the prototype property on constructor functions.

The former is the property on each instance, and the latter is the property on the constructor. That is, Object.getPrototypeOf(new Foobar()) refers to the same object as Foobar.prototype.

Most modern browsers, however, do offer property available called proto (that’s 2 underscores either side), which contains the object’s constructor’s prototype object. For example, try person1.proto and person1.proto.proto to see what the chain looks like in code!

The call() function

function Teacher(first, last, age, gender, interests, subject) {
  Person.call(this, first, last, age, gender, interests);

  this.subject = subject;
}

the call() function. This function basically allows you to call a function defined somewhere else, but in the current context. The first parameter specifies the value of this that you want to use when running the function, and the other parameters are those that should be passed to the function when it is invoked.

Symbols

const toStringSymbol = Symbol("toString");
Array.prototype[toStringSymbol] = function() {
  return `${this.length} cm of blue yarn`;
};

let stringObject = {
  [toStringSymbol]() { return "a jute rope"; }
};
console.log(stringObject[toStringSymbol]());
// → a jute rope

“this” bindings: arrow function vs. one declared normally

Arrow functions are different—they do not bind their own this but can see the this binding of the scope around them.

Prototypes

All constructors have a prototype. This is the Function.prototype. But the actual prototype used to create the particular object will be held in the function’s prototype property.

Written on July 8, 2020