Javascript中的prototype与继承
1.Object2.Function3.Array4.Date5.String
- //每个function都有一个默认的属性prototype,而这个prototype的constructor默认指向这个函数
- //注意Person.constructor 不等于 Person.prototype.constructor. Function实例自带constructor属性
- functionPerson(name){
- this.name = name;
- };
- Person.prototype.getName =function(){
- returnthis.name;
- };
- var p =newPerson("ZhangSan");
- console.log(Person.prototype.constructor===Person);// true
- console.log(p.constructor===Person);// true ,这是因为p本身不包含constructor属性,所以这里其实调用的是Person.prototype.constructor
1.表明Person继承自Animal2. 表明p2是Person的实例
- functionPerson(name){
- this.name = name;
- };
- Person.prototype.getName =function(){
- returnthis.name;
- };
- var p1 =newPerson("ZhangSan");
- console.log(p.constructor===Person);// true
- console.log(Person.prototype.constructor===Person);// true
- functionAnimal(){}
- Person.prototype =newAnimal();//之所以不采用Person.prototype = Animal.prototype,是因为new 还有其他功能,最后总结。
- var p2 =newPerson("ZhangSan");
- //(p2 -> Person.prototype -> Animal.prototype, 所以p2.constructor其实就是Animal.prototype.constructor)
- console.log(p2.constructor===Person);// 输出为false ,但我们的本意是要这里为true的,表明p2是Person的实例。此时目的1达到了,目的2没达到。
但如果我们这么修正
Person.prototype = new Animal();Person.prototype.constructor = Person;
1表示父类是谁2作为自己实例的原型来复制
- Person.prototype =newAnimal();
- Person.prototype.constructor=Person;
- var p2 =newPerson("ZhangSan");
- p2.constructor//显示 function Person() {}
- Object.getPrototypeOf(Person.prototype).constructor//显示 function Animal() {}
new做了哪些事情?
当代码var p = new Person()执行时,new 做了如下几件事情:
创建一个空白对象
创建一个指向Person.prototype的指针
将这个对象通过this关键字传递到构造函数中并执行构造函数。
具体点来说,在下面这段代码中,
- Person.prototype.getName =function(){}
如果我们通过
- var person =newPerson();
- 其实类似于
- var person =newObject();
- person.getName =Person.prototype.getName;
因此通过person.getName()调用方法时,this指向的是这个新创建的对象,而不是prototype对象。
这其实在给现有函数加上新功能的情况下会用到,我们可以这么扩展现有的方法:
- //function myFunc 的写法基本上等于 var myFunc = new Function();
- function myFunc (){
- }
- myFunc =function(func){
- //可以在这里做点其他事情
- returnfunction(){
- //可以在这里做点其他事情
- return func.apply(this,arguments);
- }
- }(myFunc)
也可以在Function.prototype方法里直接通过this来访问上面代码的myFunc所指向的对象
- function myFunc (){
- }
- if(!Function.prototype.extend){
- Function.prototype.extend =function(){
- var func =this;
- returnfunction(){
- func.apply(this,arguments);
- }
- }
- };
- var myFunc = myFunc.extend();
总结一下
如果采用Person.prototype = Animal.prototype来表示Person继承自Animal, instanceof方法也同样会显示p也是Animal的实例,返回为true
.
之所以不采用此方法,是因为下面两个原因:
1.new 创建了一个新对象,这样就避免了设置Person.prototype.constructor = Person 的时候也会导致Animal.prototype.constructor的值变为Person,而是动态给这个新创建的对象一个constructor实例属性。这样实例上的属性constructor就覆盖了Animal.prototype.constructor,这样Person.prototype.constructor和Animal.prototype.contructor就分开了。
2.Animal自身的this对象的属性没办法传递给Person
但是像下面这样直接调用构造函数又可能失败,或者产生其他影响。
- Person.prototype =newAnimal();
为了避免这种情况,所以我们引入了一个中间函数。所以正确的做法应该是
- Person.prototype =(funtion(){
- function F(){};
- F.prototype =Animal.prototype
- returnnew F();
- })()
Javascript中的prototype与继承的更多相关文章
- 谈谈javascript中的prototype与继承
谈谈javascript中的prototype与继承 今天想谈谈javascript中的prototype. 通常来说,javascript中的对象就是一个指向prototype的指针和一个自身的属性 ...
- 【转】JavaScript中的原型和继承
请在此暂时忘记之前学到的面向对象的一切知识.这里只需要考虑赛车的情况.是的,就是赛车. 最近我正在观看 24 Hours of Le Mans ,这是法国流行的一项赛事.最快的车被称为 Le Mans ...
- javascript中创建对象和实现继承
# oo ##创建对象 1. 原型.构造函数.实例之间的关系 * 原型的construct->构造函数:调用isPrototypeOf(obj)方法可以判定和实例的关系: * 构造函数的pro ...
- JavaScript中的prototype和__proto__细致解析
最近在学js,体会了一点点它的灵活性.对于初学者的我,总是被它的灵活感到晕头转向,最近发现了一点东西想与大家分享. JavaScript中的prototype和_proto_: 我们先了解一点js中的 ...
- JavaScript中Object.prototype.toString方法的原理
在JavaScript中,想要判断某个对象值属于哪种内置类型,最靠谱的做法就是通过Object.prototype.toString方法. ? 1 2 var arr = []; console.lo ...
- javascript中的原型和继承
javascript一直是初学者口中的难点,甚至一些有些许工作经验的人也不太明白其中的原理,而我就是那个初学者,前段时间在阮一峰老师的博客上看了一篇文章<javascript继承机制的设计思想& ...
- javascript中的对象之间继承关系
相信每个学习过其他语言的同学再去学习JavaScript时就会感觉到诸多的不适应,这真是一个颠覆我们以前的编程思想的一门语言,先不要说它的各种数据类型以及表达式的不同了,最让我们头疼,恐怕就是面向对象 ...
- JavaScript中的类式继承和原型式继承
最近在看<JavaScript设计模式>这本书,虽然内容比较晦涩,但是细品才发现此书内容的强大.刚看完第四章--继承,来做下笔记. 书中介绍了三种继承方式,类式继承.原型式继承和掺元类继承 ...
- Javascript中的Prototype到底是什么
Javascript也是面向对象的语言,但它是一种基于原型Prototype的语言,而不是基于类的语言.在Javascript中,类和对象看起来没有太多的区别. 什么是prototype: funct ...
随机推荐
- Linux下如何执行Shell脚本
Linux下你可以有两种方式执行Shell脚本: 1.用shell程序执行脚本:根据你的shell脚本的类型,选择shell程序,常用的有sh,bash,tcsh等(一般来说第一行#!/bin/bas ...
- mysql性能测试-tpcc
mysql性能测试-tpcc Tpcc-mysql TPC-C是专门针对联机交易处理系统(OLTP系统)的规范 Tpcc-mysql由percona根据规范实现 TPCC流程 更能模拟线上业务 ...
- 实现linux下的ls
实现linux下的ls ls的使用 ls -a 列出文件下所有的文件,包括以"."开头的隐藏文件(linux下文件隐藏文件是以.开头的,如果存在..代表存在着父目录). ls -l ...
- python中的排序
今天在http://www.pythontip.com刷题的时候遇到一个排序的问题:一个列表中既有字符串,又有数字,该怎么排序. list = [1,2,5,4,'d','s','e',45] lis ...
- Codeforces Round #275 (Div. 2) 题解
A 题: 说的是在(LR) 之间找出ab互质 bc 互质 ac 不互质的 3个数 数据量小直接暴力 #include <iostream> #include <cstdio> ...
- Flask Web 开发 错误页面自定义
如果要自定义错误画面,无法大多数情况是自定义404和500的情况 首先,要在路由中设置 通过app.error_handler这个装饰器来绑定响应函数 @main.errorhandler(404) ...
- centOS下升级python版本,详细步骤
1.可利用linux自带下载工具wget下载,如下所示:( 笔者安装的是最小centos系统,所以使用编译命令前,必须安装wget服务,读者如果安装的是界面centos系统,或者使用过编译工具则可跳 ...
- c++第二十五天
p129~p131: 1.赋值运算的左侧运算对象必须是一个可修改的左值. 2.赋值运算满足右结合律. 3.赋值运算的结果是它的左侧对象,并且是一个左值. 验证: #include<iostrea ...
- 20145118 《Java程序设计》 第3周学习总结
20145118 <Java程序设计> 第3周学习总结 教材学习内容总结 第四章开始接触到了Java的核心内容---对象这个概念,在这里为避免混淆,列举面向过程和面向对象的区别: 面向对象 ...
- 同样的输入,为什么Objects.hash()方法返回的hash值每次不一样?
背景 开发过程中发现一个问题,项目中用Set保存AopMethod对象用于去重,但是发现即使往set中添加相同内容的对象,每次也能够添加成功. AopMethod类的部分代码如下: public cl ...