`
jasonw68
  • 浏览: 153074 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

Prototype 使用手册- Class - 类创建

阅读更多

在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中构造函数的方式来创建一个新的类的实例。

var Class = {  // 全局静态类, 用于声明一个新的类并提供构造函数支持
  create: function() {    
    return function() { // 返回一个函数, 代表着这个新声明的类的构造函数
      // 一个命名为initialize的函数将被这个类实现作为类的构造函数
      this.initialize.apply(this, arguments);// initialize函数将在你实例化一个变量的时候被调用执行(即上面7个步骤中的第5步)
    }
  }
}

 

通过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(); // 函数调用
 
分享到:
评论

相关推荐

    prototype-151-api

    ### Prototype 1.5.1 API 全面参考 #### 概述 Prototype 是一个 JavaScript 框架,旨在简化动态 ...以上是对 Prototype 1.5.1 API 参考手册中的主要知识点进行了详细的介绍,可以帮助开发者更好地理解和使用这个框架。

    Prototype-v1.6.0使用手册

    **Prototype-v1.6.0使用手册** Prototype是一款强大的JavaScript库,它为Web开发提供了丰富的功能,简化了DOM操作,增强了对象和数组的功能,并引入了AJAX交互的核心机制。Prototype-v1.6.0是该库的一个版本,包含...

    prototype-chm 操作手册

    例如,了解如何使用`Object.extend()`来扩展对象,以及如何利用`Class.create()`创建自定义类。 在DOM操作方面,Prototype提供了一系列简洁的API,使得操作HTML元素变得异常简单。手册会详细介绍`Element`、`$$`、`...

    prototype 1.4-1.5 中文手册大全

    4. **Class系统**:Prototype引入了模拟类的概念,通过`Class.create()`方法创建类,并支持继承和混合(mixin)模式,这极大地增强了JavaScript的面向对象编程体验。 5. **JSON支持**:随着Web服务的流行,...

    Prototype中英文手册

    5. **对象和类**:阐述Prototype提供的Object.extend、Class.create等方法,以及如何创建和使用自定义类。 6. **函数和工具**:包括Array、String、Number等基本类型的方法扩展,以及便利的工具函数,如Element、...

    prototype1.6手册

    7. **Class 系统**:Prototype 引入了类的概念,允许创建有构造函数和原型链的类,如 `Function.prototype.create()` 和 `Class.create()`。 8. **JSON 支持**:Prototype 提供了 JSON 解析和序列化的方法,如 `...

    prototype 1.6中文手册 chm+prototype 1.6.js源码 最新版

    对象操作部分则讲解了Prototype如何支持面向对象的编程,如Class构造函数、Object.extend继承机制等。DOM操作部分涵盖了元素的创建、查找、修改和删除,而事件处理章节则解释了如何绑定和触发事件,以及如何处理跨...

    prototype中文手册及API

    5. **模拟类和继承**:通过`Class.create`和`Object.extend`等函数,Prototype 实现了JavaScript中的类和继承概念。 6. **Ajax组件**:Prototype 还包含了一些预定义的UI组件,如`Autocompleter`和`Slider`,这些...

    prototype开发者手册(中文版)+prototype.js

    比如,Prototype推崇模块化和面向对象编程,提倡使用类(Class)和实例(Object)来组织代码,这有助于创建可复用和可扩展的组件。同时,Prototype遵循DRY(Don't Repeat Yourself)原则,减少重复代码,提高代码...

    网页模板——Prototype 开发者手册 PDF版.zip

    7. **Class系统**:Prototype引入了模拟面向对象编程的Class系统,允许开发者定义和继承类。 8. **Prototype与其他库的兼容性**:尽管Prototype对JavaScript原生对象进行了扩展,但它也提供了`Prototype.Browser`...

    prototype 中文开发手册和chm帮助文档

    CHM帮助文档通常包含了详细的API参考,对于每个函数、方法和类,都会提供参数、返回值、示例代码等详细信息,帮助开发者理解和使用Prototype的各种功能。而PDF手册则可能更注重于教程性质,从基础知识到进阶应用,...

    prototype 1.4 开发者手册(中文PDF)

    在JavaScript原生环境中,面向对象编程相对复杂,而Prototype通过添加类(Class)和继承(Inheritance)机制,使得JavaScript具备了更接近传统面向对象语言的特性。手册会详细讲解如何创建类、实例化对象,以及如何...

    prototype中文手册chm&pdf

    `Class.create()`方法可以创建新的类,而`Object.extend()`用于类的继承。这使得在JavaScript中实现复杂的面向对象设计模式成为可能。 4. **AJAX功能** Prototype库的`Ajax`模块提供了多种与服务器进行异步通信的...

    prototype1.4-1.5,中文手册(chm),教程(.pdf,.doc)合集

    2. **类与继承**:Prototype引入了基于原型的面向对象编程概念,提供了Class、extend和implement方法,使得创建类和实现继承变得简单。例如,你可以使用Class.create()来定义一个新的类。 3. **DOM操作**:...

    prototype.js中文手册

    3. **对象扩展**:Prototype.js 基于JavaScript原型链实现类和对象的继承,提供了`Object.extend()` 和 `Class.create()` 方法,使得JavaScript具备更强大的面向对象编程能力。 4. **函数工具**:内置了一系列实用...

    prototype中文参考手册

    此外,`Prototype`还引入了类的概念,通过`Class.create`可以创建自定义的类。 2. **Prototype 1.4版开发者手册(PDF)** 这个PDF文档提供了早期版本(1.4版)的开发者指南,尽管版本较旧,但其中包含的基本概念和...

    prototype 1.6参考手册和js文件

    4. **对象扩展**:Prototype 引入了类的概念,通过 `Class.create` 创建新类,并允许对象继承和扩展,实现了面向对象编程。 5. **数组操作**:Prototype 对JavaScript的数组进行了增强,添加了诸如 `Array.invoke`...

    prototype 开发应用手册,笔记,prototype.js文件下载

    2. Class创建:Prototype提供了一种创建类的机制,通过`Class.create()`函数,可以创建一个新的类实例。类的实例化则通过`new`关键字完成。 三、Prototype的DOM操作 1. Element方法:Prototype对DOM元素提供了大量...

    Prototype 1.5 中文手册.rar

    这个"Prototype 1.5 中文手册.rar"压缩包包含了关于Prototype 1.5版本的中文文档,对于学习和使用该库的人来说,是一份非常有价值的参考资料。 1. Prototype基础概念: Prototype库的核心理念是通过扩展JavaScript...

Global site tag (gtag.js) - Google Analytics