前端面经总结-每日一篇_一面面试总结怎么写-优快云博客

本文链接：https://blog.youkuaiyun.com/toBe1BetterMan/article/details/106247369

本文涵盖了前端面试中的核心知识点，包括TCP与UDP的区别、HTTP版本及其差异、进程与线程的概念及通信方式、JavaScript的new操作符作用、浏览器事件流解析、CSS布局技巧、Flex布局特性、原型链和闭包原理等。同时，深入探讨了JavaScript的异步处理、事件循环机制、垃圾回收策略，并提供了纯JS实现AJAX的方法和数组随机化的函数示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

每日掌握一篇面经

2020-5-20 头条

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

2020-5-23

setTimeOut准时吗

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

打乱数组

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;
    }

纯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);
    }
}

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

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

回收机制方式

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

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