美文网首页
闭包_定时器_BOM

闭包_定时器_BOM

作者: marmot_ning | 来源:发表于2017-09-17 16:40 被阅读0次

    闭包_定时器_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[3]() );
    
    方法二
    var fnArr=[];
    for(var i = 0; i < 10; i ++){
      fnArr[i] = function(i){
        return function(){
          return i;
        };
      }(i);
    }
    
    console.log(fnArr[3]());
    
    封装一个汽车对象,可以通过如下方式获取汽车状态
    var Car = (function(){
       var speed = 0;
       function setSpeed(s){
         speed = s
       }
       function accelerate(){
          speed += 10;
       }
       function getSpeed(){
          return speed;
       }
       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
         }
    })()
    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 a = 1;
    setTimeout(function(){
        a = 2;
        console.log(a);
    }, 0);
    var a ;
    console.log(a);
    a = 3;
    console.log(a);
    //输出为1,3,2;遇到setTimeout函数时,会被挂起,等待同步任务执行玩之后,在执行消息队列中的任务,所以先输出1,3,之后输出2
    
    下面这段代码输出结果是? 为什么?
    var flag = true;
    setTimeout(function(){
        flag = false;
    },0)
    while(flag){}
    console.log(flag);
    //无输出,当遇到setTimeout时会被挂起,执行到while(flag){}时,因为flag = true,相当于while(1)再此处无限循环,后面为空语句所以无输出
    
    下面这段代码输出?如何输出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++){
    
        setTimeout(function(){
             console.log('delayer:' + i );
        }(i), 0);
        console.log(i);
    }
    
    如何获取元素的真实宽高
    • 一般可用window.getComputedStyle()获取元素计算后的(真实的)样式
    • /IE不支持getComputedStyle(),替代的是element.currentStyle();
      可以做以下兼容:
      function trueStyle(element,pseduoElement){
          return element.currentStyle ? element.currentStyle : 
          getComputedStyle(element,[pseduoElement])
      }
      var trueWidth = trueStyle(element).width
      var trueHeight = trueStyle(element).height
    
    URL 如何编码解码?为什么要编码?
    • 编码
    encodeURI()
    或者
    encodeURIComponent()
    

    区别:
    encodeURI方法不会对下列字符编码:

    1. ASCII字母
    2. 数字
    3. ~!@#$&*()=:/,;?+'

    encodeURIComponent方法不会对下列字符编码:

    1. ASCII字母
    2. 数字
    3. ~!*()'
      所以encodeURIComponent比encodeURI编码的范围更大
    • 解码
    decodeURI()
    或者
    decodeURIComponent()
    
    • 为什么要编码
      Http协议中参数的传输是"key=value"这种键值对形式的,如果要传多个参数就需要用“&”符号对键值对进行分割。如"?name1=value1&name2=value2",这样在服务端在收到这种字符串的时候,会用“&”分割出每一个参数,然后再用“=”来分割出参数值。如果你的value字符串中包含了=或者&,那么会造成接收Url的服务器解析错误,因此必须将引起歧义的&和=符号进行转义,也就是对其进行编码。
      又如,URL的编码格式采用的是ASCII码,而不是Unicode,这也就是说你不能在Url中包含任何非ASCII字符,例如中文。否则如果客户端浏览器和服务端浏览器支持的字符集不同的情况下,中文可能会造成问题。
      URL编码的原则就是使用安全的字符(没有特殊用途或者特殊意义的可打印字符)去表示那些不安全的字符
    补全如下函数,判断用户的浏览器类型
    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);
    }
    

    相关文章

      网友评论

          本文标题:闭包_定时器_BOM

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