Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

文档中的一个例子运行结果与给的结果不同(不知道这里能不能提问题) #81

Closed
baskinwind opened this issue Dec 20, 2017 · 9 comments
Labels

Comments

@baskinwind
Copy link

RxJS version:
6.0.0-alpha.0

Code to reproduce:

var input = Rx.Observable.fromEvent(document.querySelector('input'), 'input');
input.pluck('target', 'value').distinct()
  .subscribe(value => console.log(value));

Expected behavior: (当输入 hello world 之后的输出)
"helo wrd"

Actual behavior:
"hello world"

Additional information:
感觉这个 .distinct() 并没有起到什么作用,还有接下来的那个例子也是如此

var input = Rx.Observable.fromEvent(document.querySelector('input'), 'input');
input.pluck('target', 'value').distinctUntilChanged()
  .subscribe(value => console.log(value));

得到的结构还是 hello world
chrome浏览器,我是在工作台直接测试的
是我使用的姿势不对吗?

@SangKa
Copy link
Member

SangKa commented Dec 20, 2017

不是你的问题,是文档本身有问题,而且具有一定误导性。
distinct 操作符本身是好的,先看这段代码:
Rx.Observable.from('hello world'.split('')).distinct().subscribe(value => console.log(value));
这样得到的结果是符合文档中给出的结果的。

换句话说,input 中每次只能保留hello world的1个字母,这样的比对才会排除掉重复值。
按文档中操作的话,其实每次值是这样的:
h
he
hel
hell
hello
hello
hello w
hello wo
hello wor
hello worl
hello world

产生原因是其实每次字符串都和前面的没有重复,你可以再试试第2再尝试输入hello world 就不会再打印值了,因为这些字母组合之前都已经出现过。

distinctUntilChanged 原理一样 只是只和上一次的值进行比对

@SangKa
Copy link
Member

SangKa commented Dec 20, 2017

另外可以参考下 distinct 操作符的文档: distinct

@SangKa
Copy link
Member

SangKa commented Dec 20, 2017

官方仓库也有人提出了同样的问题: #3069

@baskinwind
Copy link
Author

哦 是这样,可以认为是和历史记录比对吧,而不是本身的值。
谢谢~

@SangKa
Copy link
Member

SangKa commented Dec 20, 2017

应该是每次发出的值和历史发出的值对比 不同就可以通过

@SangKa SangKa closed this as completed Dec 20, 2017
@baskinwind
Copy link
Author

input.pluck('data').distinct()
  .subscribe(value => console.log(value)); 

这样的示例会不会好一点?

@SangKa
Copy link
Member

SangKa commented Dec 21, 2017

input.pluck('data') 是什么操作

@baskinwind
Copy link
Author

baskinwind commented Dec 21, 2017

event 对象下的 data 就是每次输入的值
当输入 h 时,这个 data 就是 h
接着输入 e 时,这个 data 就是 e
.pluck 看代码应该是取 event 对象下的值
所以我改了代码执行后,感觉这样表达的会明显一点

var input = Rx.Observable.fromEvent(document.querySelector('input'), 'input');
input.pluck('data').distinct()
  .subscribe(value => console.log(value)); 

@SangKa
Copy link
Member

SangKa commented Dec 21, 2017

Cool ! 这个属性之前没用过,那这样肯定是好用的,后续我会把这段代码更新到文档之中。感谢分享

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants