To use or not to use ES6 classes?

Probably the most discussable feature of ES6 - "class" syntactic sugar. Many people like it and many - not.

Is it good to have a "class" in language with no classes?

Do JS needs class complexity?

Should you use "class" keyword or keep using object literal notation which I found the most simple (ES6 actually made it even shorter) or prototypes, factories, anything else? Which one you use?

Do you think ES6 classes will become really popular and everyone will use them after X years or do ES6 classes will be removed in future?

How to do this with class?

Object.getOwnPropertyDescriptor(this._form.constructor.prototype, 'elements')
.get.call(this._form);

github.com/joshburgess/not-awesome-es6-classes

sitepoint.com/javascript-object-creation-patterns…

Use them where you would previously have used constructor functions with prototypes.

Don't use them just because "class" feels more authoritative than having a bunch of functions and objects.

Classes are a wonderful tool in JS and you should learn them, but just because you have a hammer that doesn't mean everything is now a nail. Try to figure out what works best and be aware of the caveats before deciding whether you need a class or not.

I think "purists" like Eric Elliott who try to pretend these language features don't exist and instead come up with their own convoluted inheritance systems have it wrong, but pretending JS is now Java simply because we have syntax that looks kinda like Java if you squint isn't the answer either.

The beautiful thing about inheritance in JS is that classical inheritance is just a special case of prototypal inheritance, the class syntax just codifies a common idiom by giving you syntactic sugar for it. But the most important thing to know about inheritance is that you rarely need inheritance. In the vast majority of cases you instead simply want composition.

I actually found myself object composition over inhertiance much simplier and never using prototypes anymore, except when you need polyfills which have new keyword / constructor function.

Object.assign() from ES6 is my 'class' keyword and there is still Object.create().

I agree with Eric Elliott about many arguments and he is not the only one. Here is Spotify engineer's YouTube channel I enjoy watching - https://www.youtube.com/watch?v=wfMtDGfHWpA

There are also many questions on Quora - quora.com/Are-ES6-classes-bad-for-JavaScript

I wouldn't have any questions if we would have not a 'class', but, let say 'prototype' keyword, but with much more support, because how classes are still implemented, is a joke, you can't get a constructor function name, for example.

Prototype MyInput extends HTMLInputElement {
    static readonly property1; // readonly - non-writable
    nonenum protected property2; // protected = non-configurable; for non-enumerable have no ideas :(
    set value(value) {
       parent:set.value = value; // call parent descriptor so browser would redraw, for example, native form controls
       // do custom logic
   }
   getName() {
      console.log(self.name); // self = this.prototype.constructor or any special object/keyword inside prototype/"class" containing information about prototype (class)
      // parent:parent:parent.doSomething() // call a method on prototype chain 3 levels deeper
   }
}

And now the most powerful feature of prototypes classes can't:

Extend MyInput {
    // same as Array.prototype.customMethod = function ... but don't need to write Array.prototype on each line
}

Or something like this.

I think you got something wrong there, mate. JS always had classes before. They just look a bit different:

function MyClass() {
  this.foo = function() { console.log('Foo'); }
}

var myObj = new MyClass();
myObj.foo();

So it's not that discussed ;) The ES6 class keyword just makes it look more like a class compared to other programming languages, like C++. I think that is a good thing!

With ES6 class being just syntactical sugar, you even still can use all the old stuff. I, for example, like to make an interface with the class keyword, but have all methods throw 'Not Implemented' and then use prototype to implement them some place else. This results in a very clean and readable interface, as the declaration is always just one line:

'use strict';
class MyClass {
  /**
   * Do not forget to comment and document everything :)
   */
  foo() { throw 'Not Implemented'; };
  // many other methods declared here, but defined someplace else
};

// maybe even in some other file
MyClass.prototype.foo = function () { console.log('Foo'); };

// Use it the same way as before `class`
var myObj = new MyClass();
myObj.foo();

Since ES6 classes make things easier, I am pretty sure people will start using them and they will not be removed in the future.

As for your code example, you do it the same way as class is just syntactical sugar. It does not change how stuff works under the hood.

@mevrael: Question for you, since I get the feeling you do not understand that expression, yet: What do you think the term syntactical sugar means? . Since I am nice, here the solution: Write something differently (mostly shorter and more pleasing), but still do the same.

"JS always had classes before" - do you know what class is and how it is different from prototypes? How OOP in jS is different from all other OOP you know?

Do you know what "this" in JavaScript means?

What you wrote is called a "constructor function".

About your "example" this is how it is done in JS even shorter using object literal notation and ES6:

const MyClass = {
  foo() {
    console.log('Foo')
 }
}
MyClass.foo();

As for my code example you didn't wrote your code using ES6 class. Can you?

You have form with ID form1;
Form has <input type="text" name="elements">
Show me a code of class in ES6 which will return real elements collection (array of all inputs) of this form - document.forms.form1.elements
What you need to do is to call elements getter descriptor on parent/prototype from child

Also how you can create (non)enumerable, non(configurable) properties using ES6 class syntax?

ES6 classes are here to help you make your code cleaner and organize it better, compared to the function inside of function thing which is ES5.

If you plan on building a big project which will be worked on for a long time and a lot of features will be added, then you have to figure out a good structure for your app.

You could put everything in one file and be done with it but when you get back to it one day, it will be chaos and you'll have a lot of fun figuring out what you did 6 months or 2 years ago.

To use ES6, use a tool like Babel or something similar until all of the browsers have 100% ES6 support.

ES6 helps you a lot if you know how to use it. Before you begin using it, make sure to study it in details so you don't get stuck in the middle of your development cycle.

JavaScript wasn't built for a lot of the features it has today but people still use it and it helps them, so using classes in a non-class language doesn't matter.

How would you write this code in Java, PHP or C#? It should probably be similar.

@mevrael I am not sure what you want. The class keyword generates nothing else than a constructor function. Just with an easier syntax. .prototype and .constructor are still the same as before. And your task: isn't it something like Array.from(document.querySelectorAll('#form1 [name=elements]')) ?

@maruru Mev-Real is right. JS is strongly object orientated, not class orientated. There isn't something like a class in JS (even now with the class keyword) and this is good. Don't project the classes of other languages into JS.

@lichtjaeger I never said JS was class oriented. Maybe I oversimplified my example. The thing is, you always could make something which looks a lot like a class. It can be a function and an object at the same time as well. JS is really open for many concepts. So yeah. It's not a real class. But for simplicity and the point of my argument: If you want something to be (something like) a class, it has always been possible, even more so now that we have the class keyword. Making a statement like "classes (and new; taken from sources) were introduced with ES6, making everything more complex. JS never had classes before" is just wrong.

@mevrael class is just syntactical sugar, so with class you do that just like you did without class. See my answer for more info.

How I can do this with "class" in ES6? Object.getOwnPropertyDescriptor(this._form.constructor.prototype, 'elements').get.call(this._form);

You have form with ID form1;
Form has <input type="text" name="elements">
Show me a code of class in ES6 which will return real elements collection (array of all inputs) of this form - document.forms.form1.elements
What you need to do is to call elements getter descriptor on parent/prototype from child

Also how you can create (non)enumerable, non(configurable) properties using ES6 class syntax?

Thread

To use or not to use ES6 classes?

Responses(3)

Recent threads

Search Hashnode

To use or not to use ES6 classes?

Responses(3)

Recent threads