博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
面向对象与原型
阅读量:7113 次
发布时间:2019-06-28

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

hot3.png

原型概念:

      我们创建的每个函数都有一个prototype(原型)属性,这个属性是一个对象,它的用途是包含可以由特定类型的所有实例共享的属性和方法。逻辑上可以这么理解,prototype通过调用构造函数而创建的那个对象的原型对象。使用原型的好处可以让所有对象实例共享它所包含的属性和方法。也就是说,不必在构造函数中定义对象信息,而是可以直接将这些信息添加到原型中。

function Box(name,age){ this.name=name;       //实例属性 this.age=age; this.run=function(){  //实例方法  return this.name+this.age+'运行中。。。' }}//原型function Box(){}Box.prototype.name='lee';Box.prototype.age=100;Box.prototype.run=function(){ return this.name+this.age+'运行中。。。'}var box1=new Box();var box2=new Box();alert(box1.run==box2.run)  //true//如果是实例方法,不同的实例化,他们的方法地址是不一样的,是唯一的//如果是原型方法,那么他们地址是共享的,大家都是一样

111754_48tc_1425277.png

111913_zpQV_1425277.png

alert(box1.prototype)  //这个属性是一个对象,访问不到

alert(box1.__proto__) //这个属性是一个指针指向prototype原型对象

 

alert(box1.constructor)  //构造属性,可以获取构造函数本身

                                 //作用是被原型指针定位,然后得到构造函数本身

                                 //其实就是对象实例对应原型对象的作用,连接作用

 

 原型模式的执行流程:

1,先查找构造函数实例里的属性和方法,如果有,立刻返回

2,如果构造函数实例里没有,则去它的原型对象里找,如果有,就返回

虽然我们可以通过对象实例访问保存在原型中的值,但却不能访问通过对象实例重写原型中的值 

 

<1 判断实例中是否有属性

box1.hasOwnProperty('name');   

<2 // in 只要有的就会返回,判断不管实例还是原型里,只要有就是true

alert('name' in box1);

<3 如何判断只有原型里有

//判断只有原型里有namefunction isProperty(object,property){ return !object.hasOwnProperty(property)&& (property in object)}alert(isProperty(box1,'name'))

function Box(){}

var box=new Box();

//alert(box.prototype);    //使用对象实例无法访问到prototype

//alert(box.__proto__);    //使用对象实例访问prototype的指针 

alert(Box.prototype)      //使用构造函数名(对象名)访问prototype

                    

 

转载于:https://my.oschina.net/u/1425277/blog/1822167

你可能感兴趣的文章
keepalived instance priority don't impact by track script|interface weight when 255
查看>>
Apache Storm 官方文档 —— 配置
查看>>
SASS学习参考
查看>>
Vue初学知识点记录(一)
查看>>
Android性能优化之内存泄漏处理(图文)
查看>>
[译]如何Mock Express的会话
查看>>
基于豆瓣api的快应用项目
查看>>
前端状态管理简易实现(以vuex为例)
查看>>
SVG和Vector的概念和如何在Android Studio中使用
查看>>
Slog103_使用React框架进行前端开发14
查看>>
Linux(centos6+)安装Apache2.4详细教程
查看>>
在第三方页面调用微信接口
查看>>
给View设置点击效果动画
查看>>
git基础操作
查看>>
node生成图片
查看>>
Element-UI el-table-column 使用slot插槽 v-if 报错
查看>>
Socket IO与NIO(六)
查看>>
H5唤起APP指南(附开源唤端库)
查看>>
[译] Swift 5.0 新特性
查看>>
自动化功能测试平台TestComplete的分布式测试教程(二)
查看>>