JS创建类和对象的两种不同方式_基础知识-js教程-PHP中文网

JS创建类和对象的两种不同方式_基础知识

php中文网

发布： 2016-05-16 16:40:01

原创

1393人浏览过

在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类中的成员函数

登录后复制

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

PixarAI

PixarAI是一个AI驱动的皮克斯风格海报生成器，可以帮助用户创建迪士尼皮克斯风格的海报

125

查看详情

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

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