js__闭包__定时器__BOM

1.闭包是面试必问题,考察代码输出结果和使用场景 2.定时器JavaScript提供定时执行代码的功能 3.BOM 是指浏览器对象模型，BOM提供了独立于内容的、可以与浏览器窗口进行互动的对象结构

1: 下面的代码输出多少？修改代码让 fnArr[i]() 输出 i.使用 两种以上的方法

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

• 输出:10

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

//方法2
var fnArr = [];
for(var i=0;i<10;i++){
  fnArr[i] = (function(n){
    return function(){
        return n;
    }
  })(i)
}
console.log(fnArr[3]());
总结:
1.在函数内部再return一个函数,但不传参数,让最里面的函数调用外部的参数.
2.立即执行外部函数,返回值并赋值.

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

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

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

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

输出:
'1'
'3'
'2'
why:  setTimeout方法要在js代码全部执行完后再调用

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

var flag = true;
setTimeout(function(){
    flag = false;
},0)
while(flag){}//setTimeout中的函数会等待前面执行完毕，而这里是死循环
console.log(flag);//不执行

:陷入死循环

5： 下面这段代码输出？如何输出delayer: 0,

// delayer:1...（使用闭包来实现）

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


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

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

window.getComputedStyle(node).width
window.getComputedStyle(node).height
//低版本IE
window.currentStyle(node).width
window.currentStyle(node).width

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

编码：
encodeURI()
encodeURIComponent()
解码：
decodeURI()
decodeURIComponent()

-----
如果你需要编码整个URL，然后需要使用这个URL，那么用encodeURI.
当你需要编码URL中的参数的时候，那么encodeURIComponent是最好方法

• 为什么要编码?
• 编码是为了避免解析网址时产生歧义
  Http协议中参数的传输是"key=value"这种简直对形式的，如果要传多个参数就需要用“&”符号对键值对进行分割。如"?name1=value1&name2=value2"，这样在服务端在收到这种字符串的时候，会用“&”分割出每一个参数，然后再用“=”来分割出参数值。
  这样一个问题，如果我的参数值中就包含=或&这种特殊字符的时候该怎么办。
  比如说“name1=value1”,其中value1的值是“va&lu=e1”字符串，那么实际在传输过程中就会变成这样“name1=va&lu=e1”。我们的本意是就只有一个键值对，但是服务端会解析成两个键值对，这样就产生了歧义.
  解决的办法就是对参数进行URL编码

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

function isAndroid(){
    return /android/i.test(window.navigator.userAgent);
}
function isIphone(){
    return /iphone/i.test(window.navigator.userAgent);
}
function isIpad(){
    return /ipad/i.test(window.navigator.userAgent);
}
function isIOS(){
    return /ipad|iphone/i.test(window.navigator.userAgent);
}