• 构造函数本身就是一个函数,只不过该函数是出于创建对象的目的而定义的。

    创建Object实例的两种方式:
  1. new 操作符

     	var person = new Object();
    person.name = "yehui";
    person.age = 20;
  2. 对象字面量

     	var person ={
    name : 'yehui',
    age : 20
    }

创建对象

虽然用Object构造函数或对象字面量都可以创建对象,但是有很大的缺点,就是我们在使用同一个接口创建很多对象的时候,会产生大量的重复代码。

  • 工厂模式

    是软件工程一种广为人知的设计模式,这种模式抽象了创建具体对象的过程。考虑到ES5中没有类,开发人员发明了一种函数,这种函数用来封装特定的接口创建对象的细节。工厂模式解决了创建多个相似对象的问题,但是没有解决对象识别的问题(即怎么知道一个对象的类型)。

    于是我们有了构造函数模式

  • 构造函数模式

    使用构造函数模式解决了对象识别的问题,也于是我们这个解决了多个函数同做一件事的问题。但是我们通过构造函数模式创建对象时,在全局作用域中定义的函数实际上只能被某个对象调用,这让全局对象作用域有点名副其实。还有就是如果对象需要定义很多方法,那末就要定义很多个全局函数,那么我们这个自定义的引用类型就没有封装性可言。所以我们有了原型模式。

  • 原型模式

    利用这种模式我们可以让所有对象的实例共享同一个资源,就是说我们不必再构造函数中定义对象实例的信息,而是将这些信息直接添加到源性对象中去。虽然我们的原型模式解决了对象实例共用一个属性或方法的问题,我们也可以给实例自定义属性,因为其可以屏蔽原型中的相同名字的属性,但是当我们有了两个对象的实例相等时,当我们改变一个和源性对象有相同名字的属性的时候,那么两个对象实例的该属性都会受到影响,因为他们指向同一个源性对象。

  • 组合使用构造函数模式和原型模式

    构造函数模式用来定义实例属性,原型模式用于定义方法和共享的属性。结果,每一个实例都会有自己的一份实例属性的副本,但是同时哟共享着对方的引用,最大限度的节省了内存。

      function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.friends = ["yehuii", "bob"];
    } Person.prototype = {
    constructor : Person,
    sayName : function(){
    alert(this.name)
    }
    } var person111 = new Person("tom", 22, "gmigjgrf");
    var person222 = new Person("tim", 55, "doctor"); person111.friends.push("van");
    console.log(person111.friends);
    console.log(person222.friends);
    console.log(person111.friends === person222.friends);
    console.log(person111.sayName === person222.sayName);

组合式的模式就解决了,两个对象之间的相互影响。这种对象的创建模式是当前最受欢迎的一种,也是认同度最好的一种。

  • 动态原型模式

    有经验的开发人员看到独立的构造函数和原型时,很可能会感到困惑,动态原型模式就是致力于解决这类的问题,他把所有的信息都封装在一个构造函数中,而通过在构造函数中初始化原型,而保持了同时使用构造函数和原型的优点。简单的说,就是通过检查某个应该存在的方法是否有效来决定是否需要初始化原型。

      function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    //这个是方法,他只会在sayName不存在的时候才添加到原型中去,这段代码只会在初次调用时才会执行
    if(typeof this.sayName != "function"){
    Person.prototype.sayName = function(){
    alert(this.name);
    }
    }
    } var friend = new Person('yemengmeng', 15, 'meinv');
    friend.sayName();
  • 待续

js设计模式理解干货的更多相关文章

  1. JS设计模式(一)

    刚入职时,看过一段时间的设计模式,似懂非懂.不知不觉过去七个月了,对JS的理解更深刻了,数据结构与算法的基础也基本上算是过了一遍了,接下来要把设计模式搞定,然后不再深层次研究JS了,而是学习前端自动化 ...

  2. js设计模式(12)---职责链模式

    0.前言 老实讲,看设计模式真得很痛苦,一则阅读过的代码太少:二则从来或者从没意识到使用过这些东西.所以我采用了看书(<js设计模式>)和阅读博客(大叔.alloyteam.聂微东)相结合 ...

  3. js设计模式总结1

    js设计模式有很多种,知道不代表会用,更不代表理解,为了更好的理解每个设计模式,对每个设计模式进行总结,以后只要看到总结,就能知道该设计模式的作用,以及模式存在的优缺点,使用范围. 本文主要参考张容铭 ...

  4. JS设计模式——5.单体模式

    JS设计模式——5.单体模式 http://www.cnblogs.com/JChen666/p/3610585.html   单体模式的优势 用了这么久的单体模式,竟全然不知!用它具体有哪些好处呢? ...

  5. js 设计模式-接口

    js模拟java接口检测函数:确保子类实现接口中的方法:(出自js设计模式) 上代码: <script type="text/javascript" > <%-- ...

  6. 前端笔记之JavaScript面向对象(三)初识ES6&underscore.js&EChart.js&设计模式&贪吃蛇开发

    一.ES6语法 ES6中对数组新增了几个函数:map().filter().reduce() ES5新增的forEach(). 都是一些语法糖. 1.1 forEach()遍历数组 forEach() ...

  7. [js]js设计模式小结

    js设计模式小结 工厂模式/构造函数--减少重复 - 创建对象有new - 自动创建obj,this赋值 - 无return 原型链模式 - 进一步去重 类是函数数据类型,每个函数都有prototyp ...

  8. [js]设计模式小结&对原型的修改

    js设计模式小结 工厂模式/构造函数--减少重复 - 创建对象有new - 自动创建obj,this赋值 - 无return 原型链模式 - 进一步去重 类是函数数据类型,每个函数都有prototyp ...

  9. vue自定义指令(Directive中的clickoutside.js)的理解

    阅读目录 vue自定义指令clickoutside.js的理解 回到顶部 vue自定义指令clickoutside.js的理解 vue自定义指令请看如下博客: vue自定义指令 一般在需要 DOM 操 ...

随机推荐

  1. 常用代码页与BOM

    常用代码页:CP437 IBM437 OEM United StatesCP1252表示West European LatinCP932 日本CP949 韩国CP936表示GBK中文编码CP54936 ...

  2. MySQL中的索引提示Index Hint

    MySQL数据库支持索引提示(INDEX HINT)显式的高速优化器使用了哪个索引.以下是可能需要用到INDEX HINT的情况 a)MySQL数据库的优化器错误的选择了某个索引,导致SQL运行很慢. ...

  3. Geforce experience报错:something went wrong try restarting geforce

    右键计算机 ——>管理——> 服务和应用程序 ——>服务中

  4. zabbix3.2.4监控MySQL5.7.16状态

    一.添加监控用户mysql> grant all privileges on *.* to 'zabbix'@'localhost' identified by 'zabbix';mysql&g ...

  5. 每天一个Linux命令(64)shutdown命令

        shutdown以一种安全的方式关闭系统.     (1)用法:     用法:  shutdown [参数] [时间]     (2)功能:     功能:  系统关机命令,shutdown ...

  6. 用js来实现那些数据结构 第一章

    在开始正式的内容之前,不得不说说js中的数据类型和数据结构,以及一些比较容易让人混淆的概念.那么为什么要从数组说起?数组在js中是最常见的内存数据结构,数组数据结构在js中拥有很多的方法,很多初学者记 ...

  7. Linux进程中TIME_OUT解析

    TIMEWAIT状态本身和应用层的客户端或者服务器是没有关系的.仅仅是主动关闭的一方,在使用FIN|ACK|FIN|ACK四分组正常关闭TCP连接的时候会出现这个TIMEWAIT.服务器在处理客户端请 ...

  8. CSS3 3D折叠展开动画菜单

    在线演示 本地下载

  9. debian下使用dynamic printk分析usb网卡驱动

    在<debian下使用dynamic printk分析usb转串口驱动执行流程>中使用了usb转串口,当前例子使用usb网卡分析驱动(dm9601芯片). 仍然需要使能dynamic pr ...

  10. Java Hibernate 5.3.x

    SchemeExport Hibernate根据实体类和实体类映射文件自动生成表结构. 示例代码: <?xml version='1.0' encoding='utf-8'?> <! ...