文档章节

javascript prototype介绍的文章

Richard_sun
 Richard_sun
发布于 2013/05/15 11:15
字数 933
阅读 78
收藏 9

网上对于prototype的文章很多,一直没明白核心的思想。最后写了很多例子代码后才明白:prototype只能用在类型上。

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

以下是一些关于类型和对象的例子,大家看完例子后可能更容易理解类型和对象之间的联系:
 
 
例子代码
说明
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)

© 著作权归作者所有

Richard_sun
粉丝 6
博文 21
码字总数 17024
作品 0
深圳
高级程序员
私信 提问
JavaScript继承详解(二)

文章截图 - 更好的排版 这一章我们将会重点介绍JavaScript中几个重要的属性(this、constructor、prototype), 这些属性对于我们理解如何实现JavaScript中的类和继承起着至关重要的作用。 ...

solu
2010/12/22
237
0
《你不知道的JavaScript》系列分享专栏

《你不知道的JavaScript》系列分享专栏 你不知道的JavaScript”系列就是要让不求甚解的JavaScript开发者迎难而上,深入语言内部,弄清楚JavaScript每一个零部件的用途 《你不知道的JavaScrip...

开元中国2015
2018/12/01
41
0
js中的prototype和构造函数

js中没有类的感念,继承也是通过原型链来实现的对象的继承而不是类的继承 Vjeux写的这篇文章应该能帮助我们更好的理解js中原型的工作方式:http://blog.vjeux.com/2011/javascript/how-proto...

leo-H
2013/04/08
622
0
再谈 javascript 面向对象编程

前言:虽有陈皓《Javascript 面向对象编程》珠玉在前,但是我还是忍不住再画蛇添足的补上一篇文章,主要是因为javascript这门语言魅力。另外这篇文章是一篇入门文章,我也是才开始学习Javascr...

aoniao
2012/02/28
4.5K
22
了解javascript编程中的Prototype(原型)

日期:2012-5-16 来源:GBin1.com 当你定义javascript方法的时候,会产生一些预定义的属性,其中一个比较让人迷惑的属性就是prototype。在本文中,我们将详细介绍什么是Prototype,并且为什么...

gbin1
2012/05/22
125
0

没有更多内容

加载失败,请刷新页面

加载更多

社区投稿 | 线程简介和 MySQL 调试环境搭建

作者:高鹏 文章末尾有他著作的《深入理解MySQL主从原理 32讲》,深入透彻理解MySQL主从,GTID相关技术知识。 本文节选自《深入理解MySQL主从原理》第29节 注意:本文分为正文和附件两部分,...

爱可生
19分钟前
4
0
DDOS攻击可以分为什么类型?怎么样才能解决?

DDoS 是一种多源网络攻击,其目的是针对终端用户扰乱其网络的资源或服务。其不断进化的复杂性能够造成各种各样的伤害,例如欺诈以及勒索等。DDoS 攻击通常透过多重受损的系统或者装置注入殭尸...

云漫网络Ruan
22分钟前
3
0
从零开始入门 K8s| 阿里技术专家详解 K8s 核心概念

作者| 阿里巴巴资深技术专家、CNCF 9个 TCO 之一 李响 一、什么是 Kubernetes Kubernetes,从官方网站上可以看到,它是一个工业级的容器编排平台。Kubernetes 这个单词是希腊语,它的中文翻译...

阿里巴巴云原生
23分钟前
3
0
修改和编译spring源码,构建jar(spring-context-4.0.2.RELEASE)

上周在定位问题时,发现Spring容器实例化Bean的时候抛出异常,为了查看更详细的信息,决定修改spring-context-4.0.2.RELEASE.jar中的CommonAnnotationBeanPostProcessor类的代码,在里面打印...

程序员欣宸
25分钟前
2
0
MongoDB集群配置

MongoDB集群配置 2019年06月30日 13:21:05 2014Team 阅读数 77更多 分类专栏: MongoDB 版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 本文...

linjin200
26分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部