闭包&定时器&BOM

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

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

• 方法一

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

• 方法二

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

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

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

下面这段代码输出结果是? 为什么?

var a = 1;
setTimeout(function(){
    a = 2;
    console.log(a);
}, 0);
var a ;
console.log(a);
a = 3;
console.log(a);
//1,  3,  2

由于变量提升，所以一开始全局变量a为1，第六行未对a进行新的赋值，所以此时a依旧为1，第一次控制台打印为1；接着对a赋值为3，所以控制台打印3；最后执行计时器中的函数，将2在控制台中打印出来

下面这段代码输出结果是? 为什么

var flag = true;
setTimeout(function(){
    flag = false;
},0)
while(flag){}
console.log(flag);

什么也不会出现，反而会无限执行下去，因为一开始的将变量flag设置为true，while循环无限执行，计时器中的回调函数也永远不会执行

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

 for(var i=0;i<5;i++){
            var delayer = function(i){
                setTimeout(function(){
                    console.log('delayer:' + i );
                }, 0)
            }(i)
            console.log(i);
        }

       var show = delayer()

如何获取元素的真实宽高

 <div id='box'></div>
  <script>
    var div = document.getElementById("box")
    console.log(getComputedStyle(box).width)
  </script>

URL 如何编码解码？为什么要编码？

• 编码
  • encodeURI()
  • encodeURIComponent()
• 解码
  • decodeURI()
  • decodeURIComponent()
• 区别
  encodeURIComponent()的编码范围比encodeURI()大，其不会对下列字符编码
• 为什么要编码
  为了避免URL中的一些字符会引起歧义

image.png

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

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