安定化機能とスロットル機能

 
/ *
次のアプローチ:ローリング時間は、ブラウザはすべての瞬間に計算ロジックが決定されますので、消費性能の欠点は、より多くのであるかどうかの端部でスクロール、
実際のシナリオはそうする必要はありませんでは、実際のシーンはそうかもしれ:意思決定ロジックを計算する間隔で、スクロール中。
* /

// $(ウィンドウ).on( 'スクロール'、()=> {
//の端部にロジックをスクロールするかどうかを決定します
  //のpageHeight = $( '体')。高さ()させ、
  // scrollTopスプライト= $(ウィンドウ).scrollTop()、
  // winHeight = $(ウィンドウ).height()、
  // thresilod =のpageHeight - scrollTopスプライト - winHeight。
 // IF(thresilod> -100 && thresilod <= 20){
  // //この範囲では終わりをプリントアウトしていきます
  //にconsole.log( '末端')
  //}
//})



/ *機能スロットル(スロットル)言葉遣い
削減要求の数は、ストレス緩和剤サーバに到達しています
* /
関数スロットル(FN、間隔= 300){
  canRunが真=ましょう。
 復帰機能(){
  (!canRun)であればリターン。
  canRun = falseは、
  setTimeout(()=> {
  fn.apply(この、引数);
   canRun =はtrue。
  }、間隔)
 }
}
$(ウィンドウ).on( 'スクロール'、スロットル(()=> {
//の端部にロジックをスクロールするかどうかを決定します
  pageHeight = $( '体')。高さ()させ、
  scrollTopスプライト= $(ウィンドウ).scrollTop()、
  winHeight = $(ウィンドウ).height()、
  thresilod =のpageHeight - scrollTopスプライト - winHeight。
 IF(thresilod> -100 && thresilod <= 20){
  //この範囲で終わりをプリントアウトしていきます
  console.log( '末端');
 }
}))


/ *
今日では、多くのウェブサイトは、ユーザーエクスペリエンスを向上させるためには、入力ボックスには、ユーザー名が占有されているかどうかを判断するために、再度フォーカスを失っていないとき
しかし、ユーザー名が登録されているかどうかを決定する際に入力されたとき:
この入力は、それぞれの時間は、次のように複数の要求を引き起こし、それを再度要求します
* /
// $( 'input.user名')。上の( '入力'、()=> {
// $アヤックス({
 // URL: `https://でjust.com / check`、//これは、インターフェイスがかからないです
 //方法:「ポスト」
    //データ:{
 //ユーザ名:$(この).val()、
//}、
//成功(データ){
 // IF(data.isRegistered){
 // $(」。ヒント)。テキスト( 'ユーザ名がすでに登録されています!')
 //}他{
 // $(」。ヒント)。テキスト( 『おめでとう!このユーザー名が登録されていません!』)
   //}
//}、
//エラー(誤差){
//にconsole.log(エラー)
//}
//})
//})


/ *
機能画像安定化(デバウンス)

* /
関数デバウンス(FN、間隔= 300){
  タイムアウト= nullをしてみましょう。
 復帰機能(){
  clearTimeout(タイムアウト)//時間をクリア
  タイムアウト=たsetInterval(()=> {
    fn.apply(この、引数);
  }、間隔);
 }
}
$( 'input.user名')。( '入力' に、デバウンス(()=> {
    $アヤックス({
     URL: `https://でjust.com / check`、//これは、インターフェイスがかからないです
  方法:「ポスト」
  データ:{
   ユーザ名:.val $(この)()、
  }、
  成功(データ){
   IF(data.isRegistered){
   $(」。ヒント)。テキスト( 'ユーザ名が既に登録されています!')
  }他{
  $(」。ヒント)。テキスト( 『おめでとう!このユーザー名が登録されていません!』)
 }
}、
 エラー(エラー){
  console.log(エラー)
 }
})
})


 
要約:スロットルのコア機能及びぶれ機能を行くはのsetTimeoutてclearTimeout方法頻繁トリガーの使用を制限することです。
 

おすすめ

転載: www.cnblogs.com/Arthur123/p/10929969.html