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 相关文章推荐
一个cssQuery对象 javascript脚本实现代码
Jul 21 Javascript
Javascript排序算法之合并排序(归并排序)的2个例子
Apr 04 Javascript
jQuery截取指定长度字符串代码
Aug 21 Javascript
JavaScript实现弹出模态窗体并接受传值的方法
Feb 12 Javascript
js获取时间精确到秒(年月日)
Mar 16 Javascript
JS获取鼠标相对位置的方法
Sep 20 Javascript
TypeScript基础入门教程之三重斜线指令详解
Oct 22 Javascript
React通过redux-persist持久化数据存储的方法示例
Feb 14 Javascript
简单了解Vue + ElementUI后台管理模板
Apr 07 Javascript
Vue 构造选项 - 进阶使用说明
Aug 14 Javascript
vue下载二进制流图片操作
Oct 26 Javascript
javascript实现拼图游戏
Jan 29 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
PHP语法速查表
2006/12/06 PHP
浅析php插件 Simple HTML DOM 用DOM方式处理HTML
2013/07/01 PHP
php处理多图上传压缩代码功能
2018/06/13 PHP
TP5(thinkPHP5)框架使用ajax实现与后台数据交互的方法小结
2020/02/10 PHP
js活用事件触发对象动作
2008/08/10 Javascript
优化 JavaScript 代码的方法小结
2009/07/16 Javascript
ExtJs事件机制基本代码模型和流程解析
2010/10/24 Javascript
线路分流自动智能跳转代码,自动选择最快镜像网站(js)
2011/10/31 Javascript
使用js实现数据格式化
2014/12/03 Javascript
异步JavaScript编程中的Promise使用方法
2015/07/28 Javascript
jQuery实现可高亮显示的二级CSS菜单效果
2015/09/01 Javascript
Bootstrap表单组件教程详解
2016/04/26 Javascript
javascript 实现动态侧边栏实例详解
2016/11/11 Javascript
node.js中EJS 模板快速入门教程
2017/05/08 Javascript
Vue.js鼠标悬浮更换图片功能
2017/05/17 Javascript
微信小程序 共用变量值的实现
2017/07/12 Javascript
JavaScript实现点击出现图片并统计点击次数功能示例
2018/07/23 Javascript
[50:27]OG vs LGD 2018国际邀请赛淘汰赛BO3 第一场 8.26
2018/08/30 DOTA
Python中用Decorator来简化元编程的教程
2015/04/13 Python
在Django的模型中执行原始SQL查询的方法
2015/07/21 Python
使用 Python 实现微信群友统计器的思路详解
2018/09/26 Python
Python 使用类写装饰器的小技巧
2018/09/30 Python
Django 自定义分页器的实现代码
2019/11/24 Python
TensorFlow的环境配置与安装教程详解(win10+GeForce GTX1060+CUDA 9.0+cuDNN7.3+tensorflow-gpu 1.12.0+python3.5.5)
2020/06/22 Python
Keras loss函数剖析
2020/07/06 Python
网页切图的CSS和布局经验与要点
2015/04/09 HTML / CSS
Topman美国官网:英国著名的国际平价时尚男装品牌
2017/12/22 全球购物
新媒传信软件测试面试题
2013/02/24 面试题
银行毕业实习自我鉴定
2013/09/19 职场文书
大学生求职推荐信
2013/11/27 职场文书
幼儿园安全检查制度
2014/01/30 职场文书
教师工作总结范文2014
2014/11/10 职场文书
学校重阳节活动总结
2015/03/24 职场文书
企业财务总监岗位职责
2015/04/03 职场文书
考生诚信考试承诺书
2015/04/29 职场文书
CSS使用Flex和Grid布局实现3D骰子
2022/08/05 HTML / CSS