美文网首页
闭包-定时器-BOM

闭包-定时器-BOM

作者: BAWScipes | 来源:发表于2017-11-01 15: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

     第一种方法,使用立即执行函数
      var fnArr = [];
      for(var i = 0; i < 10; i ++){
        !function(i){
          fnArr[i] = function(){
          return i;
        }
        }(i);
      }
      console.log (fnArr[3]());
     第二种方法 使用立即执行函数return出新的函数
      var fnArr = [];
      for(var i = 0; i < 10; i ++){
        fnArr[i] = function(i){
          return function(){
            return i;
          }
        }(i);
      }
      console.log (fnArr[3]());  
    

    注意:将var替换成es6中let 也可以实现

    2.封装一个汽车对象,可以通过如下方式获取汽车状态
      var Car = (function(){
        var speed = 0;
        function setSpeed(s){
          speed = s;
        }
        function getSpeed(){
          return speed;
        }
        function accelerate(){
          speed += 10;
        }
        function decelerate(){
          speed > 0 ? speed -= 10 : speed = 0
        }
        function getStatus(){
         speed > 0 ? return "running" : 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
    
    3.下面这段代码输出是什么?为什么
      var a = 1;
      setTimeout(function(){
        a=2;
        console.log(a);
      },0);
      var a;
      console.log(a);
      a=3;
      console.log(a);
    

    遇到setTimeout代码就最后执行,先执行下面代码,输出结果 1 3 2

    4.下面这段代码输出是什么?为什么
      var flag = true;
      setTimeout(function(){
        flag = false;
      },0);
      while(flag){}  //死循环
      console.log(flag);
    

    遇到setTimeout代码就最后执行,然后执行while循环,flag为true,就会一直循环,成为死循环,后面代码就不执行了,所以不会输出结果

    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次)

      使用闭包实现
      for(var i = 0; i < 5; i ++){
        setTimeout(!function(i){
          console.log('delayer:'+i);
        }(i),0);
        console.log(i);
      }
    
    6.如何获取元素的真实高度
      var div = document.querySeletor('div')
      window.getcomputedStyle(div).height  //高度
      window.getcomputedStyle(div).width   //宽度
      //低版本IE支持element.currentStyle
    
    7.URL如何编码解码?为什么要编码?

    encodeURI()是用来对URL编码的函数。它对整个URL编码,除了常见的符号以外,对具有特殊含义的符号;/?:@&=+$,#不进行编码,编码后,输出符号的utf-8形式,并且每个字节前面加上%。
    解码函数是decodeURI()

      encodeURI("\u00a9")   // %C2%A9
      decodeURI("%C2%A9")   //©
    

    注意:不对单引号'编码。
    encodeURIComponent()编码函数对URL组成部分进行个别编码,不用于对整个URL编码。对于;/?:@&=+$,#特殊含义符号都会编码。
    解码函数decodeURIComponent()

      encodeURIComponent("mail@example.com")  //main%40example.com
    

    之所以要编码,是因为有些字符会引起歧义,就会造成URL服务器的解析错误,所以必须将引起歧义的字符进行编码。

    8.补全如下函数,判断用户的浏览器类型
      function isAndroid(){
        return /android/i.test(navgator.userAgent);
      }
      function isIphone(){
        return /iphone/i.test(navgator.userAgent);
      }
      function isIpad(){
        return /ipad/i.test(navgator.userAgent);
      }
      function isIOS(){
        return /(iphone|ipad)/i.test(navgator.userAgent);
      }
    

    相关文章

      网友评论

          本文标题:闭包-定时器-BOM

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