精华内容
下载资源
问答
  • JS构造函数模式

    2017-12-01 08:22:00
    构造函数是可以创建特定类型对象的函数,可以接受参数定义函数成员。如果之前做过java比较好理解,举个例子: function exampleFunction(arg1, arg2, arg3){ this.arg1 = arg1; this.arg1 = arg1; this.arg...

    构造函数是可以创建特定类型对象的函数,可以接受参数定义函数成员。如果之前做过java比较好理解,举个例子:

    function exampleFunction(arg1, arg2, arg3){
      this.arg1 = arg1;
      this.arg1 = arg1;
      this.arg1 = arg1;
      this.output = function(){
        console.log('walk' + arg3);
      }
    }
    

      用法是用new关键字创建实例:

    var instance1 = new exampleFunction(12,32,90);
    instance1.output()   //walk 90
    

      需要注意的是,如果不用new会出现this被绑定到了window对象,上代码:

    var instance2 = exampleFunction(1,2,3);
    console.log(typeof instance2)   //undefined
    console.log(windows.output())   //walk 3
    

      有时候不想用new关键字,但是还是想实例化为exampleFunction,解决方式如下:

    function exampleFunction(arg1, arg2, arg3){
      if(!(this typeof exampleFunction)) {
       return  new exampleFunction(arg1, arg2, arg3);
      }
      this.arg1 = arg1;
      this.arg1 = arg1;
      this.arg1 = arg1;
      this.output = function(){
        console.log('walk' + arg3);
      }
    }
    

      上述构造函数用起来调用output的时候每次都需要定义一个函数,比较占用内存,解决方式两种:

    var a = new exampleFunction(1,2,3);
    console.log(a.output())   //output function 被调用一次
    var b = new exampleFunction(4,5,6)
    console.log(b.output())    //output function 又被调用一次
    
    
    解决方案一:
    定义一个walk function,将其赋值给output,这样只用定义一次,但可多次调用
    walk() {
       console.log('walk' + this.arg3);
    }
    
    构造函数里面this.output替换为this.output = walk;
    
    解决方案二:
    
    使用prototype,
    exampleFunction.prototype.output = function() {
      console.log('walk' + this.arg3);
    }
    

      

    转载于:https://www.cnblogs.com/feiyeah/p/7940223.html

    展开全文
  • 原形模式 组合使用构造函数模式和原型模式 转载于:https://my.oschina.net/ksss/blog/610975...

    原形模式

    160340_DbhW_1017184.jpg

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

    160252_uD7S_1017184.png

    转载于:https://my.oschina.net/ksss/blog/610975

    展开全文
  • 承接上一篇,在JS中组合使用构造函数模式与原型模式创建对象,今天接着说剩下几种模式: 动态原型模式 寄生构造函数模式(parasitic) 稳妥构造函数模式(durable) 动态原型模式 动态原型模式把所有信息都封装到...

    承接上一篇,在JS中组合使用构造函数模式与原型模式创建对象,今天接着说剩下几种模式:

    动态原型模式
    寄生构造函数模式(parasitic)
    稳妥构造函数模式(durable)
    动态原型模式

    动态原型模式把所有信息都封装到构造函数中,而通过在构造函数中初始化原型(仅在必要的条件下),又保持了同时使用构造函数和原型的优点。即可以检查某个应该存在的方法是否有效,来决定是否需要初始化原型,看下面:

    function Person(name,age,gender){
        this.name = name;
        this.age = age;
        this.gender = gender;

        if(typeof this.sayName != "function"){
            Person.prototype.sayName = function(){
                alert(this.name);
            };
        }
    }
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    这里需要说明的是if里代码只会在初次调用构造函数时才会执行,当然了,下次调用构造函数时,this.sayName已经存在嘛,而且if里对原型所在的修改会立即在所有实例中得到反映,这里可能就是体现其动态的所在之处。同样,这里要记住不能使用对象字面量重写原型,上篇中已提到过,如果在已经创建了实例的情况下重写原型,那么就会切断现有实例与新原型之间的联系。

    寄生构造函数模式

    先看下面的代码:

    function SpecialArray(){
        var array = new Array();
        array.push.apply(array,arguments);
        array.toPipedString = function(){
            return this.join("|");
        };
        return array;
    }
    var colors = new SpecialArray("red","green","pink");
    alert(colors.toPipedString());// red|green|pink
    alert(colors instanceof SpecialArray); // false 
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    详细说明下,我们知道当我们自定义一个构造函数后,使用new的方式来创建一个对象时,默认会返回一个新对象实例,构造函数中是没有return 语句的。而这里所谓的寄生构造函数,基本思想是创建一个函数,这个函数的作用仅仅是为了某一个特定的功能而添加一些代码,最后再将这个对象返回,除了使用了new操作符并把包装的函数叫做构造函数外,这个模式跟工厂模式没有任何区别。另外,这个SpecialArray()返回的对象,与SpecialArray()构造函数或者与构造函数的原型对象之间没有任何关系,就像你在SpecialArray()外面创建的其他对象一样,所以如果用instanceof操作符来检测的话,结果只能是false咯。所以这是它的问题

    稳妥构造函数模式

    先说稳妥二字,别人定义了一个稳妥对象,即没有公共属性,而且其方法也不引用this对象,这种模式适应于一些安全环境中(禁止使用this和new),或防止数据被其他应用程序改动,像下面这样:

    function Person(name,age,gender){
        var obj = new Object();
        obj.sayName = function(){
            alert(name);
        };
        return obj;
    }
    var person = Person("Stan",0000,"male"); // 这里没有使用new操作符
    person.sayName(); // Stan
    alert(person instanceof Person); // false
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    说明一下,这里person中保存了一个稳妥对象,除了调用sayName()方法外,没有别的方式可以访问其数据成员。即使有其他代码会给这个对象添加方法或属性,但也不可能有别的办法访问传入到构造函数中的原始数据 。同样与寄生函数模式类似,使用稳妥构造函数模式创建的对象与构造函数之间也没有任何关系.
    --------------------- 
    作者:Stangor 
    来源:CSDN 
    原文:https://blog.csdn.net/stanxl/article/details/51111129 
    版权声明:本文为博主原创文章,转载请附上博文链接!

    展开全文
  • js-—动态原型模式、寄生构造函数模式、稳妥构造函数模式 1.动态原型模式(要new): 举例: function Model(name,age,hobby){ this.name = name; this.age = age; this.hobby = hobby; //...

    原生js-—动态原型模式、寄生构造函数模式、稳妥构造函数模式

    1.动态原型模式(要new):
    • 举例:

      	function Model(name,age,hobby){
      		this.name = name;
      		this.age = age;
      		this.hobby = hobby;
      		//方法(如果show()方法不存在,才会动态添加,而且这个方法在初次调用构造函数才会执行,不调用构造函数就不会执行,这里对原型做的修改,能够在实例中立刻得到反映);
      		if(typeof this.show != "function"){
      			Model.prototype.show = function(){
      				alert(this.name);
      			}
      		}
      	}
      	
      	var object5 = new Model("YYM",20,"baseball");
      		object5.show();
      
      
    2.寄生构造函数模式(要new,和工厂模式的唯一区别就是,要使用new来创建对象。查看工厂模式:link(https://blog.csdn.net/qq_43495629/article/details/87876613).):
    • 举例:
      	function createModel(name,age,hobby){
      		var o = {};
      		o.name = name;
      		o.age = age;
      		o.hobby = hobby;
      		o.show = function(){
      			alert(this.name);
      		};						//注意这里的分号;
      		return o;				//返回这个对象;
      	}
      	
      	var object1 = new createModel("YYM",20,"baseball");
      		object1.show();      //"YYM"
      
      :(能使用其他模式的情况下,尽量不要使用这种模式,因为 return 回来的对象与构造函数或构造函数原型没有任何关系);
    3.稳妥构造函数模式(不new,不使用this,无公共属性,要访问函数内部的自定义私有属性,只能通过创建对象来调用本函数内部自定义的属性访问方法,来获得私有属性的访问权。有点 java 中的getter(),setter()的味道):
    • 举例:

      	function createModel(name,age,hobby){
      		var o = {};
      		//可以自己在这里定义私有属性和函数;
      		
      		//方法;
      		o.show = function(){
      			alert(name);		//注意这里不再使用this;
      		};						//注意这里的分号;
      		return o;				//返回这个对象;
      	}
      	
      	var object1 = createModel("YYM",20,"baseball"); //不new
      		object1.show();      //"YYM"
      

      注:变量 object1 中保存的是稳妥对象,除了使用 show() 方法 以外,无法访问其数据属性,它和构造函数也无任何关系;

      如要查看工厂模式、构造函数模式、原型模式
      请查看:link(https://blog.csdn.net/qq_43495629/article/details/87876613).

      如遇错误,欢迎指正;

    展开全文
  • JS构造函数设计模式

    2017-04-25 16:45:57
    在上一篇文章中看到了工厂模式的缺点,又出现了构造函数模式。工厂模式 function Person(name, age, sex) { this.name = name; this.age = age; this.sex = sex; this.sayInfo = function () { console....
  • 组合使用构造函数模式和原型模式 ——使用广泛、认同度高的一种创建自 定义类型的方法 构造函数模式用于定义实例属性, 原型模式用于定义方法和共享的属性。 结果,每个实例都会有自己的一份实例属性的副本, 但同时...
  • 看这两名字,都带构造函数,一个寄生一个稳妥。那么,先来回忆一下构造函数模式: 在这里插入代码片
  • prototype就是通过调用构造函数而创建的那个对象实例的原型对象,使用原型对象的好处是可以让所有对象实例共享包含的属性和方法。 什么叫让所有对象实例共享包含的属性和方法 直接在对象实例上定义方法的缺点是,...
  • JS设计模式之构造函数模式
  • JS构造函数模式

    2019-03-14 15:53:02
    JS中,每一个函数被定义之后,就会为这个函数创建一个prototype属性,该属性指向了这个函数的原型对象。 那原型对象能在对象的构造中发挥多大的作用呢?先看一个例子 function Person(){ this.name = 'Tom'; ...
  • JS设计模式 - 构造函数模式,工厂模式与抽象工厂模式 1. 构造函数模式 (1) JS中创建新对象的三种常用方法 var newObject = {}; var newObject = Object.create( Object.prototype ); var newObject = ...
  • JS构造函数

    2020-06-13 00:37:23
    JS基础 6/12/2020 1:38:43 PM JS中不存在重载,方法名一样的话,后面的会把前面的覆盖掉,最后只保留一个 但js中有重写:子类重写父类的方法 JS中有一个操作类似重载但不是重载:我们可以根据传递...构造函数模式
  • 入门js设计模式——构造函数模式 参考或者说照搬:http://www.cnblogs.com/TomXu/archive/2012/02/21/2352994.html 1.构造函数 在JavaScript里,构造函数通常是认为用来实现实例的,...
  • 寄生构造函数模式 通常,在前述的几种模式都不适用的情况下,可以使用寄生(parasitic)构造函数模式。这种模式的基本思想是创建一个函数,该函数的作用仅仅是封装创建对象的代码,然后再返回新创建的对象;但从...
  • 1.工厂函数模式 function createPerson(name,age,gender) { var p = { name:name, age:age, gender:gender } return p } var cat = createPerson('tom',12,'
  • 组合使用构造函数模式和原型模式。 构造函数和原型模式都各有各的优点,与缺点。 比如说构造函数的每个方法都要在每个实例上重新创造一遍,因为函数是对象,因此没定义一个函数就定义了一个对象。即如: function...
  • 1.简单的构造函数模式  function A(a){  this.a=a;  this.fn = function(){  return this.a   }   } var a =new A('a'); 问题:每次新建一个实例都要重新定义fn方法 2.构造函数+原型模式 解决每次...
  • 构造函数模式 function WriteJsPerson(name,age) { this.name=name; //不用手动创建obj this.age = age; this.writeJs=function () { console.log(this.name+"hello") }; //不用写return语句了 } p2 = n...
  • 1.工厂函数模式 function createPerson(name,age,gender) { var p = { name:name, age:age, gender:gender } retur...
  • 寄生构造函数模式 js

    2017-07-03 17:29:00
    有一点需要说明:首先返回的对象与构造函数或者构造函数的原型属性之间没有关系,也就是说构造函数返回的对象与在构造函数外部创建的对象没有什么不同,为此不能依赖 instanceof 操作符来确定对象类型。 由于存在...
  • 组合使用构造函数模式和原型模式 创建自定义类型的最常见方式,就是组合使用构造函数模式与原型模式。构造函数模式用于定义实例属性,而原型模式用于定义方法和共享的属性。结果,每个实例都会有自己的一份实例属性...
  • JS 构造函数

    2017-02-19 14:54:00
    构造函数执行的过程如下:当使用构造函数创建对象,也就是说 new 构造函数()时,内部就执行啦new object()将构造函数的作用域给新对象,(既new Object()创造出来的对象)而函数体内的this就代表new object()出来的对象...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,867
精华内容 746
关键字:

js构造函数模式