前端面试题

1.括号优先级高,先赋值

(window.foo || (window.foo = 'bar))
window.foo //bar

2.第一个人10岁,第二个人比第一个大2岁,以此递推,使用递归的方法,计算一下第六个人多大.

  function test(n){
        if(n == 1){
            return 10
        }
        return test(n-1)+2

    }
    test(6) //20
    //规律   test(n) = test(n-1) + 2

3.求阶乘

//循环实现
function mul1(num){
	for(var i=num-1;i>=1;i--){
	num *=i;
	}
	return num;
}

//递归实现     
function mul2(n){
  if(n==1){
     return 1;
   }
   return n*mul2(n-1)
}
//规律 mul2(n) = n*mul2(n-1)

4.斐波那契数列的实现

//循环实现
function test1(n){
	var first = 1;
	var second = 1;
	var third;
	for(var i=0;i<=n-1;i++){
        third = first + second;
        first = second ;
        second = third;
	}
	return third;
}

//递归实现
function test2(n){
        if(n==1 || n==2){
            return 1
        };
        return test2(n-2)+test2(n-1);
  }
  //规律 test2(n) =  test2(n-2)+test2(n-1)

5.从输入 URL 到页面加载完成，发生了什么？

1.DNS 解析
2.TCP 连接
3.HTTP 请求抛出
4.服务端处理请求，HTTP 响应返回
5.浏览器拿到响应数据，解析响应内容，把解析的结果展示给用户

6.优化插入节点
DocumentFragment 接口表示一个没有父级文件的最小文档对象。它被当做一个轻量版的 Document 使用，用于存储已排好版的或尚未打理好格式的XML片段。最大的区别是因为DocumentFragment不是真实DOM树的一部分，它的变化不会引起DOM树的重新渲染的操作(reflow) ，且不会导致性能等问题。

let container = document.getElementById('container')
// 创建一个DOM Fragment对象作为容器
let content = document.createDocumentFragment()
for(let count=0;count<10000;count++){
  // span此时可以通过DOM API去创建
  let oSpan = document.createElement("span")
  oSpan.innerHTML = '我是一个小测试'
  // 像操作真实DOM一样操作DOM Fragment对象
  content.appendChild(oSpan)
}
// 内容处理好了,最后再触发真实DOM的更改
container.appendChild(content)

持续更新…