1

when we do something like this

const something = class extends anything {
} 

What does it mean or what does it do? Does it store the value of class in a Variable? and how will this be different from

class something extends anything {
}
Alwaysblue
  • 9,948
  • 38
  • 121
  • 210
  • 2
    [class expression](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/class) – ASDFGerte May 21 '18 at 21:29
  • It stores a reference to a class. "and how will this be different from" --- you can override the `something` value in the second case. – zerkms May 21 '18 at 21:29
  • `class`es in JavaScript are first-class objects. There are no special "Type" definitions, they're just passed around like normal references. – Patrick Roberts May 21 '18 at 21:30
  • Not sure but [this](https://stackoverflow.com/questions/1470488/what-is-the-purpose-of-the-var-keyword-and-when-should-i-use-it-or-omit-it?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa) or [this](https://stackoverflow.com/questions/39591277/react-differences-between-component-create-with-extend-class-and-simple-const?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa) may help. – JBis May 21 '18 at 21:31

2 Answers2

4

There is no such thing as a "class" in javascript in the same way that they exist in class-based languages like Java. In JS, the class syntax is sugar over the same old constructor function. When you understand that, your question becomes easier to reason with.

This:

const something = class extends anything {
}

Is (roughly) analogous to this:

const something = function() {
}
something.prototype = Object.create(anything.prototype)

And the same similarity goes for these variants:

class something extends anything {
}

function something() {
}
something.prototype = Object.create(anything.prototype)

Functions are first class objects in javascript, which means they can be treated as values and passed around. The difference between const something = class... and class something... is that the first is a class expression (assigning a class like a value to a variable that can be passed around) and the second is a class declaration (declaring the class and giving it a name, but not assigning it to a variable), but they are interchangeable in most scenarios.

For clarification, when you do something.prototype = Object.create(anything.prototype), this is the actual inheritance that Javascript uses. It roughly means that you take the "prototype" of a constructor function and use it as a base for the next one, and that means that whatever object that you create using new something() will have the prototype of anything, plus any other attributes that you need to add to something.prototype.

You can get more in-depth info here: Inheritance and the prototype chain and Prototypal Inheritance in JavaScript

Alwaysblue
  • 9,948
  • 38
  • 121
  • 210
SrThompson
  • 5,568
  • 2
  • 17
  • 25
  • 2
    Just to avoid confusion between es6 and previous versions it's worth to mention: functions are hoisted (just as a var is) and classes are not (just like const and let are not). So `function something() {}` is available anywhere in the code, but `const something = function () {}`, `class something {}` and anything `const` are only available after the execution gets to their declaration. – leosteffen May 21 '18 at 23:58
  • 1
    @SrThompson Can you please also add the meaning of this line? `something.prototype = Object.create(anything.prototype)` like if you can explain this as well in your answer – Alwaysblue May 22 '18 at 17:04
  • 1
    @KuchBhi edited, I hope that makes it clearer. Probably someone on the internet can explain it better than me though :) – SrThompson May 22 '18 at 17:16
  • Is it same as normal prototype for example `Anything.prototype.something = function () { //Somethinng }` Just here we don't have to do `new something ()` – Alwaysblue May 22 '18 at 17:48
  • 1
    @KuchBhi not exactly. `Anything.prototype.something = ...` adds a property "something" to Anything's prototype. `something.prototype = Object.create(anything.prototype)` creates a new object (not a reference) with `anything`'s prototype and assigns it as `something`'s prototype. You can later do `something.prototype.someOtherAttributeOrFunction = ...` and add to `something`'s prototype without affecting `anything`'s prototype – SrThompson May 22 '18 at 23:42
2

Just to note that declaring const something = code means in practice that all of the following is impossible:

function something(){//code}
  var something;
  let something;
  class something{
//whatever
  }

That specific name is reserved, the purpose of const is that, otherwise, you could rewrite the class itself using the same name like this:

 var something = class anything {//code
  }

  var something = class anything {//code changes previous class
  }

And again, this is not possible:

class anything {//code
      }
class anything {//code changes previous class
      }

You can't change anything. So I think there is no practical difference between const something = class and class something extends anything because both are names reserved and "versions" of other classes.

Emeeus
  • 5,072
  • 2
  • 25
  • 37