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 相关文章推荐
指定位置如果有图片显示图片,无图片显示广告的JS
Jun 05 Javascript
javascript 基础篇3 类,回调函数,内置对象,事件处理
Mar 14 Javascript
JQuery select控件的相关操作实现代码
Sep 14 Javascript
用js+iframe形成页面的一种遮罩效果的具体实现
Dec 31 Javascript
JS中的构造函数详细解析
Mar 10 Javascript
打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
Oct 11 Javascript
js实现继承的5种方式
Dec 01 Javascript
解决js函数闭包内存泄露问题的办法
Jan 25 Javascript
javascript判断图片是否加载完成的方法推荐
May 13 Javascript
Vue中this.$router.push参数获取方法
Feb 27 Javascript
echarts实现折线图的拖拽效果
Dec 19 Javascript
详谈Vue.js框架下main.js,App.vue,page/index.vue之间的区别
Aug 12 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实现的迷你漂流瓶
2015/07/29 PHP
Jquery选择器 $实现原理
2009/12/02 Javascript
来自国外的页面JavaScript文件优化
2010/12/08 Javascript
分析Node.js connect ECONNREFUSED错误
2013/04/09 Javascript
javaScript 计算两个日期的天数相差(示例代码)
2013/12/27 Javascript
jquery ajaxSubmit 异步提交的简单实现
2014/02/28 Javascript
js如何判断用户是在PC端和还是移动端访问
2014/04/24 Javascript
jQuery满意度星级评价插件特效代码分享
2015/08/19 Javascript
详解Html a标签中href和onclick用法、区别、优先级别
2017/01/16 Javascript
d3.js中冷门却实用的内置函数总结
2017/02/04 Javascript
详解JS获取HTML DOM元素的8种方法
2017/06/17 Javascript
在vue中通过axios异步使用echarts的方法
2018/01/13 Javascript
垃圾回收器的相关知识点总结
2018/05/13 Javascript
详解nodejs 配置文件处理方案
2019/01/02 NodeJs
vue+mock.js实现前后端分离
2019/07/24 Javascript
Vue3.0 响应式系统源码逐行分析讲解
2019/10/14 Javascript
node.js使用zlib模块进行数据压缩和解压操作示例
2020/02/12 Javascript
微信jssdk踩坑之签名错误invalid signature
2020/05/19 Javascript
JS实现拖动模糊框特效
2020/08/25 Javascript
JavaScript async/await原理及实例解析
2020/12/02 Javascript
Python类方法__init__和__del__构造、析构过程分析
2015/03/06 Python
总结网络IO模型与select模型的Python实例讲解
2016/06/27 Python
python获取网页中所有图片并筛选指定分辨率的方法
2018/03/31 Python
python高级特性和高阶函数及使用详解
2018/10/17 Python
Python输出\u编码将其转换成中文的实例
2018/12/15 Python
对python使用telnet实现弱密码登录的方法详解
2019/01/26 Python
Django使用模板后无法找到静态资源文件问题解决
2019/07/19 Python
PyTorch中Tensor的数据统计示例
2020/02/17 Python
Pandas时间序列:时期(period)及其算术运算详解
2020/02/25 Python
Django 5种类型Session使用方法解析
2020/04/29 Python
flask开启多线程的具体方法
2020/08/02 Python
基于canvas使用贝塞尔曲线平滑拟合折线段的方法
2018/01/10 HTML / CSS
百货商场楼层班组长竞聘书
2014/03/31 职场文书
结婚通知短信大全
2015/04/17 职场文书
2016年世界人口日宣传活动总结
2016/04/05 职场文书
Spring中bean的生命周期之getSingleton方法
2021/06/30 Java/Android