JS面向对象——动态原型模型、寄生构造模型
动态原型模型
组合使用构造函数模型和原型模型,使得OO语言程序员在看到独立的构造函数和原型时很困惑。动态原型模型致力于解决该问题,它把所有的信息封装在构造函数中,通过在构造函数中初始化原型(仅在必要情况下),同时又使用构造函数和原型的优点。
实例代码如下:
<!DOCTYPE html>
<html>
<head>
<title>动态原型模型</title>
<script type="text/javascript">
//动态原型模型:把所有的信息封装在构造函数中。通过在构造函数中初始化原型(仅在必要情况),又保持了同时使用构造函数和原型模型的优点。
function Student(name,age,sex){
this.name=name;
this.age=age;
this.sex=sex;
this.friends=["Kitty","Court"];
if(typeof this.sayName!="function"){
//不能使用对象字面量重写原型
Student.prototype.sayName=function(){
alert(this.name);
};
}
} var stu1=new Student("Lucy",10,"girl");
stu1.sayName();
var stu2=new Student("Bob",9,"boy");
stu2.sayName();
stu1.friends.push("Van");
alert(stu1.friends);//"Kitty,Court,Van"
alert(stu2.friends);//"Kitty,Court"
alert(stu1.friends===stu2.friends);//false
alert(stu1.sayName===stu2.sayName);//true
</script>
</head>
<body>
</body>
</html>
寄生构造函数模型
基本思想:创建一个函数,该函数作用仅仅是封装创建对象的代码,然后返回新创建的对象。
以下代码说明该模型基本思想:
<!DOCTYPE html>
<html>
<head>
<title>寄生构造函数模型</title>
<script type="text/javascript">
function Student(name,age,sex){
var o=new Object();
o.name=name;
o.age=age;
o.sex=sex;
o.friends=["Kitty","Court"];
o.sayName=function(){
alert(this.name);
};
return o;
} var stu1=new Student("Lucy",10,"girl");
stu1.sayName();
alert(stu1 instanceof Student); //false
alert(stu1 instanceof Object);//true
</script>
</head>
<body>
</body>
</html>
注:返回的对象与构造函数或者与构造函数的原型属性之间没有任何关系;即:构造函数返回的对象与在构造函数外部创建的对象没什么不同。不能依赖instanceof操作符来确定对象类型。
这种模式常用在特殊情况下为对象创建构造函数。
JS面向对象——动态原型模型、寄生构造模型的更多相关文章
- js 面向对象 动态添加标签
有点逻辑 上代码 thml布局 点击查看代码 <!DOCTYPE html> <html lang="en"> <head> <meta ...
- JS面向对象,原型,继承
ECMAScript有两种开发模式:1.函数式(过程化),2.面向对象(OOP).面向对象的语言有一个标志,那就是类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.但是,ECMAScript ...
- js面向对象与原型
创建对象 var box = new Object();//创建对象 box.name = 'Lee'; //添加属性 box.age = 100; box.run = function(){ ret ...
- JS面向对象之原型
面向对象之原型 为什么要使用原型 由于 js 是解释执行的语言, 那么在代码中出现的函数与对象, 如果重复执行, 那么会创建多个副本, 消耗更多的内存, 从而降低性能 传统构造函数的问题 functi ...
- JS面向对象之原型链
对象的原型链 只要是对象就有原型 原型也是对象 只要是对象就有原型, 并且原型也是对象, 因此只要定义了一个对象, 那么就可以找到他的原型, 如此反复, 就可以构成一个对象的序列, 这个结构就被成 ...
- 从零开始的全栈工程师——JS面向对象( 原型 this 继承)
一.生成对象的方式 ①单例模式(字面量定义)var obj = {} ②类的实例 var obj = new Object( ) ③工厂模式 ④构造函数:扮演三种角色 普通函数 普通对象 类 工厂模式 ...
- 21 , CSS 构造模型
1. div 2. 边距 3. 边框 4. 定位 5. 浮动 1 21.1 div 部分(division)---<div>元素,经常以 div 形式引用---是 XHTML 元素,用于 ...
- JS面向对象——组合使用构造函数模型与原型模型中的隐患
组合使用构造函数模型和原型模型中的问题,使用对象字面量重写原型模型会有隐患(涉及到原型的动态性),如下例: <!DOCTYPE html> <html> <head> ...
- JavaScript之面向对象学习七(动态原型模式、寄生构造函数模式、稳妥构造函数模式创建自定义类型)
一.动态原型模式 在面向对象学习六中的随笔中,了解到组合构造函数模式和原型模式创建的自定义类型可能最完善的!但是人无完人,代码亦是如此! 有其他oo语言经验的开发人员在看到独立的构造函数和原型时,很可 ...
随机推荐
- 【Database】Mysql分布式集群学习笔记
一.sql 的基本操作 (2018年11月29日,笔记) (1)数据库相关操作 创建数据库.查看数据库.删除数据库 #. 创建数据库 create database mytest default ch ...
- alert(1) to win 7
function escape(s) { // Pass inn "callback#userdata" var thing = s.split(/#/); if (!/^[a-z ...
- Altium Designer 19 导出光绘文件
一.点击 文件--制造输出--Gerber Files 第一次设置如下 绘制层点击进去全选 钻孔光圈 符号大小50mil 生成文件 关闭不用保存 蚀刻图 二.点击 文件--制造输出--Gerber F ...
- vertica copy
copy huimei.ken_copy from '/home/dbadmin/file.txt' delimiter ';'
- 共享OrCAD9.2pSpice9.2+multisim下载地址
http://pan.baidu.com/s/1dDcfiH7ewb9绿色版,解压后即可用!http://pan.baidu.com/s/1kTG43WFMultisim v11绿色版.7zhttp: ...
- Flask之路由相关
1.装饰器中的参数 @app.route("/info", methods=["GET", "POST"]) def student_inf ...
- 向Hive中导入数据的方式
一.Hive客户端:根据数据源不同划分 1.从本地文件系统中导入数据到hive表中: load data local inpath "path" [OVERWRITE] into ...
- NOIP2011提高组 Day1 T3 Mayan游戏
题目描述 Mayan puzzle是最近流行起来的一个游戏.游戏界面是一个7行×5列的棋盘,上面堆放着一些方块,方块不能悬空堆放,即方块必须放在最下面一行,或者放在其他方块之上.游戏通关是指在规定的步 ...
- js事件循环机制
本文参考链接:https://www.jianshu.com/p/cf47bc0bf2ab 一.先搞懂两个东西:堆和栈 栈由操作系统自动分配释放,用于存放函数的参数值.局部变量等一些基本的数据类型,其 ...
- Knative 实战:基于 Knative Serverless 技术实现天气服务
提到天气预报服务,我们第一反应是很简单的一个服务啊,目前网上有大把的天气预报 API 可以直接使用,有必要去使用 Knative 搞一套吗?杀鸡用牛刀?先不要着急,我们先看一下实际的几个场景需求: 场 ...