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

闭包_定时器_BOM

作者: 任少鹏 | 来源:发表于2017-04-28 17:19 被阅读54次

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

     var fnArr = [];
        for (var i = 0; i < 10; i ++) {
            fnArr[i] =  function(){
                return i;
            };
        }
        console.log( fnArr[3]() );//输出10;因为调用函数时for循环已经结束
    
    方法一:
    
    var fnArr = [];
        for (var i = 0; i < 10; i ++) {
        (function(n){
            fnArr[i] =  function(){
                return n;
            };
            })(i)
        }
        console.log( fnArr[3]() );
    
    方法二:
    
    var fnArr = [];
        for (var i = 0; i < 10; i ++) {
            (function(){
                var n=i;
            fnArr[i] = function(){
                return n;
            };    
            })();  
        }
        console.log( fnArr[3]() );
    

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

    var Car = (function() {
        var speed = 0;
    
        function setSpeed(s) {
            speed = s
        }
    
        function getSpeed() {
            return speed;
        }
    
        function accelerate() {
            speed = speed + 10;
            return speed;
        }
    
        function decelerate() {
            speed = speed - 10;
            return speed;
        }
    
        function getStatus() {
            if (speed === 0) {
                return "stop";
            } else {
                return "running";
            }
        }
        return {
            setSpeed: setSpeed,
            getSpeed: getSpeed,
            decelerate: decelerate,
            getStatus: getStatus,
            accelerate: accelerate
        }
    })()
    Car.setSpeed(30);
    console.log(Car.getSpeed()); //30
    Car.accelerate();
    console.log(Car.getSpeed()); //40;
    Car.decelerate();
    Car.decelerate();
    console.log(Car.getSpeed()); //20
    console.log(Car.getStatus()); // 'running';
    Car.decelerate();
    Car.decelerate();
    console.log(Car.getStatus()); //'stop';
    //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
    setTimeout的运行机制是,将指定的代码移出本次执行,setTimeout(f,0)作用是让f在现有的任务一结束就立刻执行。
    以上代码等同于:
    var a = 1;
    var a ;
    console.log(a);//1
    a = 3;
    console.log(a);//3
    setTimeout(function(){
        a = 2;
        console.log(a);
    }, 0);//2
    

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

    var flag = true;
    setTimeout(function(){
        flag = false;
    },0)
    while(flag){}
    console.log(flag);
    //没有任何输出,setTimeout异步加载,flag=true,while循环的时候进入死循环,执行不到下面的console.log
    

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

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

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

    window.getComputedStyle("元素", "伪类").width;
    window.getComputedStyle("元素", "伪类").height;
    低版本IE下:
    element.currentStyle.width
    element.currentStyle.height
    兼容方式:
    element.currentStyle ?element.currentStyle : window.getComputedStyle(element, null)
    

    7:URL 如何编码解码?为什么要编码?
    编码:
    encodeURI()
    encodeURIComponent()

    解码:
    decodeURI()
    decodeURIComponent()

    编码是为了避免解析网址时产生歧义
    Http协议中参数的传输是"key=value"这种简直对形式的,如果要传多个参数就需要用“&”符号对键值对进行分割。如"?name1=value1&name2=value2",这样在服务端在收到这种字符串的时候,会用“&”分割出每一个参数,然后再用“=”来分割出参数值。

    针对“name1=value1&name2=value2”我们来说一下客户端到服务端的概念上解析过程:
    上述字符串在计算机中用ASCII吗表示为:
    6E616D6531 3D 76616C756531 26 6E616D6532 3D 76616C756532。
    6E616D6531:name1
    3D:=
    76616C756531:value1
    26:&
    6E616D6532:name2
    3D:=
    76616C756532:value2
    服务端在接收到该数据后就可以遍历该字节流,首先一个字节一个字节的吃,当吃到3D这字节后,服务端就知道前面吃得字节表示一个key,再想后吃,如果遇到26,说明从刚才吃的3D到26子节之间的是上一个key的value,以此类推就可以解析出客户端传过来的参数。

    这样一个问题,如果我的参数值中就包含=或&这种特殊字符的时候该怎么办。
    比如说“name1=value1”,其中value1的值是“va&lu=e1”字符串,那么实际在传输过程中就会变成这样“name1=va&lu=e1”。我们的本意是就只有一个键值对,但是服务端会解析成两个键值对,这样就产生了歧义。
    解决的办法就是对参数进行URL编码

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

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

    相关文章

      网友评论

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

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