javascriptの最も基本的な関数のまとめ

初期のJavaScriptを覚えています.何かを完成するには簡単な関数があまり回りません.ブラウザの提供者が機能に違いがあります.エッジ機能だけでなく、基本機能も同じです.addEventListenerとatachEventのように.時代は変わっていますが、いくつかの関数は各開発者が身につけなければなりません.いくつかの機能を完成し、性能を向上させます.
debounce
高エネルギー消費イベントに対して、debounce関数は良い解決策である.scroll、resize、key*イベントにdebounceを使わないと  関数としては、あなたがミスをしたのとほぼ同じです.下のdebounce関数はあなたのコードを高効率に保つことができます.

//       ，          ，        。         N    ，           。      ‘immediate'   ，              ，     。
function debounce(func, wait, immediate) {
  var timeout;
  return function() {
    var context = this, args = arguments;
    var later = function() {
      timeout = null;
      if (!immediate) func.apply(context, args);
    };
    var callNow = immediate && !timeout;
    clearTimeout(timeout);
    timeout = setTimeout(later, wait);
    if (callNow) func.apply(context, args);
  };
};
 
//   
var myEfficientFn = debounce(function() {
    
//        
}, 250);
window.addEventListener('resize', myEfficientFn);

debounce関数は、指定された時間内に複数回のコールバック関数を実行することができません.頻繁にトリガされるイベントに対しては、コールバック関数を割り当てることが重要です.
poll
上でdebounce関数について述べましたが、イベントが存在しない場合は、イベントを挿入して必要な状態を判断することができません.

function poll(fn, callback, errback, timeout, interval) {
  var endTime = Number(new Date()) + (timeout || 2000);
  interval = interval || 100;
 
  (function p() {
      
//       ，   ！
      if(fn()) {
        callback();
      }
      
//        ，     ，    
      else if (Number(new Date()) < endTime) {
        setTimeout(p, interval);
      }
      
//           ，   ！
      else {
        errback(new Error('timed out for ' + fn + ': ' + arguments));
      }
  })();
}
 
//   ：      
poll(
  function() {
    return document.getElementById('lightbox').offsetWidth > 0;
  },
  function() {
    
//   ，       
  },
  function() {
    
//   ，       
  }
);

Pollingはウェブで長く使われています.将来も使われます.
オンス
時々、与えられた機能を一回だけ発生させたいです.オンラインイベントと似ています.下記のコードはあなたの言った機能を提供します.

function once(fn, context) { 
  var result;
 
  return function() { 
    if(fn) {
      result = fn.apply(context || this, arguments);
      fn = null;
    }
 
    return result;
  };
}
 
//   
var canOnlyFireOnce = once(function() {
  console.log('Fired!');
});
 
canOnlyFireOnce(); 
// "Fired!"
canOnlyFireOnce(); 
// nada 
          
//         

与えられた関数が一回だけ呼び出されることを確保し、繰り返し初期化を防止します.
get Absolute Url
文字列変数から絶対URLを得るのは、あなたが思っているほど簡単ではありません.あるURLコンストラクタに対して、必要なパラメータを提供しないと問題が発生します.下記には優雅なテクニックがあります.文字列を送るだけで絶対的なURLが得られます.

var getAbsoluteUrl = (function() {
  var a;
 
  return function(url) {
    if(!a) a = document.createElement('a');
    a.href = url;
 
    return a.href;
  };
})();
 
//   
getAbsoluteUrl('/something'); 
// http://davidwalsh.name/something

a要素のhref処理とurl処理は無意味に見えるが、return文は信頼できる絶対URLを返している.
isNative
指定された関数が元のものかどうかを知りたいなら、または声明で上書きできますか?次のこの使いやすいコードは答えをくれます.

;(function() {
 
 
//          value     `[[Class]]` 
 var toString = Object.prototype.toString;
 
 
//             
 var fnToString = Function.prototype.toString;
 
 
//           （Safari > 4 ;         ）
 var reHostCtor = /^[object .+?Constructor]$/;
 
 
//               ，         。
 
//      'Object#toString'           。
 var reNative = RegExp('^' +
  
//   'Object#toString'         
  String(toString)
  
//               
  .replace(/[.*+?^${}()|[]/]/g, '$&')
  
//   '.*?'       'toString' ，         。
  
//   'for ...'         ，    Rhino    ，              ，       。
  .replace(/toString|(function).*?(?=()| for .+?(?=])/g, '$1.*?') + '$'
 );
 
 function isNative(value) {
  var type = typeof value;
  return type == 'function'
   
//   'Function#toString' （fnToString）    （value）    'toString'   ，        。
   ? reNative.test(fnToString.call(value))
   
//           ，      （   ）     （typed arrays）        DOM   ，                 。
   : (value && type == 'object' && reHostCtor.test(toString.call(value))) || false;
 }
 
 
//     
 module.exports = isNative;
}());
 
//   
isNative(alert); 
// true
isNative(myCustomFunction); 
// false

この関数は完璧ではないが、任務を達成することができます.
insertRule
私達はすべて選択器(Dcument.querySelectorAll)によって一つのNodeListを取得することができ、各要素にスタイルを設定することができますが、どのようなより効率的な方法がありますか?

var sheet = (function() {
    
//