闭包-定时器-BOM

2017-11-01  本文已影响0人  BAWScipes
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);
  }
上一篇下一篇

猜你喜欢

热点阅读