<p>Open developer console to see output</p>
// class definition
class FooClass {
constructor(bar) {
this.bar = bar;
}
frobnicate() {
console.log(`My bar is a ${this.bar}!`);
}
}
// constructor function
function FooConstructor(bar) {
this.bar = bar;
}
FooConstructor.prototype.frobnicate = function() {
console.log(`My bar is a ${this.bar}!`);
};
// prototype with factory function
const FooPrototype = {
frobnicate() {
console.log(`My bar is a ${this.bar}!`);
}
};
function createFoo(bar) {
const foo = Object.create(FooPrototype);
foo.bar = bar;
return foo;
}
const foo1 = new FooClass("baz");
const foo2 = new FooConstructor("baz");
const foo3 = createFoo("baz");
console.log(foo1, foo2, foo3);
foo1.frobnicate();
foo2.frobnicate();
foo3.frobnicate();
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.