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

一、总结

构造函数模式作用和不足

1、作用:解决工厂模式不是用new关键字来创建对象的弊端

2、作用:解决工厂模式创建的实例和模型没有内在联系的问题

3、不足:无法解决工厂模式不同实例对应于不同内存的问题(内存浪费),这个用原型模式可以解决

二、javascript创建对象的方法--构造函数模式(需仔细看

构造函数模式

  1. new 调用的函数为构造函数,构造函数和普通函数区别仅仅在于是否使用了new来调用。
  2. 所谓“构造函数”,就是专门用来生成“对象”的函数。它提供模板,作为对象的基本结构。
  3. 构造函数内部使用了this变量。对构造函数使用new运算符,就能生成实例,并且this变量会绑定在实例对象上。
  4. instanceof 验证原型对象与实例对象之间的关系。
  5. 使用call和apply方法实现对象的冒充
  6. 问题:浪费内存--使用构造函数每生成一个实例,都增加一个重复的内容,多占用一些内存。这样既不环保,也缺乏效率。

三、代码

代码一:

  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>课堂演示</title>
  6. </head>
  7. <body>
  8. <script>
  9. //基本模式
  10. var people1=new Object();
  11. people1.name='孙悟空';
  12. people1.weapon='金箍棒';
  13. people1.run=function(){
  14. return this.name+'的武器是'+this.weapon
  15. }
  16. // alert(people1.name)
  17. //alert(people1.run()) //注意方法的调用需要加()
  18. //该方法如果创建多个对象就会比较繁琐,如下......
  19. var people2=new Object();
  20. people2.name='猪八戒';
  21. people2.weapon='钉耙';
  22. people2.run=function(){
  23. return this.name+'的武器是'+this.weapon
  24. }
  25. //工厂模式
  26. function creatPeople(name,weapon){
  27. var people=new Object() //可以类比为加工对象的原材料
  28. people.name=name;
  29. people.weapon=weapon;
  30. people.run=function(){
  31. return this.name+'的武器是'+this.weapon
  32. } //以上步骤可以类比为加工对象的过程
  33. return people //注意一定要讲创建的对象返回
  34. //可以类比为产品加工完毕出厂的工作
  35. }
  36. var wukong=creatPeople('孙悟空','金箍棒');
  37. var bajian=creatPeople('猪八戒','钉耙');
  38. //alert(wukong.run)
  39. //alert(bajian.run)
  40. //alert(wukong.run==bajian.run)//两个对象实例的地址是不同的,说明两个对象会占用两个地址空间的内存
  41. //new 关键字
  42. function fun(){
  43. alert(this)
  44. }
  45. //fun()
  46. //new fun() //如果有new 函数里的this就是新创建出来的对象,如果没有就是Window
  47. //构造函数模式
  48. //注意:构造函数不需要使用 return语句返回对象,它的返回是自动完成的
  49. function People(name,weapon){
  50. this.name=name;
  51. this.weapon=weapon;
  52. this.run=function(){
  53. return this.name+'的武器是'+this.weapon
  54. }
  55. }
  56. var wujing=new People('沙悟净','禅杖');
  57. alert(wujing.run())
  58. </script>
  59. </body>
  60. </html>

1、原型模式(内存浪费):原型模式的不同实例分配到不同的内存

2、this用法:普通函数,如果有new 函数里的this就是新创建出来的对象,如果没有就是Window

3、js构造函数自动返回:js的构造函数不需要返回,自动返回

4、this用法:用了this关键字,因为用了new之后this指向对象

5、var 变量名接收一切:js中新创建出来的对象还是用 var 变量名 的方式接收,和变量的方式一样

6、js构造模式和其它一样:js的构造模式和java、c++等一样

代码二:

  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>课堂演示</title>
  6. </head>
  7. <body>
  8. <script>
  9. //构造函数模式
  10. //注意:构造函数不需要使用 return语句返回对象,它的返回是自动完成的
  11. function People(name,weapon){
  12. this.name=name;
  13. this.weapon=weapon;
  14. this.run=function(){
  15. return this.name+'的武器是'+this.weapon
  16. }
  17. }
  18. var wujing=new People('沙悟净','禅杖');
  19. var wukong=new People('孙悟空','金箍棒');
  20. var bajian=new People('猪八戒','钉耙');
  21. //alert(wujing.run())
  22. //alert(wujing instanceof People)
  23. var monster=new Object();
  24. //People.call(monster,'妖怪','葫芦')
  25. People.apply(monster,['妖怪','葫芦'])
  26. // alert(monster.run())
  27. // alert(monster.name)
  28. var monster1=new People('小妖','长矛')
  29. var monster2=new People('小妖','长矛')
  30. alert(monster1.run()+'\n'+monster2.run())
  31. alert(monster1.run==monster2.run)//两个对象实例的地址是不同的,说明两个对象会占用两个地址空间的内存
  32.  
  33. </script>
  34. </body>
  35. </html>

1、判断实例instanceof来判断实例,看这个of就知道实例在前,模型在后

2、call和apply用法:call方法和apply方法实现对象的模仿,用法是要 被模仿的东西.apply 的形式

3、构造模式内存浪费:构造器模式创建的对象分配的地址是不同的

javascript创建对象的方法--构造函数模式的更多相关文章

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

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

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

    javascript创建对象的方法--原型模式 一.总结 1.原型模式解决内存浪费的方法(继承):通过继承,对象继承原型模式下的所有属性,对象不同于其它对象的的属性自己创建或者修改 2.原型的使用(p ...

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

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

  4. javascript创建对象之稳妥构造函数模式(七)

    所谓稳妥对象,指的是没有公共属性,而且其方法也不引用this的对象.稳妥对象最适合在一些安全的环境中(禁止使用this和new)或者在防止数据被其他应用程序改动时. 稳妥构造函数模式有2个特点:1.新 ...

  5. javascript创建对象之寄生构造函数模式(六)

    这种模式的基本思想是创建一个函数,该函数的作用仅仅是封装创建对象的代码,然后再返回新创建的对象; 但是从表面上看,这个函数有很像典型的构造函数. function createHuman(name,s ...

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

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

  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. 题解 P1198 【[JSOI2008]最大数】

    说起来这还是蒟蒻AC的第一道省选线段树呢. 这道题和其他线段树最大的不同就是在于本题数组一直在增大. 寻常的线段树蒟蒻习惯用如下的结构体储存,然而对于此题就不行了: struct node{ int ...

  2. java流1----InputStream、OutputStream、Reader、Writer

    字节流和字符流 顾名思义,字节流就是操作的是字节,字符流操作的就是字符.其中字节流又可以分为字节输入流(InputStream)和字节输出流(OutputStream).同样的字符流也可以分为字符输入 ...

  3. codevs——T1337 银行里的迷宫

     时间限制: 1 s  空间限制: 128000 KB  题目等级 : 白银 Silver 题解       题目描述 Description 楚楚每一次都在你的帮助下过了一关又一关(比如他开宴会). ...

  4. C++关于二进制位操作小结

    #include <iostream> using namespace std; //二进制位逆序. int Grial(int x) { int n = 32; int count = ...

  5. shu_1171 十-&gt;二进制转换(输入输出控制)

    cid=1079&pid=19">http://202.121.199.212/JudgeOnline/problem.php?cid=1079&pid=19 分析:主 ...

  6. hdoj--1034--Hidden String(dfs)

    Hidden String Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Others) ...

  7. 26.angularJS $routeProvider

    转自:https://www.cnblogs.com/best/tag/Angular/ O'Reilly书上的伪代码 var someModule = angular.module('someMod ...

  8. 4.graph.h

    #pragma once #include <stdio.h> #include <graphics.h> #include <mmsystem.h> #pragm ...

  9. 团队作业——团队项目Alpha版本发布

    该作业所属课程 https://edu.cnblogs.com/campus/xnsy/SoftwareEngineeringClass2 作业要求链接    https://edu.cnblogs. ...

  10. Android自定义组件系列【14】——Android5.0按钮波纹效果实现

    今天任老师发表了一篇关于Android5.0中按钮按下的波纹效果实现<Android L中水波纹点击效果的实现>,出于好奇我下载了源代码看了一下效果,正好手边有一个Nexus手机,我结合实 ...