JS 中 Class - 类创建

Class - 类创建

Class类实现了在JavaScript中声明一个新的类, 并通过构造函数实例化这个类的机制。通过使用Class.create()方法, 你实际上声明了一个新的类, 并定义了一个initialize()方法作为构造函数, 一旦你在这个声明的类的prototype中实现了改该方法, 你就可以使用new操作符来创建并实例化一个类。

Knowledge Prepare - 知识准备

在JavaScript中, 当你定义了一个新的函数, 你实际上声明了一个新的类, 而这个函数本身就相当于类的构造函数。 下面的代码向你展示了两种不同的方式来创建一个新的Person类, 而Person.prototype的定义也紧跟在函数定义之后。

var Person = function(name) { // 一个匿名函数, 并将这个函数赋值给一个Person变量, 此时Person成为一个类

this.name = name;

}

function Person(name) { // 直接定义一个叫做Person的函数表示Person类

this.name = name;

}

Person.prototype = { // 定义Person的prototype域

printName: function() {   // 定义一个print函数

alert(this.name);

}

}

当你通过函数的方式声明了一个类之后, 你就可以通过new操作符来实例化这个类。这样, 你就可以调用类的成员函数来完成你的逻辑。

var person = new Person("Joe Smith"); // 使用new操作符来新建一个Person的实例, 并赋给变量person

person.printName(); // person就可以看作是一个实例的引用(reference), 所以可以通过这个引用来调用Person类中的成员函数

我们来总结一下创建一个新的类的实例的整个流程和步骤：

1. 通过定义一个函数的方式(匿名或者实名)来声明一个新的类.
2. 如果有必要, 定义这个新的类的prototype域.
3. 使用new操作符紧跟你所定义的函数来创建一个新的类的实例. 一旦JavaScript编译器碰到了new操作符, 它实际上创建了一个空的类实例变量.
4. 将所有这个类的prototype域中的属性与方法复制到这个新的实例中, 并将其成员函数中所有的this指针指向这个新创建的实例.
5. 接下来, 执行紧跟在new操作符后面的那个函数.
6. 当你执行这个函数时, 如果你试图对一个不存在的属性进行赋值, JavaScript编译器将自动为你在这个实例范围内新创建这个属性.
7. 函数执行完毕后, 将这个初始化完成的实例返回.

在Prototype中, 使用Class对象, 你可以以一个比较简单的方式来声明一个新的对象。通过使用Class.create(), prototype为你创建了一个默认的构造函数initialize(), 一旦你实现这一函数, 就可以以一个类似Java中构造函数的方式来创建一个新的类的实例。

Source View - 源码解析

var Class = { // 全局静态类, 用于声明一个新的类并提供构造函数支持

create: function() {

return function() { // 返回一个函数, 代表着这个新声明的类的构造函数

// 一个命名为initialize的函数将被这个类实现作为类的构造函数

this.initialize.apply(this, arguments);// initialize函数将在你实例化一个变量的时候被调用执行(即上面7个步骤中的第5步)

}

}

}

Field & Function Reference - 属性方法一览

Class ( 静态 )

Method / Property	Kind	Arguments	Description
create()	静态方法	/	用于声明一个新的类并提供了一个名为initialize构造函数支持

Analysis & Usage - 分析与使用

通过Class类, 你可以很容易地使用构造函数的方式创建一个新的类, 这对于Java程序员来说或许更加容易被接受。下面我们列出了Java和JavaScript各自声明和创建一个新的类的代码对比, 我们可以看到, 他们是如此相似：

var Person = Class.create(); // 类的声明              |public class Person { // 类的声明

Person.prototype = {                                 |    private String name;

initialize: function(name) { // 构造函数          |    public Person(String name){ // 构造函数

this.name = name;                               |       this.name = name;

}                                                 |    }

printName: function() { // 成员函数               |    public void printName(){ // 成员函数

alert(this.name);                               |       System.out.println(name);

}                                                 |    }

}                                                    |}

var person = new Person("Joe Smith");// 创建实例      |Person person = new Person("Joe Smith");// 创建实例

person.printName(); // 函数调用                       |person.printName(); // 函数调用