1.下面的代码输出多少？修改代码让 fnArr[i]() 输出 i。使用 两种以上的方法
var fnArr = [];
for (var i = 0; i < 10; i ++) {
fnArr[i] = function(){
return i;
};
}
console.log( fnArr[3]() ); // 输出10，因为它们访问的都是全局的i
方法一：
for (var i = 0; i < 10; i ++) {
fnArr[i] = (function(i){
return function () {
return i
}
})(i);
}
方法2：
for (var i = 0; i < 10; i ++) {
(function(i){
fnArr[i] = function () {
return i
}
})(i);
}
2.封装一个汽车对象，可以通过如下方式获取汽车状态
// 闭包+立即执行函数实现变量封装
var Car = (function(){
var speed = 0
var status = 'stop'
function setSpeed(s){
if (s > 0) {
speed = s
status = 'running'
}
}
function getSpeed() {
return speed
}
function accelerate() {
if (status === 'running') {
speed += 10
}
}
function decelerate() {
if (status === 'running') {
speed -= 10
if (speed === 0) {
status = 'stop'
}
}
}
function getStatus() {
return status
}
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是异步执行，就算它的等待时间为0，也要等
到js代码执行完毕后才会开始执行他的回调函数,因此会先执行外面两个console.log
4.下面这段代码输出结果是? 为什么?
var flag = true;
setTimeout(function(){
flag = false;
},0)
while(flag){}
console.log(flag);
// 没有任何输出，因为setTimeout理由同上，而在执行到while时flag为true代码
陷入无限循环（在目前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);
}
// 0，1，2，3，4
// delayer: 5，delayer: 5，delayer: 5，delayer: 5，delayer: 5
// 解析：setTimeout中的所有i访问的都是全局的i，而setTimeout的回调函数会在
for循环执行完毕后执行所以此时i的值为5
修改：
for(var i=0;i<5;i++){
!function (i) {
setTimeout(function(){
console.log('delayer:' + i );
}, 0);
}(i)
console.log(i);
}
6.如何获取元素的真实宽高
-
JS 中 element 对象提供 offsetHeight, scrollHeight, clientHeight(每个有对应 width)，其中：
- offsetHeight 可以用来计算元素的物理空间，此空间包括内容，padding 和 border（还包括滚动条的宽度，但大多时候滚动条的宽度是计算到 padding 和内容中的）。
- scrollHeight 用来计算可滚动容器的大小，包括不可见的部分，比如一个 300300 的容器放入一个 600600 的图片，此时 scrollHeight 为 600，当然，scrollHeight 的值需要加上 padding 的值。
- clientHeight 表示可视区域，包括内容和 padding ，如果有滚动条，还需要减去滚动条的宽度。
-
通过 getComputedStyle（IE下currentStyle） 可以获取元素的真实尺寸. 示例：
let elem = document.getElementById("elem-container"); let theCSSprop = window.getComputedStyle(elem).getPropertyValue("想获取的属性值");
7.URL 如何编码解码？为什么要编码？
- encodeURI(): encodeURI() 是对统一资源标识符（URI）进行编码的方法。它使用1到4个转义序列来表示每个字符的UTF-8编码。
- encodeURIComponent(): encodeURIComponent()是对统一资源标识符（URI）的组成部分进行编码的方法。它使用一到四个转义序列来表示字符串中的每个字符的UTF-8编码。
- decodeURI(): decodeURI() 函数解码一个由encodeURI 先前创建的统一资源标识符（URI）或类似的例程。
- decodeURIComponent(): decodeURIComponent() 函数可对 encodeURIComponent() 函数编码的 URI 进行解码。
- 为什么要编码：
- 一般来说，URL只能使用英文字母、阿拉伯数字和某些标点符号，不能使用其他文字和符号。这是因为网络标准RFC 1738做了硬性规定："只有字母和数字[0-9a-zA-Z]、一些特殊符号"$-_.+!*'(),"[不包括双引号]、以及某些保留字，才可以不经过编码直接用于URL。"
- 这意味着，如果URL中有汉字，就必须编码后使用。
8. 补全如下函数，判断用户的浏览器类型
var u = navigator.userAgent;
function isAndroid(){
return u.indexOf('Android') > -1 || u.indexOf('Adr') > -1
}
funcnction isIphone(){
return u.indexOf('iPhone') > -1
}
function isIpad(){
return u.indexOf('iPad') > -1
}
function isIOS(){
return !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
}
function isIE() {
return u.indexOf('Trident') > -1
}