JavaScript是基于对象的,任何元素都可以看成对象。然而,类型和对象是不同的。本文中,我们除了讨论类型和对象的一些特点之外,更重要的是研究如何写出好的并且利于重用的类型。毕竟,JavaScript这种流行的脚本语言如果能够进行良好的封装,并形成一个庞大的类型库,对于重用是非常有意义的。

网上对于prototype的文章很多,一直没明白核心的思想。最后写了很多例子代码后才明白:prototype只能用在类型上。
以下是一些关于类型和对象的例子,大家看完例子后可能更容易理解类型和对象之间的联系:
 
 
例子代码
说明
1
Object.prototype.Property = 1;
Object.prototype.Method = function ()
{
    alert(1);
}
 
var obj = new Object();
alert(obj.Property);
obj.Method();
可以在类型上使用proptotype来为类型添加行为。这些行为只能在类型的实例上体现。

JS中允许的类型有Array, Boolean, Date, Enumerator, Error, Function, Number, Object, RegExp, String

2
var obj = new Object();
obj.prototype.Property = 1; //Error
//Error
obj.prototype.Method = function()
{
    alert(1);
}
在实例上不能使用prototype,否则发生编译错误
3
Object.Property = 1;
Object.Method = function()
{
    alert(1);
}
 
alert(Object.Property);
Object.Method();
可以为类型定义“静态”的属性和方法,直接在类型上调用即可
4
Object.Property = 1;
Object.Method = function()
{
    alert(1);
}
var obj = new Object();
alert(obj.Property); //Error
obj.Method(); //Error
实例不能调用类型的静态属性或方法,否则发生对象未定义的错误。
5
function Aclass()
{
this.Property = 1;
this.Method = function()
{
    alert(1);
}
}
var obj = new Aclass();
alert(obj.Property);
obj.Method();
这个例子演示了通常的在JavaScript中定义一个类型的方法
6
function Aclass()
{
this.Property = 1;
this.Method = function()
{
    alert(1);
}
}
Aclass.prototype.Property2 = 2;
Aclass.prototype.Method2 = function
{
    alert(2);
}
var obj = new Aclass();
alert(obj.Property2);
obj.Method2();
可以在外部使用prototype为自定义的类型添加属性和方法。
7
function Aclass()
{
this.Property = 1;
this.Method = function()
{
    alert(1);
}
}
Aclass.prototype.Property = 2;
Aclass.prototype.Method = function
{
    alert(2);
}
var obj = new Aclass();
alert(obj.Property);
obj.Method();
在外部不能通过prototype改变自定义类型的属性或方法。
该例子可以看到:调用的属性和方法仍是最初定义的结果。
8
function Aclass()
{
this.Property = 1;
this.Method = function()
{
    alert(1);
}
}
var obj = new Aclass();
obj.Property = 2;
obj.Method = function()
{
    alert(2);
}
alert(obj.Property);
obj.Method();
可以在对象上改变属性。(这个是肯定的)
也可以在对象上改变方法。(和普遍的面向对象的概念不同)
9
function Aclass()
{
this.Property = 1;
this.Method = function()
{
    alert(1);
}
}
var obj = new Aclass();
obj.Property2 = 2;
obj.Method2 = function()
{
    alert(2);
}
alert(obj.Property2);
obj.Method2();
可以在对象上增加属性或方法
10
function AClass()
{
       this.Property = 1;
       this.Method = function()
       {
              alert(1);
       }
}
 
function AClass2()
{
       this.Property2 = 2;
       this.Method2 = function()
       {
              alert(2);
       }
}
AClass2.prototype = new AClass();
 
var obj = new AClass2();
alert(obj.Property);
obj.Method();
alert(obj.Property2);
obj.Method2();
这个例子说明了一个类型如何从另一个类型继承。
11
function AClass()
{
       this.Property = 1;
       this.Method = function()
       {
              alert(1);
       }
}
 
function AClass2()
{
       this.Property2 = 2;
       this.Method2 = function()
       {
              alert(2);
       }
}
AClass2.prototype = new AClass();
AClass2.prototype.Property = 3;
AClass2.prototype.Method = function()
{
       alert(4);
}
var obj = new AClass2();
alert(obj.Property);
obj.Method();
这个例子说明了子类如何重写父类的属性或方法。
 
   以上例子中,关于通过类型实现重用方面,重要的有:
·例子1:JavaScript中允许添加行为的类型
·例子2:prototype使用的限制
·例子3:如何定义类型上的静态成员
·例子7:prototype在重定义类型的成员上的限制
·例子10:如何让一个类型继承于另一个类型
·例子11:如何在子类中重新定义父类的成员
  
可见JavaScript能够实现的面向对象的特征有:
·公有属性(public field)
·公有方法(public Method)
·私有属性(private field)
·私有方法(private field)
·方法重载(method overload)
·构造函数(constructor)
·事件(event)
·单一继承(single inherit)
·子类重写父类的属性或方法(override)
·静态属性或方法(static member)

转---- javascript prototype介绍的文章的更多相关文章

  1. javascript prototype原型链的原理

    javascript prototype原型链的原理 说到prototype,就不得不先说下new的过程. 我们先看看这样一段代码: <script type="text/javasc ...

  2. JavaScript入门介绍(一)

    JavaScript入门介绍 [经常使用的调试工具][w3school.com.cn在线编辑] [Chrome浏览器 开发调试工具]按F121.代码后台输出调试:console.log("t ...

  3. JavaScript Prototype in Plain Language

    非常好的文章: http://javascriptissexy.com/javascript-prototype-in-plain-detailed-language/ jan. 25 2013 14 ...

  4. JavaScript prototype原型用法

    JavaScript对象原型 所有JavaScript对象都从原型继承属性和方法. <!DOCTYPE html> <html> <meta charset=" ...

  5. JavaScript — event介绍以及兼容处理

    JavaScript - event介绍以及兼容处理 1.事件流 浏览器发展到第四代时(IE4及 Netscape Communicator 4),浏览器开发团队遇到一个问题:页面的哪个部分会拥有某个 ...

  6. illustrating javascript prototype & prototype chain

    illustrating javascript prototype & prototype chain 图解 js 原型和原型链 proto & prototype func; // ...

  7. [原创]javascript prototype 对象 函数 <精简的美丽......>

    精简的美丽...... javascript prototype 对象 函数 在javascript中我们都知道创建一个对象使用如下代码var x = {}对象可以拥有属性和方法var x = {   ...

  8. JavaScript入门介绍(二)

    JavaScript入门介绍 [函数] 函数function 是Javascript的基础模块单元,用于代码的复用.信息影藏和组合调用. function a(){} 函数对象Function Lit ...

  9. javascript的介绍,实现和输出以及语法-javascript学习之旅(1)

    javascript的介绍 : 1.javascript死互联网最流行的脚本语言,可用于web和html,并且可用于服务器,pc和移动端 2.javascript脚本语言: 1.是一种轻量级的脚本语言 ...

随机推荐

  1. erlang rabbitmq-server安装

    erlang rabbitmq-server安装 yum -y install   xsltproc fop tk unixODBC unixODBC-devel make gcc gcc-c++ k ...

  2. impdp报错: ORA-39064: 无法写入日志文件 ORA-29285: 文件写入错误

    windows平台下,oracle 11.2.0.1在使用impdp向测试环境导入数据的时候,报出如下错误: 错误原因: 数据泵在写日志文件的时候,使用的是数据库字符集.如果客户端的环境变量NLS_L ...

  3. Oracle12c:安装后新建用户及其默认表空间,并创建表测试

    环境: 操作系统:Windows Server2008 R2 X64 Oracle版本:12c 如何安装? -- oracle 12c在oracle linux 6.6 x64上的安装 -- Wind ...

  4. [原创]java WEB学习笔记97:Spring学习---Spring 中的 Bean 配置:IOC 和 DI

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  5. ubuntu15.04安装Chrome浏览器

    首先到: https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb 下载最新的安装文件. 然后: sudo a ...

  6. foreach遍历遇到的一个细节问题

    1.Invalid argument supplied for foreach()警告错误解决办法:foreach遍历之前添加is_array()判断

  7. 三层架构下的EntityFramework codefirst

    好久没写博客了,今天研究了EF框架的CodeFirst模式,从字面意思可以看出,代码优先.所谓代码优先,与以往的添加ado.net不同,主要是编写代码生成数据库和数据表,生成数据实体映射.个人感觉这种 ...

  8. The import java.util cannot be resolved The import javax.servlet cannot be resolved

    The import java.util cannot be resolved 原因:这是由于你的项目buildpath不对 解决方案:右键项目-------buildpath--------最下面那 ...

  9. 修改 MyEclipse 中的 jsp 和 servlet 模板

    找到  MyEclipse/Common/plugins/com.genuitec.eclipse.wizards_9.0.0.me201211011550.jar 这个文件(wizards后面的数字 ...

  10. ajax 代码

    function ajax(){ var aj=null; if(window.ActiveXObject){ aj = new ActiveXObject("Microsoft.XMLHT ...