本文主要给大家分享的是Javascript建造者模式，建造者模式是设计模式中的一种，之前我们也了解其他的设计模式，感兴趣的朋友可以了解看看，接下来我们就看Javascript建造者模式的定义、优点、作用和实现等等。

    建造者模式是相对比较简单的一种设计模式，属于创建型模式的一种；

    定义：将一个复杂的对象分解成多个简单的对象来进行构建，将复杂的构建层与表现层分离，使相同的构建过程可以创建不同的表示模式；

    优点：

• 建造者模式的封装性比较好，创建对象和构建过程解耦；
• 建造者模式很容易扩展，当我们需要扩展的时候，通过一个新的建造者就可以实现；

    模式作用：

• 分步创建一个复杂的对象
• 解耦封装过程和具体创建组件
• 无需关心组件如何组装

    注意事项：

• 一定要一个稳定的算法支持　　
• 加工工艺是暴露的，也就是说土豪可以随时去看房子建的怎么样了

白话解释：

某土豪想建一个房子，某土豪只需要找包工头，包工头再去找施工团队来建造房子，而不需要土豪自己去一个个的找工人搭建施工团队开始施工；包工头知道土豪的需求，也知道哪里能找到工人搭建施工团队，工人可以直接干活，中间节省了土豪直接和工人沟通的成本；土豪不需要知道房子该怎么建，土豪只需要最后能验收到房就行；

代码实现

在写代码之前我们先分析一下：

1、产出的东西是房子

2、包工头调用工人进行开工而且他要很清楚工人们具体的某一个大项

3、工人是盖房子的工人可以建卧室建客厅建厨房

4、包工头只是一个接口，他只对外说盖房子，他不用做事情；　　　

function Fangzi(){
    this.woshi = "";
    this.keting = "";
    this.chufang = "";
}

function Baogongtou(){
    this.jianfangzi = function(gongren){
        gongren.jian_woshi();
        gongren.jian_keting();
        gongren.jian_chufang();
    }
}

function Gongren(){
    this.jian_woshi = function(){
        console.log("卧室建好了!");
    }

    this.jian_keting = function(){
        console.log("客厅建好了！");
    }

    this.jian_chufang = function(){
        console.log("厨房建好了！");
    }

    this.wangong = function(){
        var fangzi = new Fangzi();
        fangzi.woshi = "ok";
        fangzi.keting = "ok";
        fangzi.chufang = "ok";
        return fangzi;
    }
}
let gongren = new Gongren();
let baogongtou = new Baogongtou();
//卧室建好了!
//客厅建好了！
//厨房建好了！
baogongtou.jianfangzi(gongren);
var my_fangzi = gongren.wangong();
/*
Fangzi={
       chufang: "ok"
       keting: "ok"
       woshi: "ok"
       }
*/
console.log(my_fangzi);            

上述代码中我们可以看到，Gongren（）里面是具体的施工过程，也就是具体做的事情，Fangzi（）里面一开始都是空的，没有客厅、厨房、卧室；Baogongtou()里面只是对外宣传可以建房子，然后传入工人方法调用工人进行施工；工人方法执行完了也就是施工完了，然后就是交房；一个新的方法里面实例化Fangzi()的方法，在新方法里面重新赋值即可；

    以上就是Javascript建造者模式的相关介绍，本文代码有一定的参考价值，需要的朋友可以了解看看，希望大家阅读完这篇文章能有所收获，想要了解更多Javascript建造者模式的内容，可以继续浏览群英网络其他相关的文章。

文本转载自脚本之家

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

猜你喜欢

• 浅谈vue框架实用技巧，一文带你快速上手

  这篇文章给大家分享一些vue框架的实用小技巧，包括数据的双向绑定、使用 Mixins、使用动态组件去懒加载组件、使用装饰器优化代码等等，小编觉得挺实用的，因此分享给大家做个参考，接下来一起跟随小编看看吧。

• vue项目中怎么实现大屏展示适配，方法代码是什么

  这篇文章主要为大家详细介绍了vue大屏展示适配，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

• JS数组去重有哪些方法，哪种好

  本篇文章给大家带来了关于JavaScript的相关知识，其中主要介绍了关于数组去重的相关问题，包括了es6的set去重、双重for循环去重、indexof去重等等内容，下面一起来看一下，希望对大家有帮助。

• JavaScript对象模式有何特点，怎样实现对象模式

  匹配对象。如果有省略号，对象可以有更多的属性。只检测自己的属性(Object.keys)，忽略原型中的属性。对象语法支持特殊识别属性，快速属性，属性不支持尾逗号。

• JS怎样实现移动端的拖动效果？

  JS怎样实现移动端的拖动效果？移动端的拖动元素的效果想必大家应该都很熟悉，那么这个效果是怎样做的呢？下面我们就来看看用JS实现移动端拖动元素的具体代码。