前端面经总结-每日一篇

每日掌握一篇面经

• 2020-5-20 头条

1. TCP和UDP有什么区别
2. http有哪几种版本，有什么区别
3. 进程和线程
4. 进程和线程怎么通信
5. new的时候做了什么
6. 浏览器事件流
7. 水平垂直居中方法 答案
8. position有哪些
9. flex会脱离render吗
10. 原型链
11. 闭包
12. 怎么清除闭包

---

2020-5-23

13. setTimeOut准时吗

• 不一定准时，JS是单线程解释器，setTimeOut只是在时间到了后将任务加入任务队列，如果队列为空则立刻执行，若非空则需等待队列中的任务执行结束再执行。

14. 打乱数组

function getArrRandomly(arr) {
        var len = arr.length;
        for (var i = 0; i < len; i++) {
            var randomIndex = Math.floor(Math.random()*(len-i));//这里一定要注意，后面不管是（i+1）还是（len-i），它们是时变的。
            var itemAtIndex = arr[randomIndex];
            arr[randomIndex] = arr[i];
            arr[i] = itemAtIndex;
        }
        return arr;
    }

15. 纯js实现ajax

var Ajax = {
    get: function(url,fn){
        // XMLHttpRequest对象用于在后台与服务器交换数据
        var xhr=new XMLHttpRequest();
        xhr.open('GET',url,false);
        xhr.onreadystatechange=function(){
            // readyState == 4说明请求已完成
            if(xhr.readyState==4){
                if(xhr.status==200 || xhr.status==304){
                    console.log(xhr.responseText);
                    fn.call(xhr.responseText);
                }
            }
        }
        xhr.send();
    },

    // data应为'a=a1&b=b1'这种字符串格式，在jq里如果data为对象会自动将对象转成这种字符串格式
    post: function(url,data,fn){
        var xhr=new XMLHttpRequest();
        xhr.open('POST',url,false);
        // 添加http头，发送信息至服务器时内容编码类型
        xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
        xhr.onreadystatechange=function(){
            if (xhr.readyState==4){
                if (xhr.status==200 || xhr.status==304){
                    // console.log(xhr.responseText);
                    fn.call(xhr.responseText);
                }
            }
        }
        xhr.send(data);
    }
}

16. typeof和instanceof

• typeof的定义和用法：返回值是一个字符串，用来说明变量的数据类型。
• typeof 一般只能返回如下几个结果：number,boolean,string,function,object,undefined。
• Instanceof定义和用法：instanceof 用于判断一个变量是否属于某个对象的实例。

  var a = new Array(); 
  alert(a instanceof Array);  // true
  alert(a instanceof Object)  // true
  

17. 垃圾回收机制方式及内存管理

• 回收机制方式

1. 定义和用法：垃圾回收机制(GC:Garbage Collection),执行环境负责管理代码执行过程中使用的内存。
2. 原理：垃圾收集器会定期（周期性）找出那些不在继续使用的变量，然后释放其内存。但是这个过程不是实时的，因为其开销比较大，所以垃圾回收器会按照固定的时间间隔周期性的执行。
3. 垃圾回收策略：标记清除(较为常用)和 引用计数。

---

2020-5-26
18. 什么是 回调？什么是 异步?
19. JS怎样处理 异步
callback详解
20. 如何阻止事件冒泡

• 阻止事件冒泡，阻止默认事件，event.stopPropagation()和event.preventDefault()，return false的区别
• JS阻止冒泡和取消默认事件(默认行为)