美文网首页
闭包计时器BOM

闭包计时器BOM

作者: ezrealor | 来源:发表于2017-08-30 14:33 被阅读0次

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

    var fnArr = [];
    for (var i = 0; i < 10; i ++) {
        fnArr[i] =  function(){
            return i;
        };
    }
    console.log( fnArr[3]() );  //  输出10
    
    for(var i=0; i<10;i++) {
       fnArr[i] = (function(a){
              return a;
        })(i);          
    } 
    
    for(var i=0; i<10;i++) {
         (function(a){
            fnArr[a] = function(){
               return a; 
            }
          })(i)          
    } 
    
     //let不可以重复声明变量  var不行
     for(var i=0; i<10;i++) {
          let val = i;
          fnArr[i] = function(){
          return val;
       };          
    } 
    

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

    var Car = (function(){
       var speed = 0;
       function setSpeed(s){
          if(s>0){
             speed = s
          }else{ return }
       }
       function getSpeed(){
        return speed;
       }
       function accelerate(){
         speed = speed + 10;
         return speed;
       }
       function decelerate(){
         if(speed >= 10){
           speed = speed - 10;
           return speed;
         }
       }
       function getStatus(){
         if(speed !== 0){
            return 'running'
         }else{
            return 'stop'
         }
       }
       return {
         setSpeed: setSpeed,
         getSpeed: getSpeed,
         accelerate: accelerate,
         decelerate: decelerate,
         getStatus: getStatus,
         speed: 'error'
       }
    })()
    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
    }, 0);
    var a ;
    console.log(a);   1
    a = 3;
    console.log(a);  3
    

    打出结果是 1 3 2 先 1 然后 a被赋值为3 setTimeout 函数会在 JS其它代码执行完毕之后在执行


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

    var flag = true;
    setTimeout(function(){
      flag = false;
    },0)
    while(flag){}
    console.log(flag); 
    /* 不输出任何值。
    运行到while(flag){}时,flag = true,
    setTimeout需等到当前代码全部执行完毕后才可执行, 
    而当前代码里flag始终为true,因此执行不到console.log代码,
    一直在while(flag){}循环,因此不输出任何值。*/***
    (在目前60版本的Chrome上JS引擎会自动优化,跳出无限循环,所以输出为true)
    

    题目5: 下面这段代码输出?如何输出delayer: 0, delayer:1...(使用闭包来实现)

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

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

    window.getComputedStyle
    style属性内的值非常机械,读取的就是元素的内联style属性的值,而不是我们计算出来的实际值,所以一般情况下没什么用处
    getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值。返回的是一个CSS样式声明对象([object CSSStyleDeclaration])
    (一看这个函数的名字我们就知道问题解决了)

    var logo = document.querySelector('#result_logo')
    aa = window.getComputedStyle(logo)
    aa.height
    aa.width
    低版本IE要用element.currentStyle()


    题目7: URL 如何编码解码?为什么要编码?

    Url中只允许包含英文字母(a-zA-Z)、数字(0-9)、-_.~4个特殊字符以及所有保留字符。这意味着,如果URL中有汉字、希腊字符等其他字符,就必须编码后使用。
    而不同的操作系统、不同的浏览器、不同的网页字符集,将导致完全不同的编码结果。当使用Javascript先对URL编码,然后再向服务器提交,不要给浏览器插手的机会。因为Javascript的输出总是一致的,所以就保证了服务器得到的数据是格式统一的。
    JavaScript提供四个URL的编码/解码方法
    decodeURI()
    decodeURIComponent()
    encodeURI()
    encodeURIComponent()
    区别

    • encodeURI方法不会对下列字符编码
      ASCII字母
      数字
      ~!@#$&*()=:/,;?+'
    • encodeURIComponent方法不会对下列字符编码
      ASCII字母
      数字
      ~!*()'
      所以encodeURIComponent比encodeURI编码的范围更大。
      实际例子来说,encodeURIComponent会把 http://编码成 http%3A%2F%2F而encodeURI却不会。
      当需要编码整个URL,然后需要使用这个URL,那么用encodeURI。
      当你需要编码URL中的参数的时候,那么encodeURIComponent是最好方法。

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

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

    相关文章

      网友评论

          本文标题:闭包计时器BOM

          本文链接:https://www.haomeiwen.com/subject/rimurxtx.html