8

我想开始学习Rx.js，我正在寻找一个很酷的例子来开始学习。如何使用 Rx.js 检测konami 代码？

我想检测一系列按键事件（上下左右 BA）并在发生这种情况时显示图像。

4

2 回答 2

7

这是我的版本：

<html>
<head>
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="rx.js"></script>
<script type="text/javascript" src="rx.jQuery.js"></script>
</head>
<body>
<p id="result"></p>
<script type="text/javascript">
    $(function() {
        var konami = $(document).toObservable("keyup").Select(function(e) {
            return e.keyCode
        }).SkipWhile(function(k) {
            return (k != 38)
        }).BufferWithCount(
            10
        ).Where(function(ks) {
            return ks.length == 10 &&
                ks[0] == 38 && ks[1] == 38 &&
                ks[2] == 40 && ks[3] == 40 &&
                ks[4] == 37 && ks[5] == 39 &&
                ks[6] == 37 && ks[7] == 39 &&
                ks[8] == 66 && ks[9] == 65
        })

        var konamisub = konami.Subscribe(function(e) {
            $("#result").text("KONAMI!")
            $("#result").fadeIn().fadeOut()
        })
    })
</script>
</body>
</html>

我将按键事件流转换为带有 的按键代码流Select，然后忽略按键，直到用户使用 按键向上（按键代码 38）SkipWhile，然后使用 采集 10 次按键BufferWithCount，然后使用 . 检查按键Where。

我尝试使用 BufferWithTime，但它往往会在击键过程中中断。

如果有人可以提出改进建议，我很想听听。

于 2010-12-08T15:31:26.027 回答
1

由于您正在学习，我不想破坏您的答案，但我会尝试将问题视为“如何将 Key up 事件转换为最近按下的最后 10 个字符的序列” ，并将该列表与“UUDDLRLRBA”的常量列表进行比较。（提示：Buffer、Where、Select、Take、Repeat 是你的朋友）

于 2010-12-08T05:25:30.507 回答