📜 ⬆️ ⬇️

Does JavaScript need classes? part 2

see part 1

Performance: creating classes via __proto__


image
On performance, Object.create unfortunately does not give much results (especially with the second argument - descriptors). Unlike using __proto__ directly, which turned out to be even faster than the constructor function binding with the new operator - see jsPerf . I also note that the use of descriptors is not particularly convenient.

CloneJS nano


For the reasons above, let's create the clone function:
function clone(proto, properties){ properties.__proto__ = proto; return properties; } 

Cloning

In prototype-based systems, two methods are provided for creating a new object: cloning an existing object, or creating an object from scratch. To create an object from scratch, programmers are provided with syntactic means of adding properties and methods to an object. Further, a complete copy can be obtained from the resulting object - a clone. In the process of cloning a copy inherits all the characteristics of its prototype, but from that moment it becomes independent and can be changed.
© Wikipedia

The clone() function, as the name suggests, creates clones of objects. A clone is a lazy shallow copy , that is, it is not actually a copy, but simply a reference to an object, but if you add / replace any of its properties, it will not affect the parent object (prototype).
All objects in JavaScript are clones of Object.prototype (except for himself and objects created with Object.create(null) ).
')
 /// "" var duck$ = { name: "Unnamed", quack: function(){ console.log( this.name +" Duck: Quack-quack!"); } }; ///  var talkingDuck$ = clone( duck$, { quack: function(){ duck$.quack.call(this); console.log("My name is "+ this.name +"!"); } }); ///  var donald = clone( talkingDuck$, {name: "Donald"}); 

Alternatively, you can use the object-oriented version:

 /// object$ –     var object$ = { clone: function(properties){ properties.__proto__ = this; return properties; }; /// "" var duck$ = object$.clone({ name: "Unnamed", quack: function(){ console.log( this.name +" Duck: Quack-quack!"); } }; ///  var talkingDuck$ = duck$.clone({ quack: function(){ duck$.quack.call(this); console.log("My name is "+ this.name +"!"); } }); ///  var donald = talkingDuck$.clone({name: "Donald"}); 

Compatibility


__proto__ is part of ECMA Script 6 , which must be approved in December 2013 .

It is fair to note that the clone function does not actually create any objects, but simply modifies the properties of its prototype object. This can be easily fixed:
 function clone(proto, properties){ var newObj = {__proto__: proto}; for(var key in properties) newObj[key] = properties[key]; return newObj; } 

But then we will lose in performance. It is better to enter the rule:
The use of the second argument after cloning is undesirable, and is possible using only its own properties.
This rule will also ensure compatibility with Internet Explorer 6–10 and ECMA Script 3:
  function clone(/** Object */proto, /** ObjLiteral= */ownProperties){ function Clone(ownProperties){ for(var key in ownProperties) this[key] = ownProperties[key]; }; Clone.prototype = proto; return new Clone(ownProperties); } 



This is how the clone.js framework was created.

Source: https://habr.com/ru/post/192806/


All Articles