Most optimal way to declare class methods in JavaScript Classy framework - javascript

I was doing a little reading up on OOP in JavaScript and was learning a bit about using the prototype object. In this article (a very good read, btw), the author says the following regarding declaring methods as attributes of a JavaScript class versus declaring the method on the prototype of the class:
This is actually not the optimal way to do it. A better way is to define the method on Person.prototype. Why is this better? Anyone? Anyone? Beuller? In the first version, each time you create a person, a new sayHi function will be created for him, where as in the second version, only one sayHi function is ever created, and is shared amongst all persons that are created - because Person.prototype is their parent. Thus, declaring methods on the prototype is more memory efficient.
After reading this, I began to thing about a JavaScript framework that I occasionally use to ease OOP with the language, Classy. In the examples given in their documents, and in pretty much all Classy code that I've ever written, I always declared the methods of a class directly as an attribute of it (as in right between the curly brackets instead of outside). I realize that directly declaring a method of a Classy class is done via object notation (JSON) instead of a normal JavaScript class having methods added directly inside of the function of the class.
What I am wondering is if objects created with Classy already take advantage of the performance savings of a method declared against a class's prototype. If I declare class methods in the same way as Classy's documentation, are the methods declared per instance of the class or declared as one method for all instances of the class to share? If the former, then am I able to, or supposed to, declare methods in a Classy class's prototype?
Sorry if I sound confusing.

Related

Why is there a distinction between privileged and public methods? How to know which to use?

Why is there a distinction between privileged and public methods?
Why should I even bother with public methods, aren't privileged
methods more natural? They feel more intuitive as they allow access
to private methods and variables like in java.
Is there a specific reason behind this or was this an error in the
spec(got a little ahead of myself there!) or am I missing something?
In what situation would you use a public method over a privileged method?
here is the code to demonstrate:
var Foo = function(){
var privateVar = "i am private";
function privateFunc(){
console.log(privateVar);
}
this.privilegedFunc = function(){
privateFunc(); // can access
}
};
Foo.prototype.publicFunc = function(){
privateFunc(); // cannot access
};
var foo = new Foo();
foo.privilegedFunc(); // prints "i am private"
foo.publicFunc(); // Uncaught ReferenceError: privateFunc is not defined
it's just like any OOP language (without the visibility keywords though), if you need a method to be called outside the instance, public, else, private.
Functions that are not bound to this, cannot be accessed outside the scope because they are defined and declared in the scope of the constructor function.
And as per your latest comment, there are many reasons and scenarios where you will have to expose an objects function in order to be used by other objects e.g.
As per your comment in this answer, lets see some advantages of the prototype approach.
By using prototype, you are able to change a method and the change will reflect to all instances that share the same prototype, without the prototype, each instance will have it's own version of the given method, therefore you will have to change them one by one.
Another advantage, is performance, functions/methods declared in the prototype are only created once, whereas without the prototype, each time you use the new keyword to instantiate from a constructor function, all functions inside the constructor functions scope will have to be created.
It's important to note that there's no distinction in the spec between "privileged" and "public" methods (in fact I don't think the spec uses these terms at all - Douglas Crockford does), they are governed by the exact same rules, the most fundamental of which in play being function scope.
Note: I'll follow your terminology in my answer, but I actually recommend against it: more often you'll find people calling your privileged methods public, and your public methods prototype methods.
In your example, this.privilegedFunc has access to the private variable privateFunc because they are defined in the same scope - that is, the scope of the Foo constructor function. privilegedFunc will be able to use its reference to privateFunc even when called from "outside", via the so-called closure mechanism of the language.
To answer your questions directly:
Why is there a distinction between privileged and public methods?
There isn't a fundamental distinction. You defined two functions in different scopes, and as such, they can reference different variables.
Why should I even bother with public methods, aren't privileged methods more natural?
Natural is quite a subjective term. However, if you don't wish to expose fields directly, you need to use a privileged function to manipulate them from the outside.
They feel more intuitive as they allow access to private methods and variables like in java.
That intuition is based only on familiarity :) No wonder that when you try to use Javascript as Java, the parts which work differently in the two languages will seem the least intuitive. This doesn't mean that you should try to imitate the style you would use in either in the other, some solutions are better suited for Javascript, some better for Java.
Is there a specific reason behind this or was this an error in the spec or am I missing something?
(Such a fundamental error in the spec?! God no.) I'm not sure what you mean by "this", but the difference in visibility is explained by function scopes, see above.
In what situation would you use a public method over a privileged method?
For example, if you don't need to expose private fields via closures. An other noteworthy difference is that functions on the prototype will be shared (i.e. effectively the same function instance) amongst instances, while private and privileged methods will be unique to the instance, which can have an effect on memory footprint.
What you call "privileged" methods aren't part of the language syntax. Rather, it's a design pattern. It is possible due to the fact that javascript implement closures (the ability of functions to access the scope of an outer function even after that outer function has returned).
There is a theory that all languages that implement closures (or even just first-class functions) can implement an object system. Several functional languages took this approach when adding OO to the language: that OO features are not part of the language syntax but a library that you can use (or even write yourself). One of the prime examples of this is CLOS (Common Lisp Object System) in Lisp. It's a library that adds OO features to the language without needing to modify the language syntax.
As you have discovered, using a closure to access local variables does a good enough job to emulate the "feel" of private variables and public methods. This is a feature of closures - that you can create your own OO system without needing OO features.
The OO system in javascript was added because OO was a big deal then. Admittedly, if Brendan Eich didn't add OO to javascript we could have evolved a (or several) OO systems from scratch using pure javascript. Indeed, in the early 2000s people weren't comfortable with the prototypal object system in javascript and developed their own OO system to emulate what they were used to.
In javascript, the OO system has no concept of private methods or variables. This was deliberate. Several other languages share this philosophy that private members are a "mistake". The idea that privacy is bad practice was borne out of years of experience using libraries that made a feature you needed to access private. For languages that encourages open source or distribution of code that's not too big of an issue. You can always modify the library code to export what you want. But for languages that encourages distribution of libraries as compiled binaries that's a big issue. At the time javascript was created, most OO languages had features allowing you to distribute your libraries as compiled binaries. So there was a small backlash against the concept of privacy.
So.. when would you use a closure to emulate private variables? Use it when you really need something like a private variable.
Why is there a distinction between privileged and public methods?
I'm assuming you read Douglas Crockford website (this page). It's a distinction I haven't really seen used by other authors. I don't make that distinction, but I do know that the function has access to the constructor closure.
Why should I even bother with public methods, aren't privileged methods more natural? They feel more intuitive as they allow access to private methods and variables like in java.
They have a different meaning than public methods.
A) They are defined by the constructor and as such, they have access to the constructor scope. That's their privilege.
B) They aren't shared by its prototype.
A means that the function will be instantiated every time the constructor is being called. When you use the prototype, it's just linked.
B means that they are essentially different functions.
obj1.privileged !== obj2.privileged
Is there a specific reason behind this or was this an error in the spec or am I missing something?
No error from where I see it. It's just a language feature.
In what situation would you use a public method over a privileged method?
When you don't need access to any closures inside the constructor and want to take leverage of the prototype chain.
Not sure about the semantics and naming convention, but as far as patterns, here's how I'd break this down for the most cases:
privateFunc:
I'd use this type of function whenever I want to encapsulate some functionality inside a function (either when reusing this function several times, or simply because it has a logical reason to do so) that I don't want to expose as an API, usually because it doesn't make sense as an API.
publicFunc:
I'd use this type of function whenever I want to expose an API, and the implementation doesn't require any "closed" (as in closure) variables. Basically anything that uses the state of an instance of the type but needs no other resources. Also for "static" methods that are used directly from the type (same as Object.keys() for example), but this won't be declared on the prototype but rather directly on the type.
priviledgedFunc:
Same use case as publicFunc except the use of helper, "closed" variables is either required or greatly simplify implementation. There's a downside to this technique in that these methods are properties of each instance, and incur runtime penalty to construct and assign.
Why is there a distinction between privileged and public methods?
It's a consequence, not a driver, of the language's design. You will actually do fine without bothering yourself with this terminology distinction I think.
Why should I even bother with public methods, aren't privileged
methods more natural? They feel more intuitive as they allow access to
private methods and variables like in java.
Is there a specific reason behind this or was this an error in the spec > or am I missing something?
In what situation would you use a public method over a privileged method?
There are a couple of situations where you would want to bother yourself with public methods that come to mind:
Privileged methods are defined everytime an object is created while public methods are defined once at parse time. So if you are writing something that creates a bucket load of object, e.g. particle system, you may want to use public method.
You can use public methods are pure function without instantiating an object.
Your are thinking about this the wrong way. You should be thinking about scope here and not access level (public/private/protected) Javascript is not a traditional object oriented programming language.
In your example, the "privateMethod" is simply scoped to the "Foo" function, and thus cannot be accessed outside the function. Your "privilegedFunction" is attached to "this" which in javascript is the context of the "Foo" function. You can access it from an "instance" of Foo as your example shows because of scoping, and it has nothing to do with access level.

Can you convert a superclass

Can you convert a superclass reference into a subclass reference? A subclass reference into a superclass reference? If so, give examples. If not, explain why not
JavaScript doesn't have typed references at all. An object reference is just an object reference, the full and complete extent of any type information it has is that it's an object reference. So there's no need to convert a reference from a superclass reference to a subclass reference.
The object itself (not the reference) does have some information that, in some ways, links it back to its "class" (which is to say, its constructor function), indirectly via its prototype — assuming that A) The prototype isn't changed via Reflect.setPrototypeOf (a reasonable assumption, but there's no guarantee), and B) the prototype property on the constructor function doesn't get changed (also frequently a reasonable assumption, but not a guarantee, once the codebase is done initializing [and not until then]). For instance, if an object is created via a constructor function, in the normal case it inherits a constructor property from its prototype which, in the normal case, points back at the constructor function. You can't really rely on it, because if someone has modified the object referenced by the constructor function's prototype property it may not have a constructor property at all (and thus inherits it from its prototype) or may have one pointing at the wrong function.
It's important to remember that JavaScript is a prototypical language, not a class-based one. The new class semantics in ES6 are almost entirely syntactic sugar for setting up chains of constructors and their prototypes. ("Almost" because there's some plumbing related to subclassing builtins like arrays that we couldn't do previously.) One aspect of JavaSCript not being class-based is that questions like this don't really relate to it.

Why className.proptotype.constructor = newConstructor() does not change the constructor of Javascript Class?

I tried changing the constructor function of a class by
className.proptotype.constructor = newConstrcutor;
This property now refers to the newConstructor but when i try to create an instance of the class, still the old constructor is executed. So, what exactly is the use of className.proptotype.constructor ?
Thanks
Each constructor has a pointer to an object called prototype. The prototype is the main mechanism that JavaScript supports to share properties and methods among objects of the same type.
In addition, the prototype can be used to support inheritance; not exactly in the way that it is done in other OO languages like Java, c# etc. So you can imagine that there is a mechanism that allows the interpreter to navigate from one prototype to another via a chain that is implicitly formed.
In the same way that constructor point to a prototype object, the prototype can also point to its constructor; You can think of it as a relation between constructors and prototypes.
One of the uses of the className.proptotype.constructor property is when you want to debug your code. A JavaScript debugger would clearly state the type (the constructor it was created from) of an instance.
for more details you can read this
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/constructor

What is the difference between saying “HTMLElement.prototype.someFunc =” and “HTMLElement.someFunc =”?

I have, in many ocassions been able to register methods for all HTMLElements in both ways.
So I am curious, is there any difference?
Should I prefer one method over the other one?
What would be the right way to do it?
using prototype is making the function available to all objects in the prototype chain. Its basically extending the class. While other one is just adding a property to the current element. But as Felix suggest the right thing would be not to do this at all.
Because JavaScript is a prototype based language and not a Class based language they keyword .prototype.variable or .__proto__.variable (for Math) is used to directly access the prototype (Like the Class Definition in classed based languages) and modify it effecting ALL of its instances even if the instances has been created before the prototype is modified. Whereas .variable without accessing the prototype only affects the specified instance.
In short "HTMLElement.prototype.someFunc =" will allow ALL HTMLElements (and prototypes which inherit from HTMLElement" to access someFunc. And HTMLElement.someFunc should only be used to allow a specific instance of HTMLELement access to someFunc.

arguments.callee.caller.this?

I'm 99.9% positive that this isn't possible, but there may be some obscure ecmascript function I don't know of in JS1.9 or something.
Does anyone know of any way to get the this object of the calling function?
If what you're really trying to do here is control access to your member variables and thus your question is really: "How do I restrict access to member variables?", then maybe you would benefit from reading this article "Private Members in Javascript". It's possible, but since it isn't a built-in language feature, it requires a particular style of coding your classes and methods to make it work.
I'm not an expert on this, but I think it uses a closure of the constructor to control access. Methods declared inside the constructor will have access to instance variables declared in the constructor. Any caller from outside the constructor will not (whether those other callers are other methods, derived class methods or outside callers).

Categories