JavaScript 模块机制

媒介

项目之前运用AngularJs,Angular前端框架。换事情以后新项目运用jQuery,又觉得回到原始时期。时期虽然倒回去了,然则头脑不能也随着倒回去。因而依据AngularJs编程作风封装一个简朴的模块机制来写jQuery代码。

模块机制

大多数模块依靠加载器/治理器,本质上都是将这类模块定义封装进一个有好的API。在此,只是简朴做了一下模块封装。

var Module = (function() {
    var modules = {};
    
    function controller(name, deps, impl) {
        for (var i = 0, len = deps.length; i < len; i++) {
            deps[i] = modules[deps[i]];
        }
        modules[name] = impl.apply(impl, deps);
    }

    function get(name) {
        return modules[name];
    }

    return {
        controller: controller,
        get: get
    }
})()

怎样运用

Module.controller('hello', [], function() {
    function hello(who) {
        return 'hello ' + who;
    }
    return {
        hello: hello
    }
})
Module.controller('upperCase', ['hello'], function() {
    var who = 'dwyane wade';

    function awesome() {
        console.log(hello.hello(who).toUpperCase());
    }

    return {
        awesome: awesome
    }
})

var hello = Module.get('hello');
var upperCase = Module.get('upperCase');
console.log(hello.hello('dwyane wade'));
upperCase.awesome();

跋文

ES6中引入了Class,Module。就不须要我们过量的相识模块化机制以及设想形式头脑就可以很好的治理代码,然则深切的去进修设想形式对团体框架把控照样有很大地协助的。

    原文作者:DwyaneWade
    原文地址: https://segmentfault.com/a/1190000016285483
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞