博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript学习总结--创建对象(3_原型)
阅读量:5022 次
发布时间:2019-06-12

本文共 2151 字,大约阅读时间需要 7 分钟。

 当我们创建一个函数时,这个函数都会有一个prototype(原型)属性,这个属性是一个指针,指向一个对象,这个对象包含了特定类型的所有实例共享的属性和方法

就象这样

仔细观察我们可以发现,数组对象Array的prototype属性指向一个对象,而这个对象包含了很多属性和方法,其中就有我们常见的length属性,以及pop()、push()、shift()等方法

那么也就是说,这些属性和方法被定义在Array的prototype上,为所有的实例对象(数组)共享

所以我们在定义数组之后就可以使用这些属性和方法,且每一个数组都引用自这个原型上的属性和方法,在原型上的属性是共享的,所以实例化一个新数组只会隐含指向这个原型对象的指针(__proto__)而不是完全复制一份

所以我们得知

var aArr=new Array();console.log(aArr.__proto__==Array.prototype);

在JavaScript内置对象Array上有一个prototype属性,指向了包含对所有数组共享属性和方法的一个对象,而通过Array实例化一个新数组,这个数组也有一个__proto__属性,也指向这个对象,这个对象在JavaScript中就叫做原型

那么同样的,Date对象也会有一个prototype属性,指向了包含对所有日期对象共享属性和方法的一个对象,通过Date对象实例化的一个日期对象也会有一个__proto__属性指向他们的原型

前面我们说到,构造函数封装对象的本质就是模仿JavaScript的内置对象,那么既然内置对象共享的属性和方法都存放在这个prototype上,我们自己创建的对象也可以吗?

上一节我们有一段代码是这样的

person_01.sayName==person_02.sayName;    //false

那么我们使用原型来创建对象看看会不会有什么不同

function Person(name,age,job){  this.name=name;  this.age=age;  this.job=job;}Person.prototype.sayName=function(){  //这样可以把方法写在原型上  console.log(this.name);}//书上会绕一大个弯先把所有属性和方法都写在原型上,再讲某些属性不能共享之类的,这里跳过var person_01=new Person("Sakura",22,"前端开发");var person_02=new Person("Misaka",20,"网页设计");

这时我们再来看看两个实例化对象的sayName方法是不是相等

person_01.sayName==person_02.sayName;    //true//同时可以得知person_01.__proto__==Person.prototype;    //trueperson_01.__proto__==person_02.__proto__;    //true

同时在prototype对象上也有一个无关紧要的属性constructor属性,这个属性指向原型所属的构造函数(可以认为是指向它所属的类型)

console.log(Person.prototype.constructor);/*function Person(name,age,job){this.name=name;this.age=age;this.job=job;}*///因为实例化对象的__proto__属性也指向原型对象,那么console.log(person_01.__proto__.constructor==Person.prototype.constructor);        //true

JavaScript实例化对象在调用属性时,首先会在构造函数内部查找属性,如果有则用这个属性,如果没有则在原型上查找

我们知道person_01的constructor属性实际实在它的原型上,构造函数内部找不到constructor属性,所以它会继续往上在原型中查找,所以

console.log(person_01.constructor==Person.prototype.constructor);

如何判断一个属性或方法在原型还是在构造函数内部(实例属性)呢?

我们使用hasOwnProperty方法

console.log(person_01.hasOwnProperty("name"));    //true

hasOwnProperty方法实际上是判断属性是否在构造函数内,如果在构造函数内则返回true;如果在原型中则返回false

同时有一个in操作符,可以判断某个对象是否包含某一个属性,无论在原型还是在构造函数中

console.log("name" in person_01);        //true

所以我们可以结合这两个方法的结果来判断某个属性是否在原型中

待续

...

转载于:https://www.cnblogs.com/sakura-log/p/5552067.html

你可能感兴趣的文章
SDUTOJ 2498 数据结构实验之图论十一:AOE网上的关键路径
查看>>
使用SpringSocial开发QQ登录
查看>>
好玩的游戏
查看>>
2.6. Statistical Models, Supervised Learning and Function Approximation
查看>>
代码说明call和apply方法的区别 (咱们这方面讲解的少,这样的题有变式,需要举例讲解一下)...
查看>>
T-SQL 类型转换
查看>>
在eclipse中设计BPMN 2.0工作流定义的根本步骤
查看>>
Json对象与Json字符串互转(4种转换方式)
查看>>
PAT甲级1002 链表实现方法
查看>>
查看Linux信息
查看>>
Python中sys模块sys.argv取值并判断
查看>>
【详记MySql问题大全集】四、设置MySql大小写敏感(踩坑血泪史)
查看>>
并查集
查看>>
ubuntu 11.04下android开发环境的搭建!
查看>>
Bzoj 3343: 教主的魔法
查看>>
括号序列(栈)
查看>>
一件趣事
查看>>
DevExpress控件TExtLookupComboBox实现多列模糊匹配输入的方法
查看>>
atom 调用g++编译cpp文件
查看>>
H3C HDLC协议特点
查看>>