SOURCE

let userTypesInSearchBox = Rx.Observable.fromEvent(
        $("#search-box"),
        'keyup'
    )
    .map((event) => event.currentTarget.value);

let index = 0;
userTypesInSearchBox
    .switchMap((searchTerm) => {
        const defer = (3 - index++) * 1000
        return Rx.Observable.fromPromise(
            $.get('http://api.thisjs.cn/search/' + searchTerm + '?defer=' + defer)
        ).catch(() => Rx.Observable.empty());
    })
    .map(res => res.infoData)
    .subscribe((response) => {
        if(response) {
           renderUser(
              response.login,
              response.html_url,
              response.avatar_url
          ); 
        }
    });

function renderUser(login, href, imgSrc) {
    let searchResult = $("#search-result");
    searchResult.show();
    searchResult.attr("href", href);
    $("#search-result__avatar").attr('src', imgSrc);
    $('#search-result__login').text(login);
}



// 使用distinctUntilChanged检测变化数据

<div class="container">

    <!-- Search controls -->
    <h1>Search Github Users</h1>
    <div class="form-group">
        <label for="search-box">
          Username:
        </label>
        <input
            id="search-box"
            type="text"
            class="form-control"
        />
    </div>
    <hr />
  
    <!-- Search result -->
    <a
        href=""
        target="_blank"
        id="search-result"
        style="display:none;"
    >
        <h2 id="search-result__login"></h2>
        <img
            src=""
            alt="avatar"
            width="150px"
            height="150px"
            id="search-result__avatar"
        />
    </a>
</div>