Javascript——依赖注入
本人才学疏浅,本文只为抛砖引玉,欢迎各路大牛前来斧正,不胜感激!
如今各个框架都在模块化,连前端的javascript也不例外。每个模块负责一定的功能,模块与模块之间又有相互依赖,那么问题来了:javascript的依赖注入如何实现?(javascript的依赖注入,各大框架都有相应的实现,这里只学习实现思路)
如下需求:
假设已经有定义好的服务模块Key-Value集合,func为添加的新服务,参数列表为服务依赖项。
var services = { abc : 123, def : 456, ghi : 789 }; // 假设已定义好某些Service
function Service(abc, ghi){
this.write = function(){
console.log(abc);
console.log(ghi);
}
}
function Activitor(func){
var obj;
// 实现
return obj;
}
解决思路:
通过某种机制(反射?),取出该func定义的参数列表,并一一赋值。然后再通过某种机制(Activitor?),实例化该func。
解决方案:
一、获取func的参数列表:
如何获取参数列表呢?我首先想到的是反射机制。那javascript里面有没有反射呢?应该有吧,我目前只知道使用eval(str)函数,但貌似并没有获取参数列表的相关实现。再看func.arguments定义,此属性只在调用func并传递参数时才有效,也不能满足需求。
那能不能通过处理func.toString()后的字符串获取参数列表呢?
上手试试吧:
function getFuncParams(func) {
var matches = func.toString().match(/^function\s*[^\(]*\(\s*([^\)]*)\)/m);
if (matches && matches.length > 1)
return matches[1].replace(/\s*/, '').split(',');
return [];
};
至此获得func参数列表数组。
二、根据参数列表寻找依赖:
得到了参数列表,即得到了依赖列表,将依赖项作为参数传入也就很简单了。
var params = getFuncParams(func);
for (var i in params) {
params[i] = services[params[i]];
}
三、传递依赖项参数并实例化:
我们知道,javascript里面有func.constructor有call(thisArg,[arg[,arg,[arg,[…]]]])和apply(thisArg,args…)两个函数,都可以实现实例化func操作。其中call函数第一个参数为this指针,剩余为参数列表,这个适合在已知func参数列表的情况下使用,不能满足我的需求。再看第二个apply函数,第一个参数也为this指针,第二个参数为参数数组,其在调用时会自动为func的参数列表一一赋值,正好满足我的需求。
代码大概如下:
function Activitor(func){
var obj = {};
func.apply(obj, params);
return obj;
}
至此我们能够创建该func的实例,并传递该func需要的参数。
四、打印测试一下吧:
完整代码:
var
// 假设已定义好某些Service
services = { abc: 123, def: 456, ghi: 789 }, // 获取func的参数列表(依赖列表)
getFuncParams = function (func) {
var matches = func.toString().match(/^function\s*[^\(]*\(\s*([^\)]*)\)/m);
if (matches && matches.length > 1)
return matches[1].replace(/\s+/, '').split(',');
return [];
}, // 根据参数列表(依赖列表)填充参数(依赖项)
setFuncParams = function (params) {
for (var i in params) {
params[i] = services[params[i]];
}
return params;
}; // 激活器
function Activitor(func) {
var obj = {};
func.apply(obj, setFuncParams(getFuncParams(func)));
return obj;
} // 定义新Service
function Service(abc, ghi) {
this.write = function () {
console.log(abc);
console.log(ghi);
}
} // 实例化Service并调用方法
var service = Activitor(Service);
service.write();
控制台成功打印!
Javascript——依赖注入的更多相关文章
- JavaScript依赖注入的实现思路
JavaScript依赖注入的实现思路 如今各个框架都在模块化,连前端的javascript也不例外.每个模块负责一定的功能,模块与模块之间又有相互依赖,那么问题来了:javascript的依赖注入如 ...
- 细数Javascript技术栈中的四种依赖注入
作为面向对象编程中实现控制反转(Inversion of Control,下文称IoC)最常见的技术手段之一,依赖注入(Dependency Injection,下文称DI)可谓在OOP编程中大行其道 ...
- JavaScript中依赖注入详细解析
计算机编程的世界其实就是一个将简单的部分不断抽象,并将这些抽象组织起来的过程.JavaScript也不例外,在我们使用JavaScript编写应用时,我们是不是都会使用到别人编写的代码,例如一些著名的 ...
- JavaScript里的依赖注入
JavaScript里的依赖注入 我喜欢引用这句话,“程序是对复杂性的管理”.计算机世界是一个巨大的抽象建筑群.我们简单的包装一些东西然后发布新工具,周而复始.现在思考下,你所使用的语言包括的一些内建 ...
- [译]javascript中的依赖注入
前言 在上文介绍过控制反转之后,本来打算写篇文章介绍下控制反转的常见模式-依赖注入.在翻看资料的时候,发现了一篇好文Dependency injection in JavaScript,就不自己折腾了 ...
- Javascript中的依赖注入
首先通过带参函数来定义一个Javascript函数,相当于C#中的一个类. var Person = function(firstname, lastname){ this.firstname = f ...
- typedi 强大的javascript以及typescript 依赖注入框架
typedi 是typestack团队提供的依赖注入解决方案,对于typescript 我们可以使用注解的开发方式,官方的文档也比较详细 javascript 使用 基于函数的服务注入 var Ser ...
- 模拟AngularJS之依赖注入
一.概述 AngularJS有一经典之处就是依赖注入,对于什么是依赖注入,熟悉spring的同学应该都非常了解了,但,对于前端而言,还是比较新颖的. 依赖注入,简而言之,就是解除硬编码,达到解偶的目的 ...
- AngularJs:Service、Factory、Provider依赖注入使用与区别
本教程使用AngularJS版本:1.5.3 AngularJs GitHub: https://github.com/angular/angular.js/ ...
随机推荐
- 内功心法 -- Java中的深拷贝和浅拷贝
写在前面的话:读书破万卷,编码如有神--------------------------------------------------------------------这篇博客主要来谈谈" ...
- 自己动手系列——实现一个简单的ArrayList
ArrayList是Java集合框架中一个经典的实现类.他比起常用的数组而言,明显的优点在于,可以随意的添加和删除元素而不需考虑数组的大小.处于练手的目的,实现一个简单的ArrayList,并且把实现 ...
- css3 3d变换和动画——回顾
1.transform-style 属性指定嵌套原始是怎样在三维空间中呈现. 语法:transform-style: flat | preserve-3d flat 表示所有子元素在2D平面呈现. p ...
- 使用批处理根据项目工程文件生成Nuget包并发布(支持.NET Core)
最近在使用之前自己编写的批处理给.NET Core项目打包时出问题了,发现之前的脚本根本不适用了,折腾了半天,总算解决了.因此在这里分享下经验,并且奉上整理好的脚本. Nuget包这里就不多介绍了,需 ...
- ROM及其他知识
ROM--Read Only Memory 中文意思是:只读存贮器 以前的游戏机用的都是卡带,里面是一块或几块集成电路芯片,游戏程序就是在生产厂家一次性写入这几块芯片,以后用户玩游戏的时候只能读出 ...
- Dockerfile注意事项
准则 尽量将Dockerfile放在空目录中,如果目录中必须有其他文件,则使用.dockerignore文件. 避免安装不必须的包. 每个容器应该只关注一个功能点. 最小化镜像的层数. 多行参数时应该 ...
- Zigbee折腾之旅:(一)CC2530最小系统
最近在倒腾Zigbee,准备参加物联网全国大赛,学校有给我们发Zigbee开发板,但是对于喜欢折腾的我来说,用开发板还是不过瘾,起码也得知道怎么去画一块板子.于是乎,在百度一番后就有了下面这篇文章. ...
- 【转载】HTTP Cookie学习笔记
什么是cookie? cookie是什么?是饼干,小甜点? No! No! No! 我今天要总结的cookie并不是你所想的小甜心,我这里要说的cookie是Web开发中的一个重要的"武器& ...
- JavaScript内置对象-Object
▓▓▓▓▓▓ 大致介绍 JavaScript的简单数据类型包括:Undefined.Null.Boolean.Number.String.JavaScript中这五种基本数据类型不是对象,其他所有值都 ...
- 一次MySQL死锁问题解决
一次MySQL死锁问题解决 一.环境 CentOS, MySQL 5.6.21-70, JPA 问题场景:系统有定时批量更新数据状态操作,每次更新上千条记录,表中总记录数约为500W左右. 二.错误日 ...