javascript----放大模式

放大模式

 

 

1.介绍：放大模式降低模块之间直接的联系，降低耦合，当一个模块出现错误，不会影响另一个模块的功能

 

// A模块的功能自己执行自己的代码

function Moduel2 () {

    this.fn = function () {
        console.log('A模块功能执行')
    }
}

let A = new Moduel2()

A.fn()



// 此时有模块B想使用模块A的某些功能或者属性，但是我们要降低耦合不能直接去使用模块A，此时再定义一个闭包


// 会返回一个新的模块A，并且在新的模块中定义了一个请求数据的方法
let Moduel = (function (mod) {

        mod.getData = function () {

            return { data: [{ name: '小美' }, { name: '小兰' }, { name: '兰馨' }], code: 200, message: '获取成功' }
        }
        
        return mod
})(Moduel2)




function Moduel3 (name) {

    // 初始化一下新模块A
    this.mod = Moduel
}


// 调用模块A的或者数据方法，将数据渲染到页面上，充分的降低了模块之间的耦合度

Moduel3.prototype.renderData = function () {
        let user = this.mod.getData()
        let li = null
        let fragment = document.createDocumentFragment()
        user.data.forEach(item => {
            li = document.createElement('li')
            li.innerHTML = item.name
            fragment.appendChild(li)
        })
        document.getElementById('list').appendChild(fragment)
}

let B = new Moduel3()

B.renderData()