应用场景 一般在搜索框中 即在搜索框中输入关键字去服务器请求对应数据。
rxjs写法
<head>
<script src="https://cdn.bootcss.com/rxjs/6.0.0-alpha.3/Rx.min.js"></script>
</head>
<body>
防抖:<input type="text" placeholder="简拼/汉字/三字码" id="debounce"/><br/><br/>
节流:<input type="text" placeholder="简拼/汉字/三字码" id="throttle"/>
<script>
var $debounce = document.getElementById('debounce');
var $throttle = document.getElementById('throttle');
const debounce$ = Rx.Observable.fromEvent($debounce, 'input');
const throttle = Rx.Observable.fromEvent($throttle, 'input');
// 节流
debounce$
.debounceTime(1000)
.subscribe(function (e) {
var value = e.target.value;
console.log('防抖:'+value)
});
// 防抖
throttle
.throttleTime(1000)
.subscribe(function (e) {
var value = e.target.value;
console.log('节流:'+value)
});
</script>
</body>