JavaScript 响应式编程模式有点类似 WebForm 中的事件驱动模式（传相应的处理函数给委托，通过事件来触发来进行相关的处理），在 AngularJs 2.x 框架中，应用了 RxJS API，具体可以参考 AngularJs 官网。

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <script type="text/javascript">

        //定义功能类似C#中的委托的函数

        function showId(func, param) {

            if (func) {

                func(param);

            }

        }

        //显示标签的id（响应式编程方式，类似WebForm中的事件机制）

        function myClick(t) {

            showId(function (x) { alert(x); }, t);

        }

    </script>

</head>

<body>

    <div onclick="myClick(this.id)" id="myDiv">Click to show id</div>

</body>

</html>

js中把字符串转成函数

<html>

<head>

    <!--js中把字符串转成函数-->

    <meta charset="utf-8" />

</head>

<body>

    <script src="http://code.jquery.com/jquery-latest.js"></script>

    <script>

        $(document).ready(function(){

            //函数体字符串

            var jsStr = 'function checkLength(){ var v = $(this).val(); if(v.length > 3){ alert(v+": 长度大于 3"); } }';

            jsStr += ' function checkType(){ var re = /[\+]/; var v = $(this).val(); if(re.test(v)){ alert(v+": 包含： \+"); } }';

            //创建一个<script>标签

            var scriptTag = document.createElement("script");

            scriptTag.innerHTML = jsStr;

            //把新建的<script>标签添加到<head>标签中

            document.getElementsByTagName("head")[0].appendChild(scriptTag);

            //为input标签绑定事件

            $("#name").bind("blur", checkLength);

            $("#name").bind("blur", checkType);

        });

    </script>

    <input id="name" type="text" />

</body>

</html>

RxJS参考资源：

https://github.com/Reactive-Extensions/RxJS

http://www.introtorx.com/

http://bbs.csdn.net/topics/380250714

并发编程参考书籍：

《C#并发编程经典实例》 Stephen Cleary 著 相银初 译

JS 响应式编程的更多相关文章

  1. iOS响应式编程：ReactiveCocoa vs RxSwift 选谁好

    转载: iOS响应式编程:ReactiveCocoa vs RxSwift 选谁好 内容来自stack overflow的一个回答:ReactiveCocoa vs RxSwift – pros an ...

  2. 【响应式编程的思维艺术】 （1）Rxjs专题学习计划

    目录 一. 响应式编程 二. 学习路径规划 一. 响应式编程 响应式编程,也称为流式编程,对于非前端工程师来说,可能并不是一个陌生的名词,它是函数式编程在软件开发中应用的延伸,如果你对函数式编程还没有 ...

  3. Angular6 基础（数据绑定、生命周期、父子组件通讯、响应式编程）

    Angular相比于vue来说,更像一个完整的框架,本身就集成了很多模块,如路由,HTTP,服务等,而vue是需要另外引入比如(vuex,axios等).Angular引入了依赖注入.单元测试.类等后 ...

  4. 响应式编程（Reactive Programming）（Rx）介绍

    很明显你是有兴趣学习这种被称作响应式编程的新技术才来看这篇文章的. 学习响应式编程是很困难的一个过程,特别是在缺乏优秀资料的前提下.刚开始学习时,我试过去找一些教程,并找到了为数不多的实用教程,但是它 ...

  5. iOS开发--Swift RAC响应式编程初探

    时间不是很充足, 先少说点, RAC的好处是响应式编程, 不需要自己去设置代理委托, target, 而是主要以信息流(signal), block为主, 看到这里激动吧, 它可以帮你监听你的事件, ...

  6. Chocolat.js – 响应式的 jQuery Lightbox 插件

    Chocolat.js 使您能够显示一个或多个图像在同一页面上.给用户展示一组图片缩略图,可以显示全页或块.Chocolat.js 可以很好地处理所有主要的浏览器.它在下面这些浏览器测试通过:IE7+ ...

  7. IOS响应式编程框架ReactiveCocoa(RAC)使用示例

    ReactiveCocoa是响应式编程(FRP)在iOS中的一个实现框架,它的开源地址为:https://github.com/ReactiveCocoa/ReactiveCocoa# :在网上看了几 ...

  8. Dense.js - 响应式的视网膜（Rtina）图像支持

    Dense 是一款 jQuery 插件,它提供一个简单的方法为设备提供精密像素比的图像,为你的网站带来视网膜支持,清除模糊,图像更清晰.通过简单地包括 jQuery 插件的页面上,就能实现响应式的视网 ...

  9. ImageLightbox.js – 响应式的图片 Lightbox 插件

    ImageLightbox.js 是一款很简洁的用于显示图片灯箱效果(Lightbox)的插件,没有字幕,导航按钮或默认背景.如果默认功能不够用的话,你可以很容易地自定义 JavaScript 函数扩 ...

随机推荐

  1. 用Eclipse 统计代码行数小技巧

    今天公司SQA问我目前项目代码行数有多少,我当时就是想,以前好像写过类似的统计工具但是一时又找不到 公司网络又不能下载,所以想想eclipse是不是又类似功能,找了下没有,但突然一想有一个转弯方法:统 ...

  2. mac地址静态捆绑，防止arp欺骗

    arp -s 192.168.1.101 00-21-CC-D3-D5-FF 缺点,每次关机就还原,所以一般创建批处理文件,开机启动. ping 192.168.1.100 -l 65500 多台肉鸡 ...

  3. gnu make

    http://stackoverflow.com/questions/448910/makefile-variable-assignment 更加全面的介绍 http://blog.csdn.net/ ...

  4. Winform带dataGridview的Combox控件

    调用控件: public partial class Form1 : Form { public Form1() { InitializeComponent(); //---------------- ...

  5. [转] SpringJdbc的几种不同的用法

    转自:http://vsp.iteye.com/blog/1182887 Spring对jdbc做了良好的封装,本人在学习时做了以下几种方式的尝试 首页先来创建一个dao接口 package com. ...

  6. Servlet中文乱码处理

                                                       }                             }                   ...

  7. jsoup -- xml文档解析

    jsoup -- xml文档解析 修改 https://jsoup.org/cookbook/modifying-data/set-attributes https://jsoup.org/cookb ...

  8. 51nod算法马拉松 contest7

    A题 链接:http://www.51nod.com/contest/problem.html#!problemId=1417 推荐链接:http://blog.csdn.net/a837199685 ...

  9. iOS开发——Xcode快捷键

    1.共用的一些方法 Command + A: 全选Command + C: 复制Command + V: 粘贴Command + X: 剪切Command + Z: 撤销Shift + Command ...

  10. TcpView 查看端口的小工具(推荐)

    介绍: TCPView是一个Windows程序,将显示你的详细清单的所有TCP和UDP端点在您的系统,包括拥有进程名称,远程地址和状态的TCP连接. 打开下面的链接就可以下载了. https://te ...