Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings
This repository was archived by the owner on Feb 19, 2018. It is now read-only.
/discussPublic archive

CS classes and ES6 Classes (WIP)

Andre Lewis edited this pageSep 30, 2016 ·22 revisions

One of the breaking changes that resulted from ES6 is the creation of theclass keyword. While there are quite a few shared idioms in the ES6 version, there are quite a few incompatibilities which have to be dealt with, especially since these features already existed in CS.

Here is a reference on ES6 classes

Here is a reference on CS classes

In reality CS expands on the ES native function by adding member functions and member variables as prototype members of the function.

Part of this is how ES deals with thenew keyword (Fromthis post):

"using new with a constructor that returns an object will evaluate to the returned object, whereas returning any non-object will evaluate to the new instance."

Basic CS Classes:

class Aclass B extends class A

Which results in the following JS currently:

// Hoist our variables and a function to 'extend' one object by another// by setting the child object's member prototypes from one object to another.// The 'extend' function is only included if the `extend` keyword is used. var A,      B,    extend = function(child, parent) {       for (var key in parent) {         // Set any non JS functions and properties to the child        if (hasProp.call(parent, key)) child[key] = parent[key];       }       // Establish prototype link, and correctly assign the constructor property       // for all instances of the child      function ctor() {         this.constructor = child;       }       ctor.prototype = parent.prototype;       child.prototype = new ctor();       child.__super__ = parent.prototype;       return child;     },    // Shortcut function    hasProp = {}.hasOwnProperty;// Wrap this new function in a closure (and call it) to set our internal stateA = (function() {  function A() {}  return A;})();// Wrap this new function in a closure (and call it) to set our internal stateB = (function(superClass) {  extend(B, superClass);  function B() {    return B.__super__.constructor.apply(this, arguments);  }  return B;})(A = (function() {  function A() {}  return A;})());

The equivelent CS6 -> ES6 code would be:

# Coffeescriptclass Aclass B extends A

transforms into:

// ES6class A {};class B extends A {};

How ES6 changes from the original CS classes

  • Addition of several keyword, such asstatic andget/set.
  • How class inheritance is inferred (ES6 now uses Symbols for inheritance chains)
  • Usage rules forsuper
  • Inline statements within a class definition are not directly supported.

ES6 Documentation

CS Class Keywords/Sugar

  • class
  • new
  • extends
  • super
  • constructor
  • @ (this)

ES6 Class Keywords

  • class
  • new
  • extends
  • constructor
  • static
  • get/set
  • super
  • const
  • __proto__

#Oddities of ES6ES6 doesn't do class hoisting: in other words definitions of a class must occur before they are called/created.

ES6 can have a class definition:class Example {} or named and unnamed class statements:var ex = class Example {} andvar ex = class {}

Definitions inside a class are run as if thestrict keyword is in effect.

ES6 classes allow only functions and methods, and don't support the notion of inline code within the class. CoffeeScript allows declaration of variables and random execution in the class definition.

ES6 uses the newSymbol primary type to evaluateinstanceof :

Making instanceof extensible. In ES6, the expressionobject instanceof constructor is specified as a method of the constructor:constructor[Symbol.hasInstance](object). This means it is extensible.

ES6 Class methods arenot enumerable

In ES6 thesuper keyword can only be called once in the constructor. In derived classes,super() must be called before you can usethis. Leaving this out will cause a reference error.

ES6 class prototype.constructor can't be changed. For instance theMyClass.prototype.constructor property is non-writeable, non-enumerable, and non-configurable

Clone this wiki locally

[8]ページ先頭

©2009-2025 Movatter.jp