惰性思想（封装单例模式、函数重新覆盖）

惰性思想

惰性思想解决兼容问题

了解惰性思想

  • [x] 惰性思想之封装单例模式

    • 惰性思想 : 能够执行一次就搞定的，不会多执行多次（惰性思想封装单例模式）
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      var utils=(function(){
      	var flag="getComputedStyle" in window;//true-->标准浏览器；flase-->IE6-8
      	function getCSS(){
      	    //多次执行getCss()时，只需用flag存放的值来判断浏览器是标准的还是非标准的
      		if(flag){}else{};
      	}
      	return {getCSS:getCSS};//返回引用数据类型，utils作用域不会销毁
      })();//不销毁的私有作用域
      utils.getCSS();//多次执行，

  • [x] 惰性思想之函数重新覆盖

    • 把创建AJAX对象的四种方式存放在四个不同的小方法中，循环数据分别执行每一个小方法,如果遇到一个执行没有报错,说明当前这个小方法是兼容这个浏览器的，此时我们把createXHR重写,让其等于这个小方法,以后在执行createXHR都是在执行这个兼容的小方法了
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      22
      23
      24
      25
      26
      27
      28
      29
      30
      31
      32
      function createXHR() {
          var xhr = null,
              flag = false;
          var ary = [
              function() {  return new XMLHttpRequest;  },
              function() {  return new ActiveXObject("Microsoft.XMLHTTP"); },
              function() {  return new ActiveXObject("Msxml2.XMLHTTP"); },
              function() {  return new ActiveXObject("Msxml3.XMLHTTP"); }
          ];
          
          for (var i = 0, len = ary.length; i < len; i++) {
              var curFn = ary[i];
              try {
                  xhr = curFn(); //->如果执行不报错说明当前这个方法兼容,结束循环
                  createXHR = curFn; //重新的把createXHR进行重写为小方法
                  flag = true;
                  break;
              } catch (e) {
                  //本次循环出现错误：继续执行下一次循环
              }
          }
          if (!flag) { //->执行完成四个小方法后一个兼容的都没有
              throw new Error("your browser is not support ajax!");
          }
          return xhr;
      }
      //测试结果
      console.log(createXHR); //大函数
      var xhr = createXHR(); //大函数执行一次
      console.log(createXHR); //小函数