Farms: Modular Javascript #6 - Classical Inheritance & OOP with JS
Productivity | Information | History | View | Quality
31499View
In this video, we will start covering object oriented programming in Javascript. There are several ways to do it - the first is called "classical inheritance". Here's the link to the "inherit" function I use here: https://github.com/nodejs/node-v0.x-archive/blob/master/lib/util.js#L634-L644 Using a constructor, a prototoype, and the "new" keyword, we can create multiple copies or "instances" of a module, each with unique properties, but shared functionality. We can also implement inheritance in Javascript. If we create a new module, we can inherit the functionality of a parent module with a simple inheritance helper function.
Comments
-
Thanks for your help. But I have a question:
if we placed var Musician = function() {... after inherits()
The page give a message: belly.getInstrument is not a function(…)?
What going on for this? -
es6 has the class syntax like you see in other languages
-
10:28 what is that IDE magic?
-
Thanks for great tutorial, this really helped.
-
ReferenceError: inherits is not defined
-
What is super_ exactly? It kind of seems like prototype, but that doesn't really make sense. Why would there be two classes from which the ctor object inherits from?
-
For those familiar with Java or C#, saying Person.call(this, name) is the equivalent of saying super(name).
-
Can you teach us how to organize a big/small javascript project. With some documentation things like i saw in that nodejs file:
/**
* Inherit the prototype methods from one constructor into another.
*
* The Function.prototype.inherits from lang.js rewritten as a standalone
* function (not on Function.prototype). NOTE: If this file is to be loaded
* during bootstrapping this function needs to be rewritten using some native
* functions as prototype setup using normal JavaScript does not work as
* expected during bootstrapping (see mirror.js in r114903).
*
* @param {function} ctor Constructor function which needs to inherit the
* prototype.
* @param {function} superCtor Constructor function to inherit prototype from.
*/ -
Keep going! This kind of video's is what the world needs.
-
BOBBY!!!
-
hey i do prototypal inheritance differently is this ok? and whats the difference btwn what you did?
``` var Musician = function(sounds) {
this.sounds = sounds;
};
Musician.prototype.solo = function(length) {
var solo = "";
for (var i=0; i<length; i++) {
solo += this.sounds[i % this.sounds.length] + " ";
}
console.log(solo);
};
var Guitarist = function() {
Musician.call(this, ['Twang', 'Thrumb', 'Bling']);
this.strings = 6;
};
Guitarist.prototype = Object.create(Musician.prototype);
Guitarist.prototype.constructor = Guitarist;
Guitarist.prototype.tune = function() {
console.log('Be with you in a moment');
console.log('Twoning sproing splang');
};
var Bassist = function() {
Musician.call(this, ['Boink', 'Bow', 'Boom']);
this.strings = 4;
};
Bassist.prototype = Object.create(Musician.prototype);
Bassist.prototype.constructor = Bassist;
var nigel = new Guitarist();
nigel.tune();
nigel.solo(8);
var derek = new Bassist();
derek.solo(4);
``` -
loving your videos and series! keep the good work, this is some good material, helping me heaps. cheers
-
Thanks for the clear video. As a backend developer I am horrified by this though xD Must be the hackiest way of OOP I have ever seen (and I write a lot of PHP... o.o').
-
So i think many things have changed with ES6 now with classes right??
-
It's very helpful series for JS beginner like me, i like your presentation, it's very easy to understand, clearly and effective.
Thanks a lot. -
doesn't ES6 have a built-in 'inherits'? superclass or something or other.
-
EDIT: looks like extends copies over methods and attaches them directly to the object, so no, they don't quite do the same thing. one thing i didn't understand about inherits is how it created Musician as a new instance of Person. i'd expected to see something like ctor.super_ = new superCtor; but it was missing the 'new' keyword.
does inherits do the same thing as underscore.js _.extends? -
What makes the inherits function special instead of simply using Musician.prototype = Object.create(Person.prototype)?
-
Thank you so much for creating such content rich videos.
Can you expand upon how best practices from module programming such as a clean API extends to the realm of OOP? I guess im confused if I can combine both of these together and if so how would I implement an API in a class?
When should I use prototypal inheritance versus object literal pattern? in your opinion? great videos btw!