目录
  1. WIKI教程
  2. 学习ES6
  3. ES6 - Classes

ES6 - Classes

Object Orientation是一种遵循真实世界建模的软件开发范例。 面向对象，将程序视为通过称为methods机制相互通信的对象集合。 ES6也支持这些面向对象的组件。

面向对象的编程概念

首先，让我们理解

  • Object - 对象是任何实体的实时表示。 根据Grady Brooch的说法，据说每个物体都有3个特征 -

    • State - 由对象的属性描述。

    • Behavior - 描述对象的行为方式。

    • Identity - 区分对象与一组类似此类对象的唯一值。

  • Class - OOP方面的类是创建对象的蓝图。 类封装了对象的数据。

  • Method - 方法促进对象之间的通信。

让我们将这些面向对象的概念转换为现实世界中的概念。 例如:汽车是一个具有数据（品牌，型号，车门数量，车辆编号等）和功能（加速，换档，打开车门，打开前大灯等）的物体。

在ES6之前，创建课程是一个挑剔的事情。 可以使用ES6中的class关键字创建类。

可以通过声明类或使用类表达式将类包含在代码中。

语法:声明一个类 

class Class_name {  
}

语法:类表达式 

var var_name = new Class_name {  
}

class关键字后跟类名。 在命名类时必须考虑标识符的规则（已经讨论过）。

类定义可包括以下内容 -

  • Constructors - 负责为类的对象分配内存。

  • Functions - 函数表示对象可以采取的操作。 它们有时也被称为方法。

这些组件放在一起称为该类的数据成员。

Note - 类主体只能包含方法，但不能包含数据属性。

示例:声明一个类 

class Polygon { 
   constructor(height, width) { 
      this.height = height; 
      this.width = width; 
   } 
}

示例:类表达式 

var Polygon = class { 
   constructor(height, width) { 
      this.height = height; 
      this.width = width; 
   } 
}

上面的代码段表示一个未命名的类表达式。 命名类表达式可以写为。 

var Polygon = class Polygon { 
   constructor(height, width) { 
      this.height = height; 
      this.width = width; 
   } 
}

Note - 与变量和函数不同，不能提升类。

创建对象

要创建类的实例，请使用new关键字，后跟类名。 以下是相同的语法。 

var object_name= new class_name([ arguments ])

Where,

  • new关键字负责实例化。

  • 表达式的右侧调用构造函数。 如果参数化，构造函数应该传递值。

示例:实例化一个类 

var obj = new Polygon(10,12)

Accessing 函数

可以通过对象访问类的属性和函数。 使用 '。' 用于访问类的数据成员的dot notation （称为句点）。 

//accessing a function 
obj.function_name()

示例:将它们放在一起 

'use strict' 
class Polygon { 
   constructor(height, width) { 
      this.h = height; 
      this.w = width;
   } 
   test() { 
      console.log("The height of the polygon: ", this.h) 
      console.log("The width of the polygon: ",this. w) 
   } 
} 
//creating an instance  
var polyObj = new Polygon(10,20); 
polyObj.test();

上面给出的示例声明了一个类'Polygon'。 类的构造函数有两个参数 - 高度和宽度。 'this'关键字指的是该类的当前实例。 换句话说，上面的构造函数使用传递给构造函数的参数值初始化两个变量h和w。 类中的test ()函数打印高度和宽度的值。

要使脚本起作用，将创建Polygon类的对象。 该对象由polyObj变量polyObj 。 然后通过该对象调用该函数。

成功执行上述代码后，将显示以下输出。 

The height of the polygon:  10 
The width of the polygon:  20

静态关键字

static关键字可以应用于类中的函数。 静态成员由类名引用。

例子 (Example)

'use strict' 
class StaticMem { 
   static disp() { 
      console.log("Static Function called") 
   } 
} 
StaticMem.disp() //invoke the static metho

Note - 包含构造函数定义不是必需的。 默认情况下，每个类默认都有一个构造函数。

成功执行上述代码后，将显示以下输出。 

Static Function called

instanceof运算符

如果对象属于指定的类型，则instanceof运算符返回true。

例子 (Example)

'use strict' 
class Person{ } 
var obj = new Person() 
var isPerson = obj instanceof Person; 
console.log(" obj is an instance of Person " + isPerson);

成功执行上述代码后，将显示以下输出。 

obj is an instance of Person True

类继承

ES6支持Inheritance的概念。 继承是程序从现有实体（此处为类）创建新实体的能力。 扩展为创建较新类的类称为parent class/super class 。 新创建的类称为child/sub classes 。

一个类使用'extends'关键字从另一个类继承。 子类继承除父类的构造函数之外的所有属性和方法。

以下是相同的语法。 

class child_class_name extends parent_class_name

示例:类继承 

'use strict' 
class Shape { 
   constructor(a) { 
      this.Area = a
   } 
} 
class Circle extends Shape { 
   disp() { 
      console.log("Area of the circle:  "+this.Area) 
   } 
} 
var obj = new Circle(223); 
obj.disp()

上面的例子声明了一个类Shape。 该类由Circle类扩展。 因为，类之间存在继承关系，子类即，类Circle获得对其父类属性即区域的隐式访问。

成功执行上述代码后，将显示以下输出。 

Area of Circle: 223

继承可分为 -

  • Single - 每个类最多可以从一个父类扩展。

  • Multiple - 一个类可以从多个类继承。 ES6不支持多重继承。

  • Multi-level - 请考虑以下示例。 

'use strict' 
class Root { 
   test() { 
      console.log("call from parent class") 
   } 
} 
class Child extends Root {} 
class Leaf extends Child   
//indirectly inherits from Root by virtue of inheritance {} 
var obj = new Leaf();
obj.test()

Leaf类通过多级继承从Root类和Child类派生属性。

成功执行上述代码后，将显示以下输出。 

call from parent class

类继承和方法重写

Method Overriding是子类重新定义超类方法的机制。 以下示例说明了相同的情况 - 

'use strict' ;
class PrinterClass { 
   doPrint() { 
      console.log("doPrint() from Parent called… ");
   }
}
class StringPrinter extends PrinterClass { 
   doPrint() { 
      console.log("doPrint() is printing a string…"); 
   } 
} 
var obj = new StringPrinter(); 
obj.doPrint();

在上面的示例中，子类已经更改了超类函数的实现。

成功执行上述代码后，将显示以下输出。 

doPrint() is printing a string…

超级关键字

ES6允许子类调用其父类数据成员。 这是通过使用super关键字实现的。 super关键字用于指代类的直接父级。

考虑以下示例 - 

'use strict' 
class PrinterClass { 
   doPrint() {
      console.log("doPrint() from Parent called…") 
   } 
}  
class StringPrinter extends PrinterClass { 
   doPrint() { 
      super.doPrint() 
      console.log("doPrint() is printing a string…") 
   } 
} 
var obj = new StringPrinter() 
obj.doPrint()

StringWriter类中的doPrint()定义会发出对其父类版本的调用。 换句话说，super关键字用于调用父类中的doPrint（）函数定义--PrinterClass。

成功执行上述代码后，将显示以下输出。 

doPrint() from Parent called. 
doPrint() is printing a string.
<上一篇.ES6 - Collections
ES6 - 承诺( Promises).下一篇>
↑回到顶部↑
WIKI教程 @2018