题目1: 下面的代码输出多少?修改代码让 fnArr[i] () 输出 i。使用 两种以上的方法
var fnArr = [];
for (var i = 0; i < 10; i ++) {
fnArr[i] = function(){
return i;
};
}
console.log( fnArr[3]() ); // 输出10
for(var i=0; i<10;i++) {
fnArr[i] = (function(a){
return a;
})(i);
}
for(var i=0; i<10;i++) {
(function(a){
fnArr[a] = function(){
return a;
}
})(i)
}
//let不可以重复声明变量 var不行
for(var i=0; i<10;i++) {
let val = i;
fnArr[i] = function(){
return val;
};
}
题目2: 封装一个汽车对象,可以通过如下方式获取汽车状态
var Car = (function(){
var speed = 0;
function setSpeed(s){
if(s>0){
speed = s
}else{ return }
}
function getSpeed(){
return speed;
}
function accelerate(){
speed = speed + 10;
return speed;
}
function decelerate(){
if(speed >= 10){
speed = speed - 10;
return speed;
}
}
function getStatus(){
if(speed !== 0){
return 'running'
}else{
return 'stop'
}
}
return {
setSpeed: setSpeed,
getSpeed: getSpeed,
accelerate: accelerate,
decelerate: decelerate,
getStatus: getStatus,
speed: 'error'
}
})()
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); 2
}, 0);
var a ;
console.log(a); 1
a = 3;
console.log(a); 3
打出结果是 1 3 2 先 1 然后 a被赋值为3 setTimeout 函数会在 JS其它代码执行完毕之后在执行
题目4:下面这段代码输出结果是? 为什么?
var flag = true;
setTimeout(function(){
flag = false;
},0)
while(flag){}
console.log(flag);
/* 不输出任何值。
运行到while(flag){}时,flag = true,
setTimeout需等到当前代码全部执行完毕后才可执行,
而当前代码里flag始终为true,因此执行不到console.log代码,
一直在while(flag){}循环,因此不输出任何值。*/***
(在目前60版本的Chrome上JS引擎会自动优化,跳出无限循环,所以输出为true)
题目5: 下面这段代码输出?如何输出delayer: 0, delayer:1...(使用闭包来实现)
for(var i=0;i<5;i++){
setTimeout(function(){
console.log('delayer:' + i );
}, 0);
console.log(i);
}
for(var i=0;i<5;i++){
!function (i) {
setTimeout(function(){
console.log('delayer:' + i );
}, 0);
}(i)
console.log(i);
}
题目6: 如何获取元素的真实宽高
window.getComputedStyle
style属性内的值非常机械,读取的就是元素的内联style属性的值,而不是我们计算出来的实际值,所以一般情况下没什么用处
getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值。返回的是一个CSS样式声明对象([object CSSStyleDeclaration])
(一看这个函数的名字我们就知道问题解决了)
var logo = document.querySelector('#result_logo')
aa = window.getComputedStyle(logo)
aa.height
aa.width
低版本IE要用element.currentStyle()
题目7: URL 如何编码解码?为什么要编码?
Url中只允许包含英文字母(a-zA-Z)、数字(0-9)、-_.~4个特殊字符以及所有保留字符。这意味着,如果URL中有汉字、希腊字符等其他字符,就必须编码后使用。
而不同的操作系统、不同的浏览器、不同的网页字符集,将导致完全不同的编码结果。当使用Javascript先对URL编码,然后再向服务器提交,不要给浏览器插手的机会。因为Javascript的输出总是一致的,所以就保证了服务器得到的数据是格式统一的。
JavaScript提供四个URL的编码/解码方法
decodeURI()
decodeURIComponent()
encodeURI()
encodeURIComponent()
区别
- encodeURI方法不会对下列字符编码
ASCII字母
数字
~!@#$&*()=:/,;?+' - encodeURIComponent方法不会对下列字符编码
ASCII字母
数字
~!*()'
所以encodeURIComponent比encodeURI编码的范围更大。
实际例子来说,encodeURIComponent会把 http://编码成 http%3A%2F%2F而encodeURI却不会。
当需要编码整个URL,然后需要使用这个URL,那么用encodeURI。
当你需要编码URL中的参数的时候,那么encodeURIComponent是最好方法。
题目8: 补全如下函数,判断用户的浏览器类型
function isAndroid(){
return /Android/.test(navigator.userAgent); }
funcnction isIphone(){
return /iphone/.test(navigator.userAgent); }
function isIpad(){
return /ipad/.test(navigator.userAgent); }
function isIOS(){ return /(iphone)|(ipad)/i.test(navigator.userAgent); }