美文网首页
JS设计模式之工厂模式

JS设计模式之工厂模式

作者: RomainLiu | 来源:发表于2017-06-27 12:59 被阅读32次

关键词:函数,封装,

定义

把实现相同功能的代码放在一个函数中,以后想实现这个功能,只需要执行这个方法就行了-->函数的封装(低耦合,高内聚)。本质上就是普通函数的封装。

使用方法

var a=function (name,age) {
    var obj={};
    obj.name=name;
    obj.age=age;
    obj.createJs=function () {
        console.log(this.name+'和'+this.age)
    }
    return obj;
}
var result1=a('js',18);
var result2=a('jss',18);
result1.createJs();
result2.createJs();

工厂模式的意义:

低耦合,高内聚(减少页面的冗余代码,提高代码的利用率)。

这里不得不提面向对象的特点:类的继承,封装,多态(重载与重写)

关于重载和重写:

重载的定义:函数名相同,函数的参数列表不同(包括参数个数和参数类型),至于返回类型可同可不同。

function a(m){console.log(m)};
function a(m,n){console.log(n+n)};

后台语言中有两个同名函数,传递一个参数时,会执行第一个函数,传递两个参数时,会执行第二个函数。(这是我的理解,真正的后台语言不是以这种形式书写的),在JS中后面的同名函数会把前面覆盖掉,所以不存在重载。只有类似于重载的功能,如下:

function m(params) {
    if(!params){
        return  undefined;
    }
    return params;
}

重写:

function Create(name,age) {
    var name='xiaoming';
    this.name=name;
    this.age=age;
    this.createJs=function () {
        console.log(this.name+'是'+this.age)
    }
}
Create.prototype.test=function () {
    console.log(123);
}
var p1=new Create('js',19);
p1.__proto__.test=function () {
    console.log(100)
}
p1.test();//100,子重写了父的方法;

相关文章

  • 前端设计模式

    JS设计模式一:工厂模式jS设计模式二:单例模式JS设计模式三:模块模式JS设计模式四:代理模式JS设计模式五:职...

  • iOS设计模式(三)之抽象工厂模式

    设计模式系列传送门 iOS设计模式(一)之简单工厂模式iOS设计模式(二)之工厂模式iOS设计模式(三)之抽象工厂...

  • iOS设计模式(一)之简单工厂模式

    设计模式系列传送门 iOS设计模式(一)之简单工厂模式iOS设计模式(二)之工厂模式iOS设计模式(三)之抽象工厂...

  • iOS设计模式(二)之工厂模式

    设计模式系列传送门 iOS设计模式(一)之简单工厂模式iOS设计模式(二)之工厂模式iOS设计模式(三)之抽象工厂...

  • iOS设计模式之美-适配器模式

    iOS设计模式之美-工厂模式iOS设计模式之美-抽象工厂模式iOS设计模式之美-生成器模式iOS设计模式之美-适配...

  • iOS设计模式之美-抽象工厂模式

    iOS设计模式之美-工厂模式iOS设计模式之美-抽象工厂模式iOS设计模式之美-生成器模式iOS设计模式之美-适配...

  • iOS设计模式之美-工厂模式

    iOS设计模式之美-工厂模式iOS设计模式之美-抽象工厂模式iOS设计模式之美-生成器模式iOS设计模式之美-适配...

  • iOS设计模式之美-生成器模式

    iOS设计模式之美-工厂模式iOS设计模式之美-抽象工厂模式iOS设计模式之美-生成器模式iOS设计模式之美-适配...

  • 设计模式之工厂模式

    设计模式之工厂模式 标签(空格分隔): 设计模式 工厂模式 设计模式的感念 设计模式的应用 工厂设计模式的产生 工...

  • 设计模式系列

    创建型模式: 设计模式之工厂模式(Factory Pattern)设计模式之抽象工厂模式(Abstract Fac...

网友评论

      本文标题:JS设计模式之工厂模式

      本文链接:https://www.haomeiwen.com/subject/dgtdcxtx.html