javascript创建对象的方法--原型模式

一、总结

1、原型模式解决内存浪费的方法(继承):通过继承,对象继承原型模式下的所有属性,对象不同于其它对象的的属性自己创建或者修改

2、原型的使用(prototype关键字):定义模型的时候在属性中加上prototype关键字就好,这里对象用的不是this,prototype关键字添加方式用的是点,例如Peopleobj.prototype.name='喽啰';

3、缺点:构造函数没有参数

二、(Prototype)原型模式

Javascript规定,每一个构造函数都有一个prototype属性,指向另一个对象。这个对象的所有属性和方法,都会被构造函数的实例继承。可以把那些不变的属性和方法,直接定义在prototype对象上。

  1. prototype方式定义的方式,函数不会拷贝到每一个实例中,所有的实例共享prototype中的定义,节省了内存。
  2. Prototype模式的验证方法
    1. isPrototypeOf()这个方法用来判断,某个proptotype对象和某个实例之间的关系。
    2. hasOwnProperty()每个实例对象都有一个hasOwnProperty()方法,用来判断某一个属性到底是本地属性,还是继承自prototype对象的属性
    3. in运算符in运算符可以用来判断,某个实例是否含有某个属性,不管是不是本地属性。in运算符还可以用来遍历某个对象的所有属性。
  3. 对象的constructor属性用于返回创建该对象的构造函数.(注:了解即可)

    在JavaScript中,每个具有原型的对象都会自动获得constructor属性。

  4. 原型方式的问题:
    • 构造函数没有参数。使用原型方式,不能通过给构造函数传递参数来初始化属性的值
    • 属性指向的是对象,而不是函数时。函数共享不会造成问题,但对象却很少被多个实例共享,如果共享的是对象就会造成问题。

三、代码

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创建对象的方法--原型模式的更多相关文章

  1. javascript创建对象的方法--组合模式

    javascript创建对象的方法--组合模式 一.总结 0.作用:解决原型模式对象独有属性创建麻烦的问题 1.组合模式使用普遍:jquery就是用的组合模式,组合模式使用非常普遍 2.组合模式优点: ...

  2. javascript创建对象的方法--构造函数模式

    javascript创建对象的方法--构造函数模式 一.总结 构造函数模式作用和不足 1.作用:解决工厂模式不是用new关键字来创建对象的弊端 2.作用:解决工厂模式创建的实例和模型没有内在联系的问题 ...

  3. javascript创建对象的方法--工厂模式(非常好理解)

    javascript创建对象的方法--工厂模式(非常好理解) 一.简介 创建对象的方法 本质上都是把"属性"和"方法",封装成一个对象 创建对象的基本模式 普通 ...

  4. javascript创建对象之动态原型模式(五)

    function Human(name, sex) { this.name = name; this.sex = sex; if (typeof this.say != "function& ...

  5. javascript创建对象的方法--动态原型模式

    javascript创建对象的方法--动态原型模式 一.总结 1.作用:解决组合模式的属性和函数分离问题  2.思路:基本思路和组合模式相同:共用的函数和属性用原型方式,非共用的的函数和属性用构造函数 ...

  6. javascript创建对象之函数构造模式和原型模式结合使用(四)

    创建自定义类型的常见方式就是组合使用构造函数模式与原型模式一起使用. 构造函数模式用于定义实例对象的特有的部分(属性和方法),原型模式用于定义共享的部分. 这样最大限度的节省了内存的开销. funct ...

  7. javascript创建对象的方法--基本模式

    javascript创建对象的方法--基本模式 一.总结 关注本质 二.代码 <!DOCTYPE html> <html lang="zh-cn"> < ...

  8. javascript 创建对象的7种模式

    使用字面量方式创建一个 student 对象: var student = function (){ name : "redjoy", age : 21, sex: women, ...

  9. javascript创建对象的方法总结

    Javascript创建对象 最简单的方法:创建object实例. var person=new Object(); person.name="Joey";person.age=2 ...

随机推荐

  1. 【Henu ACM Round#19 D】 Points on Line

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 考虑l..r这个区间. 且r是满足a[r]-a[l]<=d的最大的r 如果是第一个找到的区间,则直接累加C(r-l+1,3); ...

  2. 局部特化 & 特化

    注意,显式特化不是一个模板.如果是类型跟显式特化一样,那么不是实例化. 显式特化类的函数,不需要再加template,因为不是模板方法. 特化类的函数跟模板类不一定要一样,但是一样更好. 不支持局部特 ...

  3. Linux系统编程——进程间通信:信号中断处理

    什么是信号? 信号是 Linux 进程间通信的最古老的方式.信号是url=474nN303T2Oe2ehYZjkrggeXCaJPDSrmM5Unoh4TTuty4wSgS0nl4-vl43AGMFb ...

  4. vue21 slot占位

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 直播聊天室,点亮效果,jquery实现

    1.css #like_area img{ width: 30px; height: 30px; position: absolute; bottom: 100px; left: 60%; margi ...

  6. HtmlHelper的扩展分页方法

    一.新建一个空MVC项目,命名为MVCAppPager 二.新建一个文件夹PageHelper,在文件夹下新建接口IPageList以及实现类PageList IPageList接口: public ...

  7. xcode 条件调试

    添加条件 有时候我们可能会在某个循环中创建断点,但一次又一次地点击 continue 直到我们想要的条件出现,显然是一种非常低效的方式.好在 Xcode 为我们提供了条件断点. 首先在下列代码中插入一 ...

  8. 【Codeforces Round #424 (Div. 2) A】Unimodal Array

    [Link]:http://codeforces.com/contest/831/problem/A [Description] 让你判断一个数列是不是这样一个数列: 一开始是严格上升 然后开始全都是 ...

  9. Android基于XMPP Smack及Openfire学习笔记(1)

    之前开发的项目中实用到IM聊天功能.可是这块功能公司有专门的IM团队来开发,由他们开发好后.直接接入到我们APP中.我參与写IM相关功能非常地少,所以也一直想学习相关知识 . 眼下Android主要用 ...

  10. 使用bitmap处理海量数据

    bitmap是一个十分实用的结构.所谓的Bit-map就是用一个bit位来标记某个元素相应的Value, 而Key即是该元素.因为採用了Bit为单位来存储数据,因此在存储空间方面,能够大大节省.  适 ...