javascript原型模式用法实例详解


Posted in Javascript onJune 04, 2015

本文实例讲述了javascript原型模式用法。分享给大家供大家参考。具体分析如下:

一般在了解了工厂模式和构造函数模式的弊端之后,就知道为什么需要原型模式了
 
原型模式i的定义:每个函数都有一个prototype(原型)属性,这个属性是一个对象,它的用途是包含可以由特定类型的所有实例共享的属性和方法。比如在构造函数模型中sayInformation()方法,如果声明两个实例就要构造两次sayInformation方法,但是声明两次是没有必要的,这就是为什么有原型模式的出现(尼玛,网上那些博客上面都是扯谈的东西,还是看书讲的容易理解),sayInformation()声明为原型模式之后,实例就共享了,就没有必要声明两次了

function Person(){}
Person.prototype.name="jack";
Person.prototype.age=10;
Person.prototype.sayInformation=function()
{
  console.log("my name is"+this.name+" age is"+this.age);
}
var person1 = new Person();
person1.sayInformation();
console.info(person1.name);
//来自原型的属性name
person1.name="Greg";
//修改实例的name属性
console.info(person1.name);
//来自实例的属性name
delete person1.name ;
//来自实例的属性,这里删除的是实例的属性,但是原型的属性依然存在
console.info(person1.name);
//来自原型的属性name
var person2 = new Person();
person2.sayInformation();
console.info(person1.hasOwnProperty("name"));
//hasOwnProperty检查属性是属于实例还是原型中,如果是实例中就返回true
console.info(person1.name==person2.name);
console.info(person1.sayInformation==person2.sayInformation);
console.info(person1.constructor);
//指向person1的构造函数
//原型更加简便的写法
function Person2(){}
Person2.prototype={
  name:"jack",
  age:29,
  sayInformationfunction:function()
    {
      console.log("my name is"+this.name+" age is"+this.age);
    }
}

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
取得一定长度的内容,处理中文
Dec 20 Javascript
Javascript中的Split使用方法与技巧
Mar 09 Javascript
js实现的点击数量加一可操作数据库
May 09 Javascript
jQuery学习笔记之 Ajax操作篇(二) - 数据传递
Jun 23 Javascript
微信小程序 教程之WXML
Oct 18 Javascript
教你用Cordova打包Vue项目的方法
Oct 17 Javascript
Validform验证时可以为空否则按照指定格式验证
Oct 20 Javascript
Vue2.0 给Tab标签页和页面切换过渡添加样式的方法
Mar 13 Javascript
VUE在for循环里面根据内容值动态的加入class值的方法
Aug 12 Javascript
node.js中ws模块创建服务端和客户端,网页WebSocket客户端
Mar 06 Javascript
JavaScript使用prototype属性实现继承操作示例
May 22 Javascript
插件导致ECharts被全量引入的坑示例解析
Sep 23 Javascript
使用JavaScript刷新网页的方法
Jun 04 #Javascript
JavaScript中Cookies的相关使用教程
Jun 04 #Javascript
javascript组合使用构造函数模式和原型模式实例
Jun 04 #Javascript
浅析JavaScript中的事件机制
Jun 04 #Javascript
JavaScript中指定函数名称的相关方法
Jun 04 #Javascript
JavaScript中Function()函数的使用教程
Jun 04 #Javascript
JavaScript中的函数嵌套使用
Jun 04 #Javascript
You might like
ajax+php实现无刷新验证手机号的实例
2017/12/22 PHP
PHP实现通过strace定位故障原因的方法
2018/04/29 PHP
PHP获取访问设备信息的方法示例
2019/02/20 PHP
如何在标题栏显示框架内页面的标题
2007/02/03 Javascript
checkbox 多选框 联动实现代码
2008/10/22 Javascript
js 浏览本地文件夹系统示例代码
2013/10/24 Javascript
Javascript中arguments对象详解
2014/10/22 Javascript
node.js中的events.EventEmitter.listenerCount方法使用说明
2014/12/08 Javascript
js去除浏览器默认底图的方法
2015/06/08 Javascript
JS实现六边形3D拖拽翻转效果的方法
2016/09/11 Javascript
AngularJs ng-repeat 嵌套如何获取外层$index
2016/09/21 Javascript
JS框架之vue.js(深入三:组件1)
2016/09/29 Javascript
JavaScript函数参数的传递方式详解
2017/03/06 Javascript
原生JS实现导航下拉菜单效果
2020/11/25 Javascript
详谈angularjs中路由页面强制更新的问题
2017/04/24 Javascript
用node-webkit把web应用打包成桌面应用(windows环境)
2018/02/01 Javascript
vue项目中引入noVNC远程桌面的方法
2018/03/05 Javascript
简单了解node npm cnpm的具体使用方法
2019/02/27 Javascript
React中阻止事件冒泡的问题详析
2019/04/12 Javascript
Electron + vue 打包桌面操作流程详解
2019/06/24 Javascript
[03:40]DOTA2抗疫特别篇《英雄年代》
2020/02/28 DOTA
python实现自动登录
2018/09/17 Python
Python基于datetime或time模块分别获取当前时间戳的方法实例
2019/02/19 Python
详解python:time模块用法
2019/03/25 Python
python3使用Pillow、tesseract-ocr与pytesseract模块的图片识别的方法
2020/02/26 Python
python实现快递价格查询系统
2020/03/03 Python
python Socket网络编程实现C/S模式和P2P
2020/06/22 Python
Python中bisect的用法及示例详解
2020/07/20 Python
PyQt5通过信号实现MVC的示例
2021/02/06 Python
互动出版网:专业书籍
2017/03/21 全球购物
Champion澳大利亚官网:美国冠军运动服装
2018/05/07 全球购物
日语专业毕业生求职信
2013/12/04 职场文书
博士生专家推荐信
2014/09/26 职场文书
科技馆观后感
2015/06/08 职场文书
律师催款函范文
2015/06/24 职场文书
面试中老生常谈的MySQL问答集锦夯实基础
2022/03/13 MySQL