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. php的表单安全处理

    规则 1:绝不要信任外部数据或输入 关于 Web 应用程序安全性,必须认识到的第一件事是不应该信任外部数据.外部数据(outside data) 包括不是由程序员在 PHP 代码中直接输入的任何数据. ...

  2. 转 shell脚本学习指南

    shell脚本学习指南 以下八点不敢说就能成为你shell脚本学习指南de全部,至少可以让你编写出可靠的shell脚本. 1. 指定bashshell 脚本的第一行,#!之后应该是什么?如果拿这个问题 ...

  3. 黄聪:基于Asp.net的CMS系统We7架设实验(环境WIN7,SQL2005,.NET3.5)(初学者参考贴)

    http://www.cnblogs.com/huangcong/archive/2010/03/30/1700348.html

  4. Qt5:窗口居中显示

    QDesktopWidget* desktop = QApplication::desktop(); // =qApp->desktop();也可以move((desktop->width ...

  5. Codeforces Round #364 (Div. 2) E. Connecting Universities (DFS)

    E. Connecting Universities time limit per test 3 seconds memory limit per test 256 megabytes input s ...

  6. (困难) CF 484E Sign on Fence,整体二分+线段树

    Bizon the Champion has recently finished painting his wood fence. The fence consists of a sequence o ...

  7. fuel 6.1自动推送3控高可用centos 6.5 juno环境排错(一)

    查看fuel日志: # less /var/log/docker-logs/remote/node-1.domain.tld/puppet-apply.log 2015-12-25T17:26:22. ...

  8. PAT 天梯赛 L2-1 紧急救援

    Dijkstra算法扩展 题目链接 解题代码如下: #include<cstdio> #include<iostream> #include<algorithm> ...

  9. 移动WEB模拟原声APP滑动删除

    移动WEB模拟原声APP滑动删除 效果 代码 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  10. iOS播放gif图方式

    转发:http://www.cnblogs.com/jerehedu/ 图片分为静态和动态两种,图片的格式有很多种,在开发中比较常见的是.png和.jpg的静态图片,但有的时候在App中需要播放动态图 ...