闭包、立即执行函数闭包、BOM

2017-10-07  本文已影响0人  曾祥辉

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

    var fnArr = [];
    for (var i = 0; i < 10; i ++) {
        fnArr[i] =  function(){
            return i;
        };
    }
    console.log( fnArr[3]() );  //

改写1

var fnArr = [];
for (var i = 0; i < 10; i++) {
  (function (i) {
    fnArr[i] = function () {
      return i;
    }
  })(i)
}
console.log(fnArr[3]());  //3

改写2

var fnArr = [];
for (var i = 0; i < 10; i++) {
  function fn(i) {
    fnArr[i] = function () {
      return i;
    }
  }
  fn(i)
}
console.log(fnArr[3]());  //3

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

var Car = (function () {
  var speed = 0;
  function setSpeed(s) {
    if (s > 0) {
      speed = s;
    } else {
      return "error";
    }
  }
  function getSpeed() {
    return speed;
  }
  function accelerate() {
    speed += 10;
  }
  function decelerate() {
    if (speed > 0) {
      speed -= 10;
    } else {
      return "error";
    }
  }
  function getStatus() {
    if (speed === 0) {
      return 'stop';
    } else {
      return 'running'
    }
  }
  return {
    setSpeed: setSpeed,
    getSpeed: getSpeed,
    accelerate: accelerate,
    decelerate: decelerate,
    getStatus: getStatus,
  };
})()

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

var a = 1;
setTimeout(function(){
    a = 2;
    console.log(a);
}, 0);
var a ;
console.log(a);
a = 3;
console.log(a);

输出

1//var a = 1;执行后跳过setTimeout,执行var a ;console.log(a);
3//执行a = 3;console.log(a);
2//js执行完全部代码后处理定时器,
    function(){
      a = 2;
      console.log(a);
    }, 0),0秒后输出console.log(a)(a=2)

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

var flag = true;
setTimeout(function(){
    flag = false;
},0)
while(flag){}
console.log(flag);

无法输出,因为setTimeout计时器会在执行完全部代码后处理,while(flag){}中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"
"delayer:5"
"delayer:5"
"delayer:5"
"delayer:5"
//输出delayer: 0, delayer:1...
for(var i=0;i<5;i++){
    (function(i){
      setTimeout(function(){
         console.log('delayer:' + i );
    }, 0)})(i);
    console.log(i);
}

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

var $ = document.querySelector("view");
var h = $.offsetHeight;  //高度
var w = $.offsetWidth;  //宽度

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

var str = '你好'
console.log(encodeURIComponent(str))//%E4%BD%A0%E5%A5%BD
var str = '%E4%BD%A0%E5%A5%BD'
console.log(decodeURIComponent(str))//你好

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

function isAndroid(){
/android/gi.test(window.navigator.userAgent)
}
funcnction isIphone(){
/iphone/gi.test(window.navigator.userAgent)
}
function isIpad(){
/ipad/gi.test(window.navigator.userAgent)
}
function isIOS(){
/(iphone)|(ipad)/gi.test(window.navigator.userAgent)
}
上一篇下一篇

猜你喜欢

热点阅读