题目1: 下面的代码输出多少?修改代码让 fnArri 输出 i。使用 两种以上的方法
- 方法1
让函数及时自我执行。
var fnArr = [];
for (var i = 0; i < 10; i ++) {
fnArr[i] = (function(){
return i;
})(i);
}
console.log(fnArr[5]);
- 方法2
函数中再创建一个匿名函数,加入参数j,每次循环时让每个j保存不同的i的值。
var fnArr = [];
for (var i = 0; i < 10; i ++) {
fnArr[i] = (function(j){
return function(){
return j;
};
})(i);
}
console.log(fnArr[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);
虽然计时器设置为0秒后立即执行函数,但是计时器内的代码依然会在该环境下所有代码执行完毕后再执行。
所以依次输出1,3,2。
题目4:下面这段代码输出结果是? 为什么?
var flag = true;
setTimeout(function(){
flag = false;
},0)
while(flag){}
console.log(flag);
不输出任何结果。
虽然计时器设置为0秒后立即执行函数,但是计时器内的代码依然会在该环境下所有代码执行完毕后再执行。
故while语句判断条件flag为true,循环正常执行且用不退出。故console.log语句不会被执行到。
题目5: 下面这段代码输出?如何输出delayer: 0, delayer:1...(使用闭包来实现)
for(var i=0;i<5;i++){
setTimeout(function(){
console.log('delayer:' + i );
}, 0);
console.log(i);
}
因为计时器内代码的滞后性,会先执行5次循环输出0,1,2,3,4
再执行计时器内代码,此时循环已经结束,i=5。再输出5次delayer: 5。
修改后代码:
for(var i=0;i<5;i++){
var f1 = (function(j){
return function(){
console.log('delayer:' + j );
};
})(i);
setTimeout(f1, 0);
}
题目6: 如何获取元素的真实宽高
getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值。返回的是一个CSS样式声明对象([object CSSStyleDeclaration])
var style = window.getComputedStyle("元素", "伪类");
IE兼容写法
element.currentStyle ?
element.currentStyle : window.getComputedStyle(element, null)
返回的对象中就保存有元素的真实宽高。
对象.width或对象.height即可访问到对应值。
题目7: URL 如何编码解码?为什么要编码?
JavaScript提供四个URL的编码/解码方法。
decodeURI()
decodeURIComponent()
encodeURI()
encodeURIComponent()
区别
encodeURI方法不会对下列字符编码
ASCII字母
数字
~!@#$&*()=:/,;?+'
encodeURIComponent方法不会对下列字符编码
ASCII字母
数字
~!*()'
所以encodeURIComponent比encodeURI编码的范围更大。
编码的作用就是将服务器不能识别的字符转换为可以识别的字符,从而避免乱码跟歧义。
题目8: 补全如下函数,判断用户的浏览器类型
function isAndroid(){
return /android/i.test(window.navigator.userAgent)
}
function isIphone(){
return /iphone/i.test(window.navigator.userAgent)
}
function isIpad(){
return /ipad/i.test(window.navigator.userAgent)
}
function isIOS(){
return /(ipad)|(iphone)/i.test(window.navigator.userAgent)
}