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

闭包_定时器_BOM

作者: Jeff12138 | 来源:发表于2017-08-17 23:24 被阅读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(j){
    fnArr[j] = function(){
      return j;
    };
  }(i);
 };
console.log(fnArr[3]()); //输出3。

方法二:

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

方法三:

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

方法四:

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

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

var Car = (function(){
  var speed = 0;
  function setSpeed(s){
    speed = s;
  };
  function getSpeed(){
    return speed;
  };
  function accelerate(){
    speed += 10;
  };
  function decelerate(){
    if(speed > 10){
      speed -= 10;
    }else{
      speed = 0;
    };
  };
  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

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中的函数会在其它语句执行完之后再执行。

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

var flag = true;
setTimeout(function(){
  flag = false;
},0);
while(flag){};
console.log(flag); //不输出。因为 flag = true ,所以 while(flag){}; 会让程序陷入一个没有任何输出的死循环。

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。

方法一:

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

方法二:

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

方法三:

var output = function(j){
  setTimeout(function(){
    console.log('delayer:' + j );
  }, 0);
};
for(var i=0;i<5;i++){
  output(i);
};

方法四:

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

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

我们可以通过getComputedStyle来获取元素的真实宽高。它是一个可以获取当前元素所有最终使用的CSS样式的属性值,返回的是一个CSS样式声明对象([object CSSStyleDeclaration])。
例如:

var div = document.querySelector('div');
console.log(window.getComputedStyle(div).width);
console.log(window.getComputedStyle(div).height);

另外,在较低版本的IE浏览器下,我们需要使用currentStyle来进行这个操作。


7、URL 如何编码解码?为什么要编码?

  • 编码:
    encodeURI(),对统一资源标识符(URI)进行编码的方法。它使用1到4个转义序列来表示每个字符的UTF-8编码。
    encodeURIComponent(),对统一资源标识符(URI)的组成部分进行编码的方法。它使用一到四个转义序列来表示字符串中的每个字符的UTF-8编码。

    其中,encodeURI方法不会对下列字符编码:
    1.ASCII字母
    2.数字
    3.~!@#$&*()=:/,;?+'

    而encodeURIComponent方法不会对下列字符编码:
    1.ASCII字母
    2.数字
    3.~!*()'

    所以encodeURIComponent比encodeURI编码的范围更大。
    前者被设计用来对一个URL中的值进行转义,会把这些功能字符也进行转义;而后者被设计来用于对完整URL进行URL Encode,于是URL中的功能字符,比如&, ?, /, =等等这些并不会被转义。

  • 解码:
    decodeURI(),可对 encodeURI() 函数编码的 URI 进行解码。
    decodeURIComponent(),可对 encodeURIComponent() 函数编码的 URI 进行解码。

  • 由于URL的编码格式采用的是ASCII码而不是Unicode,因此URL中不能包含任何非ASCII字符(例如中文),否则在客户端和服务端浏览器支持的字符集不同的情况下,就可能出现问题。这也就意味着,如果URL中有汉字或其它非规定字符,就必须编码后使用。
    另外,HTTP协议中通过URL传参是通过键值对形式进行的,格式上是以?、&和=为特征标识进行解析,如果键或者值的内容中包含这些符号,就会造成解析错误,所以要进行编码,用不会造成歧义的符号代替有歧义的符号。


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

function isAndroid(){
  return /Android/i.test(navigator.userAgent);
};
funcnction 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

    题目1: 下面的代码输出多少?修改代码让 fnArri 输出 i。使用 两种以上的方法方法1: 题目2: 封装一个...

  • 闭包_定时器_BOM

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

  • 闭包-定时器-BOM

    1- 算出代码的输出值;修改代码让 fnArri 输出 i 结果:输出 10,因为循环的时候 fnArr[i] =...

  • 闭包_定时器_BOM

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

  • 闭包&&定时器&&BOM

    1、下面的代码输出多少?修改代码让 fnArri 输出 i。使用 两种以上的方法 方法一:闭包 方法二:和方法一差...

  • 闭包_定时器_BOM

    题目1: 下面的代码输出多少?修改代码让 fnArri 输出 i。使用 两种以上的方法 题目2: 封装一个汽车对象...

  • 闭包、定时器、BOM

    下面的代码输出多少?修改代码让 fnArr[i]() 输出 i。使用 两种以上的方法 改造如下: 封装一个汽车对象...

  • 闭包_定时器_BOM

    1. 题目1: 下面的代码输出多少?修改代码让 fnArri 输出 i。使用两种以上的方法 2. 封装一个汽车对象...

  • 闭包、定时器、BOM

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

  • 闭包-定时器-BOM

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

网友评论

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

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