Shulou(Shulou.com)06/01 Report--

This article mainly introduces the relevant knowledge of "how ES6 defines classes". The editor shows you the operation process through actual cases, and the operation method is simple, fast and practical. I hope this article "how to define classes in ES6" can help you solve the problem.

In ES6, class (class) is introduced as a template for objects, and classes can be defined by the "class" keyword. The essence of class is function, which can be seen as a syntax sugar, making object prototypes written more clearly and more like the syntax of object-oriented programming.

The operating environment of this tutorial: windows7 system, ECMAScript version 6, Dell G3 computer.

ES6 Class

In ES6, class (class) is introduced as a template for objects, and classes can be defined by the "class" keyword.

The essence of class is function.

Basically, ES6's class can be seen as a syntax candy, most of its functions can be done by ES5, and the new class writing only makes the object prototype more clear and more like the syntax of object-oriented programming.

Basic usage

Class definition

Class expressions can be anonymous or named.

/ / anonymous class let Example = class {constructor (a) {this.a = a;}} / / named class let Example = class Example {constructor (a) {this.a = a;}}

Class declaration

Class Example {constructor (a) {this.a = a;}}

Note: do not repeat the statement.

Class Example {} class Example {} / / Uncaught SyntaxError: Identifier 'Example' has already been / / declared let Example1 = class {} class Example {} / / Uncaught SyntaxError: Identifier' Example' has already been / / declared

Key points to be noted:

The class definition is not promoted, which means that the class must be defined before access, or an error will be reported.

The function keyword is not required for methods in the class.

Semicolons cannot be added between methods.

New Example (); class Example {}

The subject of the class

Attribute

Prototype

In ES6, prototype still exists, and although methods can be defined directly from the class, methods are actually defined on prototype. Override method / add method at initialization

Example.prototype= {/ / methods}

Add method

Object.assign (Example.prototype, {/ / methods})

Static attribute

Static attributes: the properties of the class itself, that is, properties defined directly inside the class (Class.propname), do not need to be instantiated. ES6 states that there are only static methods and no static properties within Class.

Class Example {/ / New proposal static a = 2;} / / currently feasible way to write Example.b = 2

Public attribute

Class Example {} Example.prototype.a = 2

Instance property

Instance properties: properties defined on the instance object (this).

Class Example {a = 2; constructor () {console.log (this.a);}}

Name attribute

Returns the name of the class that follows the class (if present).

Let Example=class Exam {constructor (a) {this.a = a;}} console.log (Example.name); / / Exam let Example=class {constructor (a) {this.a = a;}} console.log (Example.name); / / Example

Method

Constructor method

The constructor method is the default method of a class and is called when an instantiated object of the class is created.

Class Example {constructor () {console.log ('I'm constructor');}} new Example (); / / I'm constructor

Return object

Class Test {constructor () {/ / returns instance object this}} console.log (new Test () instanceof Test) by default; / / true class Example {constructor () {/ / specify the returned object return new Test ();}} console.log (new Example () instanceof Example); / / false

Static method

Class Example {static sum (a, b) {console.log (aquib);}} Example.sum (1,2); / / 3

Prototype method

Class Example {sum (a, b) {console.log (a + b);}} let exam = new Example (); exam.sum (1,2); / / 3

Example method

Class Example {constructor () {this.sum = (a, b) = > {console.log (a + b);}

Instantiation of class

New

Class must be instantiated through the new keyword.

Class Example {} let exam1 = Example (); / / Class constructor Example cannot be invoked without 'new'

Instantiate object

Shared prototype object

Class Example {constructor (a, b) {this.a = a; this.b = b; console.log ('Example');} sum () {return this.a + this.b;}} let exam1 = new Example (2,1); let exam2 = new Example (3,1) / / _ _ proto__ is obsolete and / / console.log (exam1.__proto__ = = exam2.__proto__) is not recommended; console.log (Object.getPrototypeOf (exam1) = Object.getPrototypeOf (exam2)); / / true Object.getPrototypeOf (exam1). Sub = function () {return this.a-this.b;} console.log (exam1.sub ()); / / 1console.log (exam2.sub ()) / / 2 this is the end of the introduction to "how ES6 defines classes". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.