美文网首页
绝妙的函数:模块模式

绝妙的函数:模块模式

作者: 喜欢唱歌的小狮子Shio | 来源:发表于2019-04-13 09:11 被阅读0次

Awesome Function: module pattern

在线演示

利用函数的闭包不仅可以非常轻松地实现模块模式,并且可以自己创建一个模块管理器,就这么简单!

// 以下模块的触发方法
moduleX.sayHello()

实现最简单的模块

// 实现最简单的模块
function simpleModule () {
    let sayHello = function sayHello (name) {
        return `Hi, ${name}`
    }
    return {
        sayHello: sayHello
    }
}
var module1 = simpleModule()

实现单例模式的模块

// 实现单例模式的模块
var module2 = (function singleModule () {
    let hello = 'Hi, Module 2'
    let sayHello = function sayHello () {
        return hello
    }
    return {
        sayHello: sayHello
    }
})()

实现保存对模块的内部引用

// 实现保存对模块的内部引用实现保存对模块的内部引用
var module3 = (function storeModule () {
    let store = {}
    let hello = 'Hi, Module 3'
    let sayHello = function sayHello () {
        return store.getHello()
    }
    let getHello = function getHello () {
        return hello
    }
    store = {
        sayHello: sayHello,
        getHello: getHello
    }
    return store
})()

实现一个模块管理器

// 实现一个模块管理器
var ModuleManager = (function moduleManager () {
    let modules = {}
    let register = function register (name, deps, impl) {
        for (let i = 0; i < deps.length; i++) {
            deps[i] = modules[deps[i]]
        }
        modules[name] = impl.apply(impl, deps)
    }
    let get = function get (name) {
        return modules[name]
    }
    return {
        register: register,
        get: get
    }
})()

// 注册不带依赖的模块
ModuleManager.register('module4', [], function () {
    function sayHello (name) {
        return `Hello, ${name || 'module4'}`
    }
    return {
        sayHello: sayHello
    }
})

// 注册带依赖的模块
ModuleManager.register('module5', ['module4'], function (module4) {
    function sayHello (name) {
        return `${module4.sayHello()}, this is Module 5`
    }
    return {
        sayHello: sayHello
    }
})

// 获取模块等待调用
module4 = ModuleManager.get('module4')
module5 = ModuleManager.get('module5')

相关文章

  • 绝妙的函数:模块模式

    Awesome Function: module pattern 在线演示 利用函数的闭包不仅可以非常轻松地实现模...

  • 前端设计模式

    模块模式 工厂模式 构造函数模式 混合模式 单例模式 发布订阅模式 模块模式 用于模块封装,用立即执行的函数嵌套一...

  • 高级6

    1、写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。 构造函数: 混合模式: 模块...

  • 高级任务6-前端设计模式

    写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例 构造函数模式 混合模式 模块模式 ...

  • 前端设计模式

    写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。 构造函数模式 混合模式 模块模式...

  • 前端设计模式

    写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。 构造函数模式 混合模式 模块模式...

  • 高级任务6---前端设计模式

    1、写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。 构造函数模式 混合模式 模块...

  • 前端设计模式

    1.写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。 工厂模式 模块模式 构造函数...

  • 前端设计模式

    1.写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。 构造函数模式 混合模式 模块...

  • 前端设计模式

    1.写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。 构造函数模式混合模式模块模式...

网友评论

      本文标题:绝妙的函数:模块模式

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