本文发表在 rolia.net 枫下论坛此文非常简单，就是为了帮助初学者理解一个基本概念，帮助初学者从零建立一个测试环境，
一旦理解了这个概念，后面就是自己查网站资料学习一些如何用api的活，但是如果基本概念理解不好，很难用好
RxJs 全称 ReactiveJs，是为了把异步编程简单化而写的一个框架：
下面我们开始建立一个能运行hello world的测试环境:
2016年以后的web前端开发，建议用typescript，方便、高效，语法检查，面向对象，函数式编程，好处说不完；
打开vs 2015 update 3，建立一个HTML applicatipon with TypeScript：
1） 删掉app.ts里的所有内容，
2） 导入RxJs => 右键点击project => Mangage Nuget Packages... => 选择Browse, 输入RxJs-All => Click Install
3) vs2015会把所有的RxJs框架代码全都下载到一个Scripts folder中，一般用不到所有这些，而且这会导致编译冲突错误
4） 仅仅保留 rx.all.d.ts 和 rs.all.js 两个文件，其他的全部exculde from project
5） 试着编译一下，确保没有错误
6） 需要在我们的typescript代码中reference RxJs的typescript类, 在app.ts中输入以下代码：
/// <reference path="scripts/rx.all.d.ts" />
7） 为了让浏览器的javascript引擎理解的RxJs代码，在index.html中的<head></head>输入
<script src="Scripts/rx.all.js"></script>
因为typescript最终要被编译成js代码运行，这一步是必须的
下面开始在app.ts中写一个RxJs based 程序，输入以下代码：
let marks: number[] = [1, 2, 3, 4, 5, 6]; // 建立一个number array
let markStream = Rx.Observable.create(observer => {
for (let n of marks)
observer.onNext(n);
observer.onCompleted();
});
markStream.subscribe(s => alert(s));
这段代码要表达的意思很简单： 设定一个number数组，把这段数组变成一个Observable的对象，一旦这个Observable的对象有人试图订阅（subscribe），就把这个数组发送给订阅者
如果按F5运行，可以看到1，2，3，4，5，6依次被alert pop up出来
我写的这些就是翻译msdn的东西，回想起我刚学那会，读完这段话和没读没啥区别，完全懵逼，那么我把这段代码分解一下，或许初学者能马上理解
我用c#伪代码示范一下Rx.Observable.create， subscribe运行的时候是个什么样子：
class Observable
{
private Action<IObserver> defaultObserver;
public Observable(Action<IObserver> observer)
{
this.defaultObserver = observer;
}
public void subscribe(IObserver observer)
{
if(this.defaultObserver != null)
this.defaultObserver(observer);
}
public void subscribe(Action<object> onNext)
{
DefaultObserver = new DefaultObserver(onNext);
if(this.defaultObserver != null)
this.defaultObserver(DefaultObserver);
}
public static void create(Action<IObserver> observer)
{
return new Observable(observer)
}
}
这段伪代码是我根据Rx的运行结果推断出来的，目的是更好的让初学者理解Rx的基本运行原理，实际上msdn啰嗦一大堆，看的人晕头转向，
其实只要大概列一些后台运行伪代码，很多程序员就能很快明白是怎么回事
闲来无事，纯粹抛砖引玉更多精彩文章及讨论，请光临枫下论坛 rolia.net
一旦理解了这个概念，后面就是自己查网站资料学习一些如何用api的活，但是如果基本概念理解不好，很难用好
RxJs 全称 ReactiveJs，是为了把异步编程简单化而写的一个框架：
下面我们开始建立一个能运行hello world的测试环境:
2016年以后的web前端开发，建议用typescript，方便、高效，语法检查，面向对象，函数式编程，好处说不完；
打开vs 2015 update 3，建立一个HTML applicatipon with TypeScript：
1） 删掉app.ts里的所有内容，
2） 导入RxJs => 右键点击project => Mangage Nuget Packages... => 选择Browse, 输入RxJs-All => Click Install
3) vs2015会把所有的RxJs框架代码全都下载到一个Scripts folder中，一般用不到所有这些，而且这会导致编译冲突错误
4） 仅仅保留 rx.all.d.ts 和 rs.all.js 两个文件，其他的全部exculde from project
5） 试着编译一下，确保没有错误
6） 需要在我们的typescript代码中reference RxJs的typescript类, 在app.ts中输入以下代码：
/// <reference path="scripts/rx.all.d.ts" />
7） 为了让浏览器的javascript引擎理解的RxJs代码，在index.html中的<head></head>输入
<script src="Scripts/rx.all.js"></script>
因为typescript最终要被编译成js代码运行，这一步是必须的
下面开始在app.ts中写一个RxJs based 程序，输入以下代码：
let marks: number[] = [1, 2, 3, 4, 5, 6]; // 建立一个number array
let markStream = Rx.Observable.create(observer => {
for (let n of marks)
observer.onNext(n);
observer.onCompleted();
});
markStream.subscribe(s => alert(s));
这段代码要表达的意思很简单： 设定一个number数组，把这段数组变成一个Observable的对象，一旦这个Observable的对象有人试图订阅（subscribe），就把这个数组发送给订阅者
如果按F5运行，可以看到1，2，3，4，5，6依次被alert pop up出来
我写的这些就是翻译msdn的东西，回想起我刚学那会，读完这段话和没读没啥区别，完全懵逼，那么我把这段代码分解一下，或许初学者能马上理解
我用c#伪代码示范一下Rx.Observable.create， subscribe运行的时候是个什么样子：
class Observable
{
private Action<IObserver> defaultObserver;
public Observable(Action<IObserver> observer)
{
this.defaultObserver = observer;
}
public void subscribe(IObserver observer)
{
if(this.defaultObserver != null)
this.defaultObserver(observer);
}
public void subscribe(Action<object> onNext)
{
DefaultObserver = new DefaultObserver(onNext);
if(this.defaultObserver != null)
this.defaultObserver(DefaultObserver);
}
public static void create(Action<IObserver> observer)
{
return new Observable(observer)
}
}
这段伪代码是我根据Rx的运行结果推断出来的，目的是更好的让初学者理解Rx的基本运行原理，实际上msdn啰嗦一大堆，看的人晕头转向，
其实只要大概列一些后台运行伪代码，很多程序员就能很快明白是怎么回事
闲来无事，纯粹抛砖引玉更多精彩文章及讨论，请光临枫下论坛 rolia.net