JavaScript进阶：建造者模式

1、前言

建造者模式是将复杂的对象的构建层与表示层区分开来，使用不同的方式去呈现。

2、示例

工厂模式与建造者模式都是为了创建对象或者类而存在的，它们之间的区别是工厂模式关心的是产出物，也就是最终创建的对象的结果，而建造者模式与之不同，建造者模式关心的是创建对象的一系列过程。
如：创建一个电子产品类，电子产品下又细分很多类，可以是属于手机类，收音机类，电脑类等，不同的子类对应的功能点以及一些属性也可能会不同（比如：手机的功能点为打电话，发短信等，收音机的功能点为听戏曲等）
在创建对象的实例的同时，我们也需要更多的去关注这个创建出来的对象的自身的一些特点，这个对象的细节都需要关注去创建。

• 创建电子产品类：

// 创建电子产品类
const Electronic = function(params) {
    this.electronic_name = params && params[electronic_name] || 'The name of the electronic product was not obtained';
    this.electronic_type = params && params[electronic_type] || 'The type of electronic product was not obtained';
}

// 在创建的电子产品类的原型链上添加获取产品名称以及获取产品类型的方法
Electronic.prototype = {
    getElectronicName: function() {
        return this.electronic_name;
    },
    getElectronicType: function() {
        return this.electronic_type;
    }
}

• 实例化电子产品名称类(属性类)：

// 实例化电子产品名称类
const ElectronicName = function(name) {
    const _that = this;
    (function(_that, name){
        _that.name = name;
    })(_that, name);
}

• 实例化电子产品类型类(属性类)：

// 实例化电子产品类型类
const ElectronicType = function(type) {
    const _that = this;
    (function(_that, type){
        switch (type){
            case 'phone':
                _that.desc = 'This is a mobile phone'; // 描述
                _that.funPoint = ['call','music','message','play game']; //功能点
                break;
            case 'mp3':
                _that.desc = 'This is a mp3'; // 描述
                _that.funPoint = ['music']; //功能点
                break;
            case 'computer':
                _that.desc = 'This is a computer'; // 描述
                _that.funPoint = ['code','music','WeChat','office','study','watch movie','play game']; //功能点
                break;
            case 'radio':
                _that.desc = 'This is a radio'; // 描述
                _that.funPoint = ['music','opera']; //功能点
                break;
            default:
                break;
        }
    })(_that, type);
}

在实例化电子产品类的同时，我们对其原型链上添加方法，以便后期开发者能够对其中的desc和funPoint功能点等属性内容进行修改操作。

// 修改电子产品的描述信息
ElectronicType.prototype.changeDesc = function(desc) {
    this.desc = desc;
}

// 修改电子产品的功能点
ElectronicType.prototype.changeFun = function(funPoint) {
    // 判断修改时传入的是否为数组数据
    if(funPoint instanceof Array) {
        this.funPoint = funPoint;
    }
}

• 创建一个电子产品：
  创建一个电子产品，调用前面3个抽象的类对传入过来的参数进行实例化处理，这样就能完整的创建出某个实例对象。

// 创建一个电子产品
const Product = function(name, type) {
    let _product = new Electronic();
    _product.name = new ElectronicName(name);
    _product.type = new ElectronicType(type);
    
    return _product; // 返回产品实例对象出去
}

• 开始测试：

const phone = new Product('三星S9', 'phone');
console.log(phone);
console.log(phone.electronic_name);
console.log('打印手机的名称：',phone.name.name);
console.log('打印修改前的手机描述：',phone.type.desc);
phone.type.changeDesc('Modification of description information of electronic products');
console.log('打印修改后的手机描述：',phone.type.desc);
console.log('打印修改前的手机的功能点：',phone.type.funPoint);
phone.type.changeFun(['1','2','3','4','5']);
console.log('打印修改后的手机的功能点：',phone.type.funPoint);

图（result）.png

建造者模式最大的作用就是： 将一个复杂对象的构建与它的表示分离，使得同样的构建过程可以创建不同的表示。