进阶11-闭包 BOM

题目1: 下面的代码输出多少？修改代码让 fnArri 输出 i。使用 两种以上的方法

  var fnArr = [];
  for (var i = 0; i < 10; i ++) {
      fnArr[i] =  function(){
        return i;
      };
  }
  console.log( fnArr[3]() );  //   输出10

//////////方法一：用一个立即执行函数包裹起来，传递参数i
    var fnArr = [];
    for (var i = 0; i < 10; i++) {
        !function (i) {
            fnArr[i] = function () {
                return i;
            };
        }(i)
    }
    console.log(fnArr[3]());     //输出3    

////////////////方法二： 使用es6中的let声明替换var声明
    var fnArr = [];
    for (let i = 0; i < 10; i ++) {
        fnArr[i] =  function(){
            return i;
        };
    }
    console.log( fnArr[3]() );  //输出3

---

题目2： 封装一个汽车对象，可以通过如下方式获取汽车状态

    var Car = (function(){
        var speed = 0;
        function setSpeed(s){
            speed = s
        }
        function getSpeed(){
            return speed
        }
        function accelerate(){
            speed += 10
        }
        function decelerate(){
            speed -= 10
        }
        function getStatus(){
            if(speed > 0){
                return 'running'
            } else{
                return 'stop'
            }
        }
        return {
        setSpeed: setSpeed,
        getSpeed: getSpeed,
        accelerate:accelerate,
        decelerate: decelerate,
        getStatus: getStatus
        }
    })()
    console.log(
        Car.setSpeed(30),
        Car.getSpeed(), //30
        Car.accelerate(),
        Car.getSpeed(), //40;
        Car.decelerate(),
        Car.decelerate(),
        Car.getSpeed(), //20
        Car.getStatus(), // 'running';
        Car.decelerate(), 
        Car.decelerate(),
        Car.getStatus(),  //'stop';
        Car.speed  //error  
    )

---

题目3：下面这段代码输出结果是? 为什么?

    var a = 1;
    setTimeout(function(){
        a = 2;
        console.log(a);    //   2,打印的是它所在函数作用域的a的值
    }, 0);
    var a ;
    console.log(a);       //  1，打印的是全局作用域下啊a=1的值
    a = 3;
    console.log(a)   //   3，将a赋值为3之后打印出来

                        //输出结果： 1    3    2   ，因为setTimeout定时器中的函数最后执行

---

题目4：下面这段代码输出结果是? 为什么?

    var flag = true;
    setTimeout(function(){
        flag = false;
    },0)
    while(flag){}        //  当代码执行到这一行的时候，此时flag为true，进入死循环，所以无输出
    console.log(flag)

---

题目5： 下面这段代码输出？如何输出delayer: 0, delayer:1...（使用闭包来实现）

for(var i=0;i<5;i++){
    setTimeout(function(){
        console.log('delayer:' + i );
    }, 0);
    console.log(i); 
} 
     //输出：     0 1 2 3 4        delayer:5(5次)
////////////////////////////////
//以下代码输出  delayer：0    delayer：1   ...
for(var i = 0; i<5; i++){
  setTimeout((function (j){
    return function(){
      console.log('delayer:'+ j)   
    }  
  })(i),0)
  console.log(i)
}

---

题目6： 如何获取元素的真实宽高

Window.getComputedStyle() 方法给出应用活动样式表后的元素的所有CSS属性的值，并解析这些值可能包含的任何基本计算。

let style = window.getComputedStyle(element, [pseudoElt]);

<style>
    #box{
        background: #ccc;
        width: 112px;
        height: 223px;
    }
</style>

    <div id="box">content</div>

<script>
    var div = document.getElementById('box')
        
    window.getComputedStyle('div').width   //   '112px'
    window.getComputedStyle('div').height  //   '233px'

</script>

题目7： URL 如何编码解码？为什么要编码？

之所以URL需要编码是因为Url中有些字符会引起歧义。在因特网中URL只能使用 ASCII 字符集来进行发送。也就是说URL只能使用英文字母、阿拉伯数字和某些标点符号，不能使用其他文字和符号。这意味着 如果URL中有汉字，就必须编码后使用。还有Ukey=value这种传参方式式中， Value中包含 ?或者 = 怎么办呢，那么势必会造成接收Url的服务器解析错误，因此必须将引起歧义的&和=符号进行转义，也就是对其进行编码。

Javascript中提供了3对函数用来对Url编码以得到合法的Url，它们分别是escape / unescape, encodeURI / decodeURI和encodeURIComponent / decodeURIComponent。由于解码和编码的过程是可逆的，因此这里只解释编码的过程。
　　这三个编码的函数——escape，encodeURI，encodeURIComponent——都是用于将不安全不合法的Url字符转换为合法的Url字符表示，它们安全字符不同：
　　下面列出了这三个函数的安全字符（即函数不会对这些字符进行编码）
escape（69个）：/@+-._0-9a-zA-Z
encodeURI（82个）：!#$&'()+,/:;=?@-.~0-9a-zA-Z
encodeURIComponent（71个）：!'()*-.~0-9a-zA-Z

题目8： 补全如下函数，判断用户的浏览器类型

function isAndroid(){
  return /Android/.test(window.navigator.userAgent);
}
function isIphone(){
  return /iPhone/.test(window.navigator.userAgent);
}
function isIpad(){
  return /iPad/.test(window.navigator.userAgent);
}
function isIOS(){
  return /(iPad)|(iPhone)/.test(window.navigator.userAgent);
}