JOB：前端面试6

1.一次完整的HTTP事务是怎样的一个过程？

基本流程：

a. 域名解析

b. 发起TCP的3次握手

c. 建立TCP连接后发起http请求

d. 服务器端响应http请求，浏览器得到html代码

e. 浏览器解析html代码，并请求html代码中的资源

f. 浏览器对页面进行渲染呈现给用户

2.HTTP的状态码有哪些？

• 200 - 请求成功
• 301 - 资源（网页等）被永久转移到其它URL
• 404 - 请求的资源（网页等）不存在
• 500 - 内部服务器错误

HTTP状态码分类

分类	分类描述
1**	信息，服务器收到请求，需要请求者继续执行操作
2**	成功，操作被成功接收并处理
3**	重定向，需要进一步的操作以完成请求
4**	客户端错误，请求包含语法错误或无法完成请求
5**	服务器错误，服务器在处理请求的过程中发生了错误

3.手写数组快速排序（js实现） 大致分三步：
1)找基准（一般是以中间项为基准）
2)遍历数组，小于基准的放在left，大于基准的放在right
3)递归

function quickSort(arr){
            //如果数组<=1,则直接返回
            if(arr.length<=1){return arr;}
            var pivotIndex=Math.floor(arr.length/2);
            //找基准，并把基准从原数组删除
            var pivot=arr.splice(pivotIndex,1)[0];
            //定义左右数组
            var left=[];
            var right=[];

            //比基准小的放在left，比基准大的放在right
            for(var i=0;i<arr.length;i++){
                if(arr[i]<=pivot){
                    left.push(arr[i]);
                }
                else{
                    right.push(arr[i]);
                }
            }
            //递归
            return quickSort(left).concat([pivot],quickSort(right));
        }

4.JavaScript实现二分法查找

  var indexOfSorted = function f(arr,n){  
  //assume : arr has been sorted    
 var low = 0;   
var high = arr.length - 1;   
var mid = (low + high) / 2;   
  
 while(high - low > 1){  
 if(n == arr[low]){return low;}  
if (n == arr[high]){return high;}  
 if(n == arr[mid]){return mid;}   
if(n > arr[mid]){ low = mid; mid = (low + high) / 2; }   
if(n < arr[mid]){ high = mid; mid = (low + high) / 2; }   
 }    
return -1;    
 }    
var sortedArr = new Array(1,4,7,9,11,12,21,26,33);   
  
console.log(indexOfSorted(sortedArr,12));   

5.浏览器是如何渲染页面的？

页面渲染就是浏览器将 HTML 代码根据 CSS 定义的规则显示在浏览器窗口中的这个过程。

6.你所了解到的Web攻击技术

1).解析HTML文件，创建DOM树

自上而下，遇到任何样式（link、style）与脚本（script）都会阻塞（外部样式不阻塞后续外部脚本的加载）。

2).解析CSS

优先级：浏览器默认设置<用户设置<外部样式<内联样式<HTML中的style样式；

特定级：id数*100+类或伪类数*10+tag名称*1

3).将CSS与DOM合并，构建渲染树（renderingtree）

DOM树与HTML一一对应，渲染树会忽略诸如head、display:none的元素

4).布局和绘制，重绘（repaint）和重排（回流）

回流：若渲染树的一部分更新，且尺寸变化，就会发生重排；

重绘：部分节点需要更新，但不改变其他集合形状。如改变某个元素的颜色，就会发生重绘。