简单实现依赖注入

序言

学过AngularJS 的童鞋都会惊叹于它的依赖注入的方便实用,依赖注入也成为了这个框架最大的特点之一吧。一直以来,对于依赖注入,都比较有兴趣,所以也试着去简单的实现一下依赖注入,没有想象的那么高大上,用最土的办法实现一下。哈哈~~

为什么要用依赖注入

传统情况下,一个函数的参数是由函数的调用决定的,也就是说,调用函数的时候,需要什么参数(实参),就得在定义函数的时候写入什么参数(形参)。有了依赖注入的话,情况就反转了,函数的参数完全由函数定义的时候去决定,函数里面用到啥参数,就在形式参数里面写上,并且顺序可以随便写。可能说了这么多,很多童鞋还是不明白,不明白就直接看代码吧。

    
    var $scope = {a:1,b:2,c:3,d:4,e:5};
    //   定义函数  函数里面需要啥就传啥  这里传入的是a,d,c
    var show = function (a,d,c) {
        // console.log(arguments.length);
        console.log(arguments);
    }

    //  把函数变成字符串
    var str = show.toString();
    //  把函数的参数取出来  
    str = str.split('{')[0].match(/\(.*\)/)[0].replace(/\s+/g,'');    // (a,b,c)
    str = str.substring(1,str.length - 1);   //  a,b,c

    //  得到函数的参数,并把参数转换成数组
    var arr = str.split(',');    // [a,b,c]

//    console.log(arr);

    //  根据参数找到$scope中相对应的值,并存入args数组中
    var args = [];
    for(var i = 0; i < arr.length; i++){
        args[i] = $scope[arr[i]];
    }

    //  把args中的值当做参数传到show函数中
    show.apply(null,args);

上面的函数打印的结果是:

如果函数参数为function show(e,d,c){...},其结果为:

哈哈。。是不是实现了一个简单的依赖注入呢!!

评论已关闭