javascript创建对象的方法--原型模式
javascript创建对象的方法--原型模式
一、总结
1、原型模式解决内存浪费的方法(继承):通过继承,对象继承原型模式下的所有属性,对象不同于其它对象的的属性自己创建或者修改
2、原型的使用(prototype关键字):定义模型的时候在属性中加上prototype关键字就好,这里对象用的不是this,prototype关键字添加方式用的是点,例如Peopleobj.prototype.name='喽啰';
3、缺点:构造函数没有参数
二、(Prototype)原型模式
Javascript规定,每一个构造函数都有一个prototype属性,指向另一个对象。这个对象的所有属性和方法,都会被构造函数的实例继承。可以把那些不变的属性和方法,直接定义在prototype对象上。
- prototype方式定义的方式,函数不会拷贝到每一个实例中,所有的实例共享prototype中的定义,节省了内存。
- Prototype模式的验证方法
- isPrototypeOf()这个方法用来判断,某个proptotype对象和某个实例之间的关系。
- hasOwnProperty()每个实例对象都有一个hasOwnProperty()方法,用来判断某一个属性到底是本地属性,还是继承自prototype对象的属性。
- in运算符in运算符可以用来判断,某个实例是否含有某个属性,不管是不是本地属性。in运算符还可以用来遍历某个对象的所有属性。
- 对象的constructor属性用于返回创建该对象的构造函数.(注:了解即可)
在JavaScript中,每个具有原型的对象都会自动获得constructor属性。
- 原型方式的问题:
- 构造函数没有参数。使用原型方式,不能通过给构造函数传递参数来初始化属性的值
- 属性指向的是对象,而不是函数时。函数共享不会造成问题,但对象却很少被多个实例共享,如果共享的是对象就会造成问题。
三、代码
2-5
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>课堂演示</title>
</head>
<body>
<script>
//原型模式
function Peopleobj(){}
Peopleobj.prototype.name='喽啰';
Peopleobj.prototype.weapon='大刀';
Peopleobj.prototype.run=function(){
return this.name+'的武器是'+this.weapon
}
var monster_1=new Peopleobj()
monster_1.job=[]
var monster_2=new Peopleobj()
//alert(monster_1.name+'\n'+monster_1.run())
//alert(monster_2.name+'\n'+monster_2.run())
//alert(monster_1.run)
//alert(monster_2.run)
//alert(monster_1.run==monster_2.run) //说明他们的引用是同一个地址
//这时所有实例的方法,其实都是同一个内存地址,指向prototype对象,因此就提高了运行效率。
//alert(Peopleobj.prototype.isPrototypeOf(monster_1));
// alert(monster_1.hasOwnProperty("name"));
// alert(monster_1.hasOwnProperty("job"));//true,是自己独有的属性
alert("jobb" in monster_1);
</script>
</body>
</html>
1、原型模式的使用:第11行,原型模式的使用时通过在模型中添加prototype关键字
2、原型模式模型函数创建:第13行,函数汇总的函数还是采用的这种匿名函数的方式
3、原型模式对象创建自己独有属性:第17行,原型模式对象创建自己独有的属性
4、原型模式解决内存浪费:第23行,原型模式的对象用的是同一个地址
5、isPrototypeOf方法:第25行,原型模式的方法isPrototypeOf来判断proptotype对象和某个实例之间的关系,原型和实例的位置好像和常见的不同
6、hasOwnProperty方法:第26,27行,用hasOwnProperty来判断是否是对象独有属性
7、in方法:第28行,in方法,不明白去看上面的属性方法介绍
2-6
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>课堂演示</title>
</head>
<body>
<script>
//原型模式
function Peopleobj(){}
Peopleobj.prototype.name='喽啰';
Peopleobj.prototype.weapon='大刀';
Peopleobj.prototype.run=function(){
return this.name+'的武器是'+this.weapon
}
var monster_1=new Peopleobj()
var monster_2=new Peopleobj()
//alert(monster_1.constructor)
//这种写法和前面的方式在使用上基本相同,注意是基本
function Monster(){}
Monster.prototype={
constructor: Monster, //此外强制指回Monster
name:'喽啰', //原型字面量方式会将对象的constructor变为Object,
weapon:'大刀',
job:['巡山','打更'],
run:function() {return this.name+'的工作是'+this.job }
}
var monsterA=new Monster()
monsterA.job.push('砍柴')
var monsterB=new Monster()
monsterB.job.push('挑水')
alert(monsterA.job)
alert(monsterB.job)
//alert(monsterA.constructor) </script>
</body>
</html>
1、原型模式的省略prototype写法:第11行,每一个属性或者方法都有prototype,所以很烦,所以有了21到27行的另一种写法
2、另外用匿名函数的写法:第26行,另外一种匿名函数的写法,函数名:function(){}
javascript创建对象的方法--原型模式的更多相关文章
- javascript创建对象的方法--组合模式
javascript创建对象的方法--组合模式 一.总结 0.作用:解决原型模式对象独有属性创建麻烦的问题 1.组合模式使用普遍:jquery就是用的组合模式,组合模式使用非常普遍 2.组合模式优点: ...
- javascript创建对象的方法--构造函数模式
javascript创建对象的方法--构造函数模式 一.总结 构造函数模式作用和不足 1.作用:解决工厂模式不是用new关键字来创建对象的弊端 2.作用:解决工厂模式创建的实例和模型没有内在联系的问题 ...
- javascript创建对象的方法--工厂模式(非常好理解)
javascript创建对象的方法--工厂模式(非常好理解) 一.简介 创建对象的方法 本质上都是把"属性"和"方法",封装成一个对象 创建对象的基本模式 普通 ...
- javascript创建对象之动态原型模式(五)
function Human(name, sex) { this.name = name; this.sex = sex; if (typeof this.say != "function& ...
- javascript创建对象的方法--动态原型模式
javascript创建对象的方法--动态原型模式 一.总结 1.作用:解决组合模式的属性和函数分离问题 2.思路:基本思路和组合模式相同:共用的函数和属性用原型方式,非共用的的函数和属性用构造函数 ...
- javascript创建对象之函数构造模式和原型模式结合使用(四)
创建自定义类型的常见方式就是组合使用构造函数模式与原型模式一起使用. 构造函数模式用于定义实例对象的特有的部分(属性和方法),原型模式用于定义共享的部分. 这样最大限度的节省了内存的开销. funct ...
- javascript创建对象的方法--基本模式
javascript创建对象的方法--基本模式 一.总结 关注本质 二.代码 <!DOCTYPE html> <html lang="zh-cn"> < ...
- javascript 创建对象的7种模式
使用字面量方式创建一个 student 对象: var student = function (){ name : "redjoy", age : 21, sex: women, ...
- javascript创建对象的方法总结
Javascript创建对象 最简单的方法:创建object实例. var person=new Object(); person.name="Joey";person.age=2 ...
随机推荐
- 中断API之enable_irq
void enable_irq(unsigned int irq) 用于使能一个irq. void disable_irq(unsigned int irq)则用于禁止一个irq 其使用的例程如下: ...
- HDU44979 GCD and LCM (素因子分解+计数)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4497 题意: 求有多少种(x,y,z)使得最小公倍数为l,最大公约数为g 分析: 我们将l,g进行素因 ...
- poj 2240 Bellman-Flod 求环
http://poj.org/problem?id=2240 深刻体现了自己代码能力有问题外加改模板能力有问题.外加Debug有问题.以后做到: 1.算法原理能够轻易弄出来. 2.代码模板自己收集各种 ...
- Retrofit请求数据对错误以及网络异常的处理
http://blog.csdn.net/jdsjlzx/article/details/51566683
- 机器学习(三) Jupyter Notebook, numpy和matplotlib的详细使用 (下)
七.Numpy中的矩阵运算 八.Numpy中的聚合运算 九.Numpy中的arg运算 十.Numpy中的比较和Fancy Indexing 十一.Matplotlib数据可视化基础 十二.数据加载和简 ...
- MVC5发展历程,从MVC2谈起
目前,MVC已经发布了5个版本,不包括一些临时的版本,为了更好的了解MVC5,知道MVC的发展历程是非常重要的.本篇随笔主要讲解3个版本的内容及其新特性. 1.MVC 2,发布日期:2010年3月 部 ...
- MVC:一个View显示多个Model(多个Model你可以使用ViewBag或ViewData , 或者:Model["myInfo"] as)
MVC:一个View显示多个Model 多个Model你可以使用ViewBag或ViewData , 或者:Model["myInfo"] as. 比如: Tuple<str ...
- C#读写config配置文件--读取配置文件类
一:通过Key访问Value的方法: //判断App.config配置文件中是否有Key(非null) if (ConfigurationManager.AppSettings.HasKeys()) ...
- Firefox 浏览器有用的插件
1.Undo Closed Tabs Button或Undo Closed Tabs Button (revived) 恢复关闭的标签页 2.NetVideohunter Video Download ...
- vuex requires a Promise polyfill in this browser.--ie-vue-兼容处理日记
1.ie9+报错vuex requires a Promise polyfill in this browser. 解决如下: npm install --save-dev -polyfill 修改c ...