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 相关文章推荐
关于javascript document.createDocumentFragment()
Apr 04 Javascript
为jquery.ui.dialog 增加“在当前鼠标位置打开”的功能
Nov 24 Javascript
jQuery.extend 函数详解
Feb 03 Javascript
jquery中change()用法实例分析
Feb 06 Javascript
javascript日期格式化方法小结
Dec 17 Javascript
AngularJS延迟加载html template
Jul 27 Javascript
js数字计算 误差问题的快速解决方法
Feb 28 Javascript
JS实现加载时锁定HTML页面元素的方法
Jun 24 Javascript
vue-cli webpack 引入swiper的操作方法
Sep 15 Javascript
vue里面使用mui的弹出日期选择插件实例
Sep 16 Javascript
Vite和Vue CLI的优劣
Jan 30 Vue.js
JavaScript事件概念详解(区分静态注册和动态注册)
Feb 05 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 日期时间函数的高级应用技巧
2009/10/10 PHP
PHP 抽象方法与抽象类abstract关键字介绍及应用
2014/10/16 PHP
PHP使用feof()函数读文件的方法
2014/11/07 PHP
ThinkPHP 404页面的设置方法
2015/01/14 PHP
php编程每天必学之验证码
2016/03/03 PHP
PHP QRCODE生成彩色二维码的方法
2016/05/19 PHP
php将print_r处理后的数据还原为原始数组的解决方法
2016/11/02 PHP
PHP实现时间比较和时间差计算的方法示例
2017/07/24 PHP
关于PhpStorm设置点击编辑文件自动定位源文件的实现方式
2020/12/30 PHP
分页栏的web标准实现
2011/11/01 Javascript
javascript自动改变文字大小和颜色的效果的小例子
2013/08/02 Javascript
jQuery中操控hidden、disable等无值属性的方法
2014/01/06 Javascript
jquery实现点击展开列表同时隐藏其他列表
2015/08/10 Javascript
jquery注册文本框获取焦点清空,失去焦点赋值的简单实例
2016/09/08 Javascript
js从数组中删除指定值(不是指定位置)的元素实现代码
2016/09/13 Javascript
使用jQuery监听扫码枪输入并禁止手动输入的实现方法(推荐)
2017/03/21 jQuery
详解Vue 非父子组件通信方法(非Vuex)
2017/05/24 Javascript
表格展示利器 Bootstrap Table实例代码
2017/09/06 Javascript
ES6中Class类的静态方法实例小结
2017/10/28 Javascript
微信小程序App生命周期详解
2018/01/31 Javascript
Layui 设置select下拉框自动选中某项的方法
2018/08/14 Javascript
详解Vue前端生产环境发布配置实战篇
2019/05/07 Javascript
python类继承用法实例分析
2014/10/10 Python
Python对象类型及其运算方法(详解)
2017/07/05 Python
简单了解OpenCV是个什么东西
2017/11/10 Python
详解Python图像处理库Pillow常用使用方法
2019/09/02 Python
python将字符串转变成dict格式的实现
2019/11/18 Python
Tensorflow实现将标签变为one-hot形式
2020/05/22 Python
在django中查询获取数据,get, filter,all(),values()操作
2020/08/09 Python
Python中的面向接口编程示例详解
2021/01/17 Python
美国波道夫·古德曼百货官网:Bergdorf Goodman
2017/11/07 全球购物
如何删除一个表里面的重复行
2013/07/13 面试题
竞选演讲稿范文大全
2014/05/12 职场文书
宣传口号大全
2014/06/16 职场文书
爱护公物标语
2014/06/24 职场文书
Python使用Web框架Flask开发项目
2022/06/01 Python