JAvascript見かけモード

クラスのインタフェースを簡略化することと、クラスとそれを使用する顧客コードとの結合を解消することの2つの役割を果たす見かけモード(Facade).jQueryチュートリアルでは、jqueryはブラウザ間の違いを解消し、1つの方法だけですべてのブラウザ環境で使用できることを常にユーザーに伝えています.背後にある原理は、著者がブラウザ間の違いを見かけモードで解消することです.
ブラウザのイベントリスニングでは、イベントの伝播とイベントの伝達を阻止する処理に違いがあります.したがって,各種jsライブラリでは見かけモードを用いて処理する.

var DED = window.DED || {}; //        
DED.util = {   //   (util,  )         
  stopPropagation: function(e) { 
    if (ev.stopPropagation) {//            v?
      // W3 interface
      e.stopPropagation();
    } 
    else {
      // IE's interface
      e.cancelBubble = true;
    }
  },
  preventDefault: function(e) {
    if (e.preventDefault) {
      // W3 interface
      e.preventDefault();
    } 
    else {
      // IE's interface
      e.returnValue = false;
    }
  },
  /*                     ，      ，  stopEvent      */
  stopEvent: function(e) {
    DED.util.stopPropagation(e);
    DED.util.preventDefault(e);
  }
};

HTMLスタイルの見かけモードの設定方法

var element = document.getElementById('content');
element.style.color = 'red';

element.style.fontSize = '16px';

var element1 = document.getElementById('foo');
element1.style.color = 'red';

var element2 = document.getElementById('bar');
element2.style.color = 'red';

var element3 = document.getElementById('baz');
element3.style.color = 'red';
//         


setStyle(['foo', 'bar', 'baz'], 'color', 'red'); //  setStyle   
//      ，  ，       
function setStyle(elements, prop, val) {
  for (var i = 0, len = elements.length-1; I < len; ++i) {
    document.getElementById(elements[i]).style[prop] = val;
  }
}

setStyle(['foo'], 'position', 'absolute'); //setStyle    
setStyle(['foo'], 'top', '50px');
setStyle(['foo'], 'left', '300px');

setCSS(['foo'], { //    setCSS  ，             
  position: 'absolute',
  top: '50px',
  left: '300px'
});

function setCSS(el, styles) {
  for ( var prop in styles ) { //         
    if (!styles.hasOwnProperty(prop)) continue;
    setStyle(el, prop, styles[prop]); //  setStyle        
  }
}

setCSS(['foo', 'bar', 'baz'], {
  color: 'white',
  background: 'black',
  fontSize: '16px',
  fontFamily: 'georgia, times, serif'
});

以上の2つの例は見慣れていて、jqueryのapiの中であちこちにこのようなパターンがあります.しかし、性能の損失もあります.余計な操作をしなければならない.jquery 2.x.xのバージョンはIEブラウザの互換性を直接放棄していないが、見かけのモードに対する考慮に基づいているのではないか.ソースコードを読んでいないので、推測します.