//所有的函数都有一个prototype属性
function aa() {
}
console.info(aa.prototype);
//这个prototype属性引用了一个对象,即原型,初始化时是一个空对象,也就是没有一个成员(即原型属性和原型方法)。
var i = 0;
for (j in aa.prototype) {
console.info(j);
i++;
}
alert("member: " + i);//alert出原型所有属性和方法个数。 0个属性和方法 function AA() { }
AA.prototype.name = 'leyi';
AA.prototype.fn = function () {
return 'hello world!'
};
var bb = new AA();
//实例化对象没有原型对象,他可以通过__proto__来取得原型链上的原型属性和原型方法
console.info(bb.prototype)//undefined
console.info(bb.__proto__) //指向AA.prototype
//那么获取bb的属性和方法就可以通过原型链获取AA原型上的方法属性
console.info(bb.name === bb.__proto__.name);//leyi
console.info(bb.fn() === bb.__proto__.fn());//hello world!
//bb的的构造器函数就是AA.prototype.constructor
console.info(bb.constructor === AA.prototype.constructor)//true
//bb的的构造器函数的原型就是AA.prototype
console.info(bb.constructor.prototype === AA.prototype)//true //继承 //一、通过对象冒充实现继承
function X(width, height) {
this.width = width;
this.height = height;
} function Y(w, h) {
this.fn = X;//让父类的构造函数成为子类的方法
this.fn(w, h);//执行该方法,继承了X方法的width,height属性
delete this.fn; //删掉该方法
this.draw = function () {
console.info(this.width + '---' + this.height);//打印继承来的两个属性
}
}
new Y(100, 200).draw();//100---200 //二、通过call apply实现继承,原理跟上面差不多
function XX(width, height) {
this.width = width;
this.height = height;
} function YY(w, h) {
XX.call(this, w, h);//or XX.apply(this,[w,h]);
this.draw = function () {
console.info(this.width + '---' + this.height);//打印继承来的两个属性
}
}
new YY(300, 400).draw();//300---400 //三、通过原型链实现继承
function XXX(width, height) {
this.fn = function () {
console.info('haha')
}
} function YYY() {
this.draw = function () {
this.fn();
}
}
YYY.prototype = new XXX();
var yyy = new YYY()
console.info(yyy.constructor)//这里有点小问题,yyy构造器函数指向了XXX
//YYY.prototype是YYY的原型,yyy.constructor.prototype是XXX的原型
console.info(yyy.constructor.prototype === YYY.prototype)//false
//修正指向
YYY.prototype.constructor = YYY//将YYY原型的构造器设置指向为YYY构造函数
console.info(yyy.constructor.prototype === YYY.prototype)//true
console.info(yyy.constructor)//YYY
yyy.draw(); //混合式继承
function XXXX(width, height) {
this.width = width;
this.height = height;
}
XXXX.prototype.halo = 'halo!' function YYYY(w, h) {
XXXX.call(this, w, h);//通过call继承XXXX的字段属性,并将其初始化
this.draw = function () {
console.info(this.width + '---' + this.height);
}
}
YYYY.prototype = new XXXX();
YYYY.prototype.constructor = YYYY;
new YYYY(666, 666).draw();//666---666
console.info(new YYYY().halo)//halo! var cst = new YYYY()
console.info(cst.constructor.prototype === YYYY.prototype)//true
console.info(cst.constructor)//YYYY

  

参考:

http://www.cnblogs.com/ljchow/archive/2010/06/08/1753526.html

http://javapolo.iteye.com/blog/1996871

JS原型和继承的更多相关文章

  1. js原型链+继承 浅析

    名称:    prototype--原型对象    __proto__--属性 原型链与继承网上搜索定义,看起来挺绕的 .先说继承: 所有的对象实例都可以共享原型对象包含的属性和方法  例如一个实例A ...

  2. [js]js原型链继承小结

    这是之前总结的, 发现有很多的毛病,就是重点不突出,重新翻看的时候还是得耗费很长时间去理解这玩意. js中的继承 js中什么是类 1,类是函数数据类型 2.每个类有一个自带prototype属性 pr ...

  3. 彻底弄懂JS原型与继承

    本文由浅到深,循序渐进的将原型与继承的抽象概念形象化,且每个知识点都搭配相应的例子,尽可能的将其通俗化,而且本文最大的优点就是:长(为了更详细嘛). 一.原型 首先,我们先说说原型,但说到原型就得从函 ...

  4. js原型链继承的傻瓜式详解

    本文争取用最简单的语言来讲解原型链继承的OOP原理 0.如果对原型继承还没有大致了解,完全一头雾水,请先阅读 <JavaScript高级程序设计>第六章最后部分的寄生组合式继承 或者_廖雪 ...

  5. js原型与继承

    demofunction Fun(){}
var foo = new Fun();foo.__proto__ === Fun.prototype 摘要 1.js本身不提供类实现,es6引入了class ...

  6. 【JS】深入理解JS原型和继承

    前言 在学习JS中的原型,原型链,继承这些知识之前,我们先学习下基础知识:函数和对象的关系.  我们一直都知道,函数也是对象的一种,因为通过instanceof就可以判断出来.但是函数和对象的关系并不 ...

  7. JS原型链继承

    继承普通版 继承逻辑上都差不多,普通版调用方式比较繁琐,不利于反复大量的使用: (function (){ //创建一个人员类 function Person(name){ this.name = n ...

  8. js原型链继承及调用父类方法

    方法1: var Parent= function () { }; Parent.prototype.process = function(){ alert('parent method'); }; ...

  9. 一个小实例理解js 原型和继承

    导语1:一个构造函数的原型对象,其实就是这个构造函数的一个属性而已,属性名叫prototype,值是一个对象,对象中有一些属性和方法,所以每个构造函数的实例对象都拥有这些属性和方法的使用权. 导语2: ...

随机推荐

  1. iis 7.5 0x80004005 静态文件 html、js、css 500错误

    环境:iis 7.5 win7 64位 vs2012 问题:本地环境F5直接运行,没有任何问题,发布到IIS,静态文件不能访问,出现500错误,网上找了一堆解决办法,排除路径不正确,iis全部功能勾了 ...

  2. 多表数据连接 Left join

    一个我写的实例:其中多表连接,一共连接了3个表.使用聚集函数SUM,用到了GROUP BY SELECT a.[UserID],b.[Name],sum (c.[Money]+c.[Bank])as  ...

  3. 【uTenux】学习一个嵌入式操作系统-uTenux

    [这个是汇总] 最近有点时间,参加了EEPW论坛和悠龙咨询组织的一个嵌入式操作系统uTenux试用活动.本来想借助这个活动提供的开发板做一个小项目,奈何OS使用功底太次.于是,这个活动被我降低到了学习 ...

  4. Zedboard安装桌面系统ubuntu及opencv(1)

    最近一直在搞板子,想帮Zedboard安装一个opencv谁知道困难重重,而且网络几乎没有任何资料可以参考,只有陆佳华的<嵌入式软硬件协同设计实战指南>可以参考. 但是这本书讲得不清不楚, ...

  5. 别人整理的DP大全(转)

    动态规划 动态规划 容易: , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ...

  6. 配置grunt进行css、js的检查、合并和压缩

    现在会进行代码的合并和压缩已成为前端人员的必备知识,那么现在来介绍一个grunt的工具.grunt是个风靡世界的工具,它的首页是  http://www.gruntjs.net 这是个中文网站,有文档 ...

  7. python学习笔记(三)

    1.闭包:闭包是一个包含有环境变量取值的函数对象.环境变量取值被保存在函数对象的__closure__属性中.将函数作为某另一个函数的返回结果. 2.可以继续调用decorator来修饰函数或者类,而 ...

  8. ubuntu12.04 安装mac主题

    1.下载主题包我把主题上传到了csdn的资源栏目,下载地址:http://download.csdn.net/detail/chenjiebin/4531537 2.将/mac/sharc/theme ...

  9. 服务器RAS性能

    服务器的安全性能要求非常高,主要体现在RAS性能上.RAS性能指的是机器的可靠性(Reliability).可用性(Availability)和可服务性(Serviceability).RAS能力主要 ...

  10. VI 命令 gg 跳到第一行,dG 删除后面的所有内容

    VI 命令 gg 跳到第一行,dG 删除后面的所有内容