【学习】吃透javascript-prototype

转载 2012年03月21日 15:29:44
 首先要理解prototype是什么?每个function对象都有一個prototype的属性。 而prototype本身也就是一個object,所以可以动态的给它增加属性和方法, 我在想为什么设计者要加给这个function加一個原型这个概念呢?  

就是为了让对象共享自己的财富。 

我们在看看下面的代码:

function Person(name)

{

this.name = name; //设置对象属性,每个对象各自一份属性数据

};

Person.prototype.SayHello = function() //给Person 函数的prototype 添加SayHello 方法。

{

alert("Hello, I'm " + this.name);

}

var BillGates = new Person("Bill Gates"); //创建BillGates 对象

var SteveJobs = new Person("Steve Jobs"); //创建SteveJobs 对象

BillGates.SayHello(); //通过BillGates 对象直接调用到SayHello 方法

SteveJobs.SayHello(); //通过SteveJobs 对象直接调用到SayHello 方法

alert(BillGates.SayHello == SteveJobs.SayHello); //因为两个对象是共享prototype 的SayHello,所以显示:

true

 

prototype的特性 一:

上面说明了prototype就是把自己的财富让其他对象共享了。

 

下面我们在定义一個Employee 

Employee.prototype=new Person();

Employee.prototype.show=function(){alert("money")}//动态的增加一個show方法

 

下面是javascript的继承的写法:

function Person(name)

{

this.name = name; //设置对象属性,每个对象各自一份属性数据

};

Person.prototype.SayHello = function() //给Person 函数的prototype 添加SayHello 方法。

{

alert("Hello, I'm " + this.name);

}

 

function Employee(name,money)     //实现继承

{

Person.call(this,name);

this.money=money;

}

Employee.prototype=new Person();   //这里就像一個指针一样 指向了上一级。形参一個链

Employee.prototype.show=function(){alert(this.money)};

 

var employee =new Employee("jons",400);

 

employee.show();

employee.SayHello();

上面的代码说明了prototype不仅可以共享财富,还可以  关联的作用, 就像继承一样。

如果本身的prototype 没有的属性或者方法, 会沿着prototype关联的一级一级的往上查找。 就形参了我们说的原型链

 所以我们体会到了javascript里面的prototype 是很优雅的,扩展性很明显了, 不仅横向的共享多个对象的财富,也纵向的 共享了有祖父的财富.

 

javascript真的很优美, 正是因为它这样的简单和自然。

这prototype就写到这里了, 下一篇我会写闭包模型和 原型模型的,这两者的得与失。

 

 

原文地址:http://blog.csdn.net/dztdztdzt/article/details/6031533

一个优秀的Javascript框架--Prototype解说

http://www.cnblogs.com/meil/archive/2007/04/24/724200.html   Prototype.js 是Ruby On Rails的副产品, Java...

JavaScript学习--Item15 prototype原型和原型链详解

用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了,...

Java程序员的JavaScript学习笔记(5——prototype和Object内置方法)

这是笔记的第5篇,聊聊prototype、内置的Object对象和Object对象的属性和方法。

生成字体图标及其原理

详解使用icomoon生成字体图标的方法并应用 IcoMoon是一个在线的图标字体生成器。其允许我们通过个性化设置生成ICON字体,我们可以上传本地ICON资源也可以使用IcoMoon给...

web开发-javascript编程prototype、this、ajax、json、结构体和数组-学习笔记十四

JavaScript编程 1、prototype: 2、this: 3、struct and array: 4、

JavaScript学习--Item17 循环与prototype最后的几点小tips

1、优先使用数组而不是Object类型来表示有顺序的集合ECMAScript标准并没有规定对JavaScript的Object类型中的属性的存储顺序。但是在使用for..in循环对Object中的属性...

javascript学习实录 之三(对象原型引用prototype) --刘小小尘

这一次 讲一下,对象的原型引用prototype 对于对象,有一个属性 : prototype 属性 先看一下API中讲解的 返回对象类型原型的引用。 objectName.prototype...

javascript学习十一:面向对象之prototype

javascript面向对象之prototype

javascript中prototype属性学习

prototype理解的不是很透彻,虽然网上有那么解释还是没能完全理解透彻。 目前理解的和日常用到的prototype主要是动态的给对象添加属性和方法,还可以用以继承。 比如我们平时用的N...

从 prototype.js 深入学习 javascript 的面向对象特性

从 prototype.js 深入学习 javascript 的面向对象特性 js是一门很强大的语言,灵活,方便。 目前我接触到的语言当中,从语法角度上讲,只有 Ruby 比它更爽。 不过我接触的...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:【学习】吃透javascript-prototype
举报原因:
原因补充:

(最多只允许输入30个字)