JavaScript反射与依赖注入实例详解

2024-03-29 12:10:54

本文实例讲述了JavaScript反射与依赖注入。分享给大家供大家参考，具体如下：

对于javascript中的反射的理解，一直都是认为，利用数组对回调函数进行保存，之后在适当的时刻利用call或是apply 方法，对回调进行调用即可，一般如下操作：

首先定义两个方法：

var service = function() {
  return { name: 'Service' };
}
var router = function() {
  return { name: 'Router' };
}

我们有另一个函数需要用到这两个模块。

var doSomething = function(other) {
  var s = service();
  var r = router();
};

当然，我们希望能够能够使用依赖注入的方式去做，把该控制权交给计算机去做，而不是人为的去调用如下：

var doSomething = injector.resolve('router,,service', function(a, b, c) {
  expect(a().name).to.be('Router');
  expect(b).to.be('Other');
  expect(c().name).to.be('Service');
});
doSomething("Other");

那么我们可以造出一个反射方法如下：

var injector ={
    dependencies: {},
    register: function(key, value) {
      this.dependencies[key] = value;
    },
    resolve:function(deps, func, scope) {
      var args = [];
      for(var i=0; i<deps.length, d=deps[i]; i++) {
        if(this.dependencies[d]) {
          args.push(this.dependencies[d]);
        } else {
          throw new Error('Can\'t resolve ' + d);
        }
      }
      return function() {
        func.apply(scope || {}, args.concat(Array.prototype.slice.call(arguments, 0)));
      }
    }
};

如上代码,dependencies 用来保存回调函数集合，resolve用来调用。

这也算是一个比较成熟ok的想法。

但是依旧存在几点问题：

1 resolve 在进行调用时，deps参数列表顺序必须保持一致。

2 这一点有点牵强，但是也算。在调用时，需要再一次的输入形参，而不能直接调用。

那么为了解决以上问题，给出以下解决方案：

var injector ={
    dependencies: {},
    register: function(key, value) {
      this.dependencies[key] = value;
    },
    resolve: function() {
      var func, deps, scope, args = [], self = this;
      if(typeof arguments[0] === 'string') {
        func = arguments[1];
        deps = arguments[0].replace(/ /g, '').split(',');
        scope = arguments[2] || {};
      } else {
        func = arguments[0];
        deps = func.toString().match(/^function\s*[^]*\(\s*([^]*\(\s*([^]*)\)/m)[1].replace(/ /g, '').split(',');
        scope = arguments[1] || {};
      }
      return function() {
        var a = Array.prototype.slice.call(arguments, 0);
        for(var i=0; i<deps.length; i++) {
          var d = deps[i];
          args.push(self.dependencies[d] && d != '' ? self.dependencies[d] : a.shift());
        }
        func.apply(scope || {}, args);
      }
    }
};

利用正则对代码进行解析，解析出function 列表参数，再进行一一自动匹配传值，那么即可解决，顺序必须一直问题，当然这也是当然最热mvvm框架AngularJs采取的方式。

调用方式可以如下：

injector.resolve(['service,,router', function(service, router) {
}]);

你可能注意到在第一个参数后面有两个逗号——注意

这不是笔误。空值实际上代表“Other”参数（占位符）。这显示了我们是如何控制参数顺序的。

最后还有一种方式，直接注入scope ，也就是直接注入作用域，那么作用域被注入，也就不存在上述的传参顺序问题

因为不在需要传递参数，直接可以从作用域中访问到。

var injector = {
  dependencies: {},
  register: function(key, value) {
    this.dependencies[key] = value;
  },
  resolve: function(deps, func, scope) {
    var args = [];
    scope = scope || {};
    for(var i=0; i<deps.length, d=deps[i]; i++) {
      if(this.dependencies[d]) {
        scope[d] = this.dependencies[d];
      } else {
        throw new Error('Can\'t resolve ' + d);
      }
    }
    return function() {
      func.apply(scope || {}, Array.prototype.slice.call(arguments, 0));
    }
  }
}
var doSomething = injector.resolve(['service', 'router'], function(other) {
  expect(this.service().name).to.be('Service');
  expect(this.router().name).to.be('Router');
  expect(other).to.be('Other');
});
doSomething("Other");

javascript反射依赖注入新的理解，记录之，谨防忘记.

更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

ES6 如何改变JS内置行为的代理与反射

代理(Proxy)可以拦截并改变 JS 引擎的底层操作,如数据读取.属性定义.函数构造等一系列操作.ES6 通过对这些底层内置对象的代理陷阱和反射函数,让开发者能进一步接近 JS 引擎的能力. 一.代理与反射的基本概念什么是代理和反射呢? 代理是用来替代另一个对象(target),JS 通过new Proxy()创建一个目标对象的代理,该代理与该目标对象表面上可以被当作同一个对象来对待. 当目标对象上的进行一些特定的底层操作时,代理允许你拦截这些操作并且覆写它,而这原本只是 JS 引擎的内部能
java反射实现javabean转json实例代码

ObjectToJson.java 复制代码代码如下: package com.ObjectToJson; import java.lang.reflect.Field;import java.lang.reflect.InvocationTargetException;import java.lang.reflect.Method;import java.util.ArrayList;import java.util.Iterator; public class ObjectToJson {
vue.js input框之间赋值方法

如下所示: demo.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Index Page</title> </head> <body> <form action="" id="demo"> <input type="text" va
JavaScript 反射和属性赋值实例解析

这篇文章主要介绍了JavaScript 反射和属性赋值实例解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 Java和.NET都有着比较完善的反射机制,用来处理未知的对象并获取它们的属性和方法.JavaScript虽然没有完善的反射体系,但在编程的时候还是可以通过代码设计来实现类似反射的基本功能. function Antzone(){ this.webName="蚂蚁部落"; this.age=6; } Antzone.proto
AJAX JavaScript反射机制的介绍

什么是反射机制反射机制指的是程序在运行时能够获取自身的信息.例如一个对象能够在运行时知道自己有哪些方法和属性. 在JavaScript中利用for(-in-)语句实现反射在JavaScript中有一个很方便的语法来实现反射,即for(-in-)语句,其语法如下: for(var p in obj){ //语句 } 这里var p表示声明的一个变量,用以存储对象obj的属性(方法)名称,有了对象名和属性(方法)名,就可以使用方括号语法来调用一个对象的属性(方法): 复制代码代码如下: for
JS的反射问题

复制代码代码如下: <html> <head><title>JS反射</title> <script type="text/javascript"> /* * 反射 */ function forwindow() { for (var i in window) { /*循环 if (window[i] === "wsenmin") { /* 三个等号,先比较类型 return i; /* 类型如果不同的话
JavaScript对象反射用法实例

本文实例讲述了JavaScript对象反射用法.分享给大家供大家参考.具体如下: 这里讲述JavaScript对象反射用法,涉及反射DOM对象和自定义对象 <html> <head> <title>JavaScript反射工具</title> <style type="text/css"> #show{ width:400px;height:300px; border:red solid 1px; overflow:scrol
JS实现给json数组动态赋值的方法示例

本文实例讲述了JS实现给json数组动态赋值的方法.分享给大家供大家参考,具体如下: json 数组也是数组: //1. var jsonstr="[{'name':'a','value':1},{'name':'b','value':2}]"; var jsonarray = eval('('+jsonstr+')'); var arr = { "name" : $('#names').val(), "value" : $('#values')
JavaScript反射与依赖注入实例详解

本文实例讲述了JavaScript反射与依赖注入.分享给大家供大家参考,具体如下: 对于javascript中的反射的理解,一直都是认为,利用数组对回调函数进行保存,之后在适当的时刻利用call或是apply 方法,对回调进行调用即可,一般如下操作: 首先定义两个方法: var service = function() { return { name: 'Service' }; } var router = function() { return { name: 'Router' }; } 我们
php中的依赖注入实例详解

本文实例讲述了php中的依赖注入.分享给大家供大家参考,具体如下: 依赖注入是一种允许我们从硬编码的依赖中解耦出来,从而在运行时或者编译时能够修改的软件设计模式. 我到现在依然不大明白上面"依赖注入"的定义是什么-- 有兴趣可以参考下<PHP之道>上面对"依赖注入"的解释. http://laravel-china.github.io/php-the-right-way/#dependency_injection 简而言之就是可以让我们在类的方法中更加
Spring配置与依赖注入基础详解

目录 1.Spring配置 1.1.别名 1.2.Bean的配置 1.3.import 2.依赖注入(DI) 2.1.构造器注入 2.2.Set 注入(重点) 2.3.扩展的注入 2.4.Bean的作用域 1.Spring配置 1.1.别名别名 alias 设置别名 , 为bean设置别名 , 可以设置多个别名  <alias name="userT" alias="userNew"/&
Spring quartz Job依赖注入使用详解

Spring quartz Job依赖注入使用详解一.问题描述: 使用Spring整合quartz实现动态任务时,想在job定时任务中使用某个service时,直接通过加注解@Component.@Autowired是不能注入的,获取的对象为Null.如下面的代码: @Component @PersistJobDataAfterExecution @DisallowConcurrentExecution public class TicketSalePriceLessThanLowestPri
JavaScript中push(),join() 函数实例详解

定义和用法 push方法可向数组的末尾添加一个或多个元素,并返回一个新的长度. join方法用于把数组中所有元素添加到一个指定的字符串,元素是通过指定的分隔符进行分割的. 语法 arrayObject.push(newelement1,newelement2,....,newelementX) arrayObject.join(separator). 参数描述newelement1必需.要添加到数组的第一个元素.newelement2可选.要添加到数组的第二个元素.newelementX可选
Javascript的无new构建实例详解

看jquery源代码第一步的时候,对于jquery对象的创建就看的云里雾里,琢磨半天终于有点感觉了,在此记录下第一种方式: var A = function(){ return A.prototype.init(); } A.prototype = { init:function(){ this.age = 50; console.log(this); return this; }, age:100 } console.log(A() === new A()); 1.分析下结果为什么为true
JavaScript 中调用 Kotlin 方法实例详解

JavaScript 中调用 Kotlin 方法实例详解 Kotlin 编译器生成正常的 JavaScript 类,可以在 JavaScript 代码中自由地使用的函数和属性 .不过,你应该记住一些微妙的事情. 用独立的 JavaScript 隔离声明为了防止损坏全局对象,Kotlin 创建一个包含当前模块中所有 Kotlin 声明的对象 .所以如果你把模块命名为 myModule,那么所有的声明都可以通过 myModule 对象在 JavaScript 中可用.例如: fun foo() =
JavaScript“尽快失败”的原则实例详解

我第一次听说编码原则中有"尽快失败"这一条时,觉得很奇怪,为什么代码要失败?应该成功才对呀.但事实上,当代码在遇到错误的时候应该尽快的终止.为了检测各种状态,我们需要频繁的创建if语句与条件分支,而这些条件检测的结果不是成功就是失败(true&&false).之所以会有这么多的条件检测语句,是因为如果不在构建过程中植入这些监测点(checkpoint),那么浏览器内核会执行很多无用的代码,并占用许多宝贵的CPU性能和处理时间,拖慢网站加载速度. 根据那些判断结果为fal
golang使用 gomodule 在公共测试环境管理go的依赖的实例详解

背景:调试服务最好的方式就是直接上机实践.对在公司的员工来说,在同一套服务上协同开发比在单独的环境上开发,应该会更有感觉.有问题可以一起发现并解决,也能够一同开发需求. 但是,公司的测试机往往是没办法连外网的,而golang 的大部分工程都需要直接从github 上下载依赖,这就导致依赖文件需要先提前上传到开发机上.那么当开发机上需要运行多个golang 工程的时候,如何共享这些依赖,减少维护依赖库的工作量呢? 这也是需要大家协作完成的- 最终总结:项目采用 go module + vendo
JavaScript数组reduce()方法使用实例详解

目录前言 1.累加和累积乘法 2.获取一个数组的最大值和最小值 3.计算数组中元素出现的频率 4.多个数组的展平总结前言今天请让我详细介绍一下这个方法,希望对你有帮助. 这是 reduce 的基本用法: var arr = [1, 2, 3]; function reducer(parmar1, parmar2){ } arr.reduce(reducer) reduce是数组原型对象上的一个方法,可以帮助我们操作数组.它将另一个函数作为其参数,可以称为reducer. reducer

JavaScript反射与依赖注入实例详解

相关推荐

随机推荐