So I had a bunch of stuff to say, okay not really, and then I checked my Dashboard on Learn and saw the beautiful sight that my Graduation Dashboard has appeared! That means I’m past 75% done and in the final stretch. Being 75% done in <3 months has me on track to be done before the end of June! I’m stoked.
So something that I had been struggling with is how Ruby is a class-based object-oriented language and JavaScript is a prototype-based object-oriented language. This always confused me. The whole prototype thing in general always confused me in JS. Until now:
There are two primary types of object-oriented (OO) languages: class-based and prototype-based.
In a class-based OO language, such as Ruby, Java, C#, and C++, we must first design the Class, or blueprint, of an object, and then create objects from that blueprint in order to use them.
Imagine a set of instructions from IKEA as the Class, and your assembled Fthugënbøller bookcase as the object.
JavaScript uses prototypal OO. Instead of creating a nonfunctional class definition, we actually create the object, which is then used as a prototype to create other objects.
In the real world, this would be like taking a bunch of laminated wood and assembling a Fthügënbøller, and then using that as your guide, or prototype, for creating other Fthügënbøllers, and Fthügënbøller-like objects.
That real-world analogy did it for me. Of course, then I learned about ES6 JS Classes. However, knowing how something can be built multiple ways is a strong skill to have. Although, I have to admit, after doing a lab testing prototypal inheritance works and is accomplished by using Object.create() among other things. Then doing a lab testing the use of classes. I much prefer classes haha.
I also ran into an issue tonight doing that prototype lab:
function Point (x, y) {
this.x = x
this.y = y
}
Point.prototype.toString = () => {
return `(${this.x}, ${this.y})`
}
// In the terminal
> var p = new Point(2,3)
undefined
> p
Point { x: 2, y: 3 }
> p.toString()
'(undefined, undefined)'
I couldn’t figure out why this was returning undefined. I finally just removed the arrow function and used a normal(?) function and it worked:
Point.prototype.toString = function () {
return `(${this.x}, ${this.y})`
}
This was interesting to me and I need to dive deeper into why this happened. As I read You Don’t Know JS, I find myself no happy with figuring these problems out and moving on. I want to understand the why behind them. Although, if anybody out there knows feel free to fill me in.
Time spent today: 8:45
Time spent total: 353:05
Lessons completed today: 14
Lessons completed total: 573
