JavaScript设计模式-3.原型模式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js高级语法3-原型模式 </title>
</head>
<body>
<script>
/*
javascript原型模式(prototype):
1. 原型是一个对象,其他对象可以通过它实现属性的继承,所有的对象在默认的情况下都有一个原型。
因为原型的本身也是对象。所以一个类的真正原型是被类的内部的prototype属性所持有。
2.什么可以称之为对象?
在javascript中,一个对象就是任何的无序的键值对的集合。
如果他不是一个主数据类型(undefined,null,boolean,number,string)
其他的通通叫做对象
*/ /*
javascript中的原型是和函数紧密连接的;
var o ={} 他不是用function定义的,他有原型吗?
有。
每个通过函数和new操作符生成出来的对象都持有一个属性 __proto__,这个属性
保存了创建他的构造函数的prototype的原型引用。
* */
/*
function Person(){} // 定义一个空对象
Person.prototype.name="张三";
Person.prototype.showName=function(){
//这个this表示调用本函数的一个具体实例化的类
alert(this.name);
}
new Person().showName(); var cat = {};
// cat.prototype.name="112";//报错,prototype未定义
//默认隐藏的调用下面的代码:
Object.getPrototypeOf(cat).name="zhangdan"; //这是获取隐藏原型的方法,浏览器支持度不好
cat.__proto__.master = "javascript";
//上边两个是显式调用,下面是隐式调用,作用是一样的
cat.age=2;
cat['sex']="man"; alert(cat.name+" "+cat.master+" "+cat.age+" "+cat["sex"]);
*/
//利用原型模式实现简单继承
function per(){
this.getName = function(str){
alert(str);
}
}
per.prototype.getAge = function(age){
alert(age);
}
//不完全继承
var a = {};//空类
a.__proto__ = per.prototype;
//把要被继承的原型引用,赋值给要继承的类,相当于一个挂载
//如果要继承的类是一个空类,那么就会完全继承
a.getAge(3);
//a.getName("张丹"); //这个方法 报错,因为继承的是原型,也就是上一级的所有东西,
//但是不包括被继承类自身定义的属性和方法 //简单方式实现继承(js中无法实现多继承)
//完全继承
var b = {};
b.__proto__ = new per();
b.__proto__.constructor = b;
b.getAge(9);
b.getName("xiaowang"); //串联继承
function m(){
this.showM = function(){
alert("I am is M ")
}
}
function n(){
this.showN = function(){
alert("I am is N ")
}
} function k(){};
n.prototype = new m();
n.prototype.constructor = n; k.prototype = new n();
k.prototype.constructor = k;
var boo = new k();
boo.showM();
boo.showN();
</script>
</body>
</html>
JavaScript设计模式-3.原型模式的更多相关文章
- 再起航,我的学习笔记之JavaScript设计模式09(原型模式)
我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 我们 ...
- JavaScript设计模式 (1) 原型模式
原型模式(Prototype):用原型实例指向创建类对象,使用于创建新对象的类共享原型对象的属性以及方法. //图片轮播类 var LoopImages = function (imgArr, con ...
- Javascript设计模式之原型模式、发布订阅模式
原型模式 原型模式用于在创建对象时,通过共享某个对象原型的属性和方法,从而达到提高性能.降低内存占用.代码复用的效果. 示例一 function Person(name) { this.name = ...
- JavaScript设计模式之----组合模式
javascript设计模式之组合模式 介绍 组合模式是一种专门为创建Web上的动态用户界面而量身制定的模式.使用这种模式可以用一条命令在多个对象上激发复杂的或递归的行为.这可以简化粘合性代码,使其更 ...
- 设计模式_11_原型模式(prototype)深拷贝、浅拷贝
设计模式_11_原型模式(prototype) 浅拷贝: package designPatternOf23; /** * 定义:用原型实例,指定创建对象的种类,并通过拷贝这些原型创建新的对象 * P ...
- C#设计模式(6)——原型模式(Prototype Pattern)
一.引言 在软件系统中,当创建一个类的实例的过程很昂贵或很复杂,并且我们需要创建多个这样类的实例时,如果我们用new操作符去创建这样的类实例,这未免会增加创建类的复杂度和耗费更多的内存空间,因为这样在 ...
- 乐在其中设计模式(C#) - 原型模式(Prototype Pattern)
原文:乐在其中设计模式(C#) - 原型模式(Prototype Pattern) [索引页][源码下载] 乐在其中设计模式(C#) - 原型模式(Prototype Pattern) 作者:weba ...
- js原生设计模式——7原型模式之真正的原型模式——对象复制封装
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- C#设计模式之六原型模式(Prototype)【创建型】
一.引言 在开始今天的文章之前先说明一点,欢迎大家来指正.很多人说原型设计模式会节省机器内存,他们说是拷贝出来的对象,这些对象其实都是原型的复制,不会使用内存.我认为这是不对的,因为拷贝出来的每一个对 ...
随机推荐
- C++中break/Continue,exit/return的理解
刚才遇到了一个问题,大概是这样的. func1执行完成,进入func1Complete,其中switch处理func1返回的数据,如果返回数据是clear则重新执行func1. 测试的时候发现func ...
- 終于解決调用wordpress 4.3 xmlrpc api 发布包含分类的文章时返回“抱歉,文章类型不支持您的分类法”错误的問題
這個問題我找了很多資料都沒有明說是如何解決,后來突發奇想得出我的解決方案如下,所以特此記錄一下: object postId = blogService.NewPost(0,"admin&q ...
- 18-11-2 Scrum Meeting 5
1. 会议照片 2. 工作记录 - 昨天完成工作 1 把数据导入数据库 2 中译英选择题和英译中选择题的查询接口 - 今日计划工作 1 配置页面 2 实现中译英选择题和英译中选择题的查询接口 3 整理 ...
- MSP430 G2553 Launchpad实现电容测量
一.基本原理 对于Source-Free RC电路,其电容放电的特性可以描述为: 其中V0是电容的初始电压,t是放电时间,R是串接的电阻阻值,C是电容值,v(t)是t时刻电容上的电压.因此,若已知V0 ...
- 清除浏览器缓存meta标签
<meta http-equiv="Cache-Control" content="no-cache" /> <meta http-equiv ...
- UDP实现一个简易的聊天室 (Unity&&C#完成)
效果展示(尚未完善) UDP User Data Protocol 用户数据报协议 概述 UDP是不连接的数据报模式.即传输数据之前源端和终端不建立连接.使用尽最大努力交付原则,即不保证可靠交付. 数 ...
- c#进阶之lambda表达式
阅读之前,先确保对委托有基本的了解,传送门 c#进阶之浅析委托和事件. lambda表达式雏形第一步 在委托那篇文章,绑定的的方法都是具名函数,为了简化书写,可以换成匿名函数 public deleg ...
- 基于ASP.NET几十万数据几秒钟就可以导入到数据库中
/// <summary> /// 一.构建模拟数据存放于DataTable /// </summary> /// <returns>DataTable</r ...
- openstack 的 lbaas 疑问
1 为什么lbaas的haproxy实现没有将其放到vrouter中,而vpnaas/fwaas都放到vrouter中呢? 放在vrouter上,可以减少vrouter到haproxy的流量路径,是怕 ...
- Python----初次见面,请多关照!
1.计算机的最基本认识 CPU(大脑) 3GHZ + 内存(DDR4) + 主板 + 电源(心脏)+ 显示器 + 键盘 +鼠标+ 显卡 + 硬盘 80MB/s 操作系统分为: windows 家用 l ...