JS基础-闭包_定时器_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 ++) {
     fnArr[i] =  function(){
          var n=i
              return function(){
                 return n;
              }
      }();
   }
  console.log( fnArr[3]() );  //输出3

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

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

   var Car = (function(){
     var speed = 0;
     function setSpeed(s){
       speed = s
     }
   ...
     return {
      setSpeed: setSpeed,
      ...
      }
   })()
  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

   //代码
   var Car = (function(){
    // speed：速度
   var speed = 0;
   function setSpeed(s){
      speed = s
   }
   function getSpeed(){
      return speed
   }
   // accelerate：加速
   function accelerate(){
      return speed += 10
   }
   // 减速
   function decelerate(){
    return speed -= 20
   }
   // 状态
   function getStatus(){
      if(speed === 0){
        return "stop"
      }else{
        return "running"
      }
   }
   return {
      setSpeed: setSpeed,
      getSpeed: getSpeed,
      decelerate: decelerate,
      getStatus: getStatus,
      accelerate: accelerate
   }
  })()
    
  // 输出
  Car.setSpeed(30);
  Car.getSpeed(); //30
  console.log(Car.getSpeed())

  Car.accelerate();
  Car.getSpeed(); //40;
  console.log(Car.getSpeed())

  Car.decelerate();
  // console.log(Car.decelerate());
  console.log(Car.getSpeed()); //20
  Car.getStatus(); // 'running';
  console.log(Car.getStatus())

  Car.decelerate(); 
  Car.getStatus();  //'stop';
  console.log(Car.getSpeed())
  console.log(Car.getStatus())
  // Car.speed;  //error

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
 // 原因： JavaScript 是单线程执行的，也就是无法同时执行多段代码，当某一段代码正在执行的
 // 时候，所有后续的任务都必须等待，形成一个队列，一旦当前任务执行完毕，再从队列中取出下
 // 一个任务。这也常被称为 “阻塞式执行”。
 // 如果代码中设定了一个 setTimeout，那么浏览器便会在合适的时间，将代码插入任务队列，
 // 如果这个时间设为 0，就代表立即插入队列，但不是立即执行，仍然要等待前面代码执行完毕。
 // 所以setTimeout 并不能保证执行的时间，是否及时执行取决于JavaScript线程是拥挤还是空闲
 // 因此，即使你给setTimeout设定的延时为0ms，它也不会立即触发

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

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

  // 答：
  // 什么也不会输出，while(flag){} 这个条件会无限循环，没有break或return。
  // 所以后面的都不会执行了

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

for(var i=0;i<5;i++){
    setTimeout(function(){
         console.log('delayer:' + i );
    }, 0);
    console.log(i);  // 输出 1 2 3 4 5    5delayer
}
  //  第一种
   for(var i=0;i<5;i++){
     setTimeout(function(){
       console.log('delayer:' + i );
       }, 0);
     console.log(i);
   }

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

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

   // step1 获取元素节点
   // var node=document.querySelector("#header")
   // step2 利用window.getComputedStyle()获取宽高
   // window.getComputedStyle(node).width
   // window.getComputedStyle(node).height

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

URL要编码的原因：URL 只能使用 ASCII 字符集来通过因特网进行发送。也就是说URL只能使用英文字母、阿拉伯数字和某些标点符号，不能使用其他文字和符号。

 （1）Url编码通常也被称为百分号编码（percent-encoding），是因为它的编码方式非常简
  单，使用%百分号加上两位的字符——0123456789ABCDEF——代表一个字节的十六进制形式
 （2）
     对于ASCII字符，字母a 在ASCII码中对应的字节是0x61，那么Url编码之后得到的就是
  %61，字母abc， url编码后得到的就是%61%62%63
 
     对于非ASCII字符，RFC文档建议使用utf-8对其进行编码得到相应的字节，然后对每个字
  节执行百分号编码。

     如"中文"使用UTF-8字符集得到的字节为0xE4 0xB8 0xAD 0xE6 0x96 0x87，经过Url编
  码之后得到"%E4%B8%AD%E6%96%87"。

    *使用Javascript先对URL编码，然后再向服务器提交，不要给浏览器插手的机会。这样就
 能保证客户端只用一种编码方法向服务器发出请求

URL 如何编码解码
escape、encodeURI和encodeURIComponent 编码
unescape、decodeURI和decodeURIComponent 解码

区别：escape是对字符串(string)进行编码，(而另外两种是对URL)，作用是让它们在所有电脑上可读。编码之后的效果是%XX或者%uXXXX这种形式。

注意：什么场合用什么方法，从实际例子来说　　　
（1）如果只是编码字符串，不和URL有半毛钱关系，那么用escape。
（2）如果你需要编码整个URL，然后需要使用这个URL，那么用encodeURI。
（3）当你需要编码URL中的参数的时候，那么encodeURIComponent是最好方法。

参考文章
简单明了区分escape、encodeURI和encodeURIComponent
js对url进行编码和解码（三种方式区别）

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

   function isAndroid(){
   }
   funcnction isIphone(){
   }
   function isIpad(){
   }
   function isIOS(){
   }

   //代码
   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 /ios|iphone/i.test(window.navigator.userAgent);
   }

本文题文内容来自于饥人谷，版权归饥人谷_海瀚和饥人谷所有，转载需说明来源

JS基础-闭包_定时器_BOM

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

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

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

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

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

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

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

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

推荐阅读更多精彩内容

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

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