当前位置: 首页 > Web前端 > CSS

初级前端开发面试总结

时间:2023-03-30 17:16:33 CSS

前端面试总结先说说背景吧。2018年7月毕业,去年10月入职,一直做前端开发工作到今年10月。一年前打算换工作,所以重新整理了以下面试考点总结包括:JavaScript基础、CSS基础、常用算法和数据结构、React&Vue框架、计算机网络相关知识,有些点可能很薄,有的点可能比较大,参考个人情况总结,便于回忆知识,有的列出参考答案,有的在文末列出优秀答案闭包的概念?闭包的作用?使用闭包的注意事项?EventMechanismEvent3stages事件捕获阶段,在target阶段,事件冒泡阶段默认为事件冒泡ES6letconst类模块化等。常用ES6知识箭头函数,这里可以展开考察这个指向问题集图相关原型链4种继承方式新增原理深拷贝&浅拷贝数据类型基本数据类型和引用数据类型跨域同源策略CORSJSONPIframe+document.domain安全CSRF跨站请求攻击(原理、防护措施referertoken验证码、httponly用于设置cookies属性、post请求等XSS(同上HTTP方法几种方法介绍axios库输入URL到页面成功渲染的过程经典问题(任意一步可扩展考察DNS解析(具体解析过程TCP连接http请求(状态码)考察浏览器返回的数据,用于渲染页面(页面渲染过程s上面的模块是下面DNS解析过程的例子)浏览器缓存系统的概念缓存路由器缓存域名提供者顶级域名服务器主域名服务器浏览器页面渲染加载html构建页面dom树分析css构建渲染树渲染树构建完成后,将渲染树绘制到屏幕上(回流重绘JS解析,会阻塞dom树的构建状态码http缓存304强制缓存(expirescache-controlvs.cache(etag&if-none)-matchlast-modified&if-modified-since301302区别(永久重定向(有缓存和临时重定向)垃圾回收引用计数标记clearTypeScript使用就不提了,优缺点总结增加可读性代码编译错误提示tolerance.js可以写成.ts拥抱ES6,框架支持高学习成本如:classes,generics,interfacesFunctionalprogrammingconcepts相同的输入总是导致相同的输出,并且没有任何副作用,例如ajax请求更改全局变量。优点和缺点1.可缓存性2.可移植性3.并行性不需要通用内存柯里化的概念。好的回答,我列一个知乎答案:接口统一,每一层封装干净,逻辑清晰ComplexityStabilityQuicksortUnstableSpaceComplexityO(logn)AverageTimeComplexityO(nlogn)Worst...O(n2)选择排序不稳定空间复杂度O(1)...都是O(n2)冒泡排序稳定堆排序不稳定空间复杂度O(1)...都是O(nlogn)插入排序哈希表数组和链表的特点ListSearch插入删除时间复杂度O(1)二叉树前序遍历,中序遍历,后序遍历,树高链表翻转链表,AVL树,二叉搜索树特征,O(logn)精度损失问题0.1+0.1!=0.2(为什么计算机内部的信息是以二进制形式存储的?是的,但是有些浮点数用二进制是不能准确表示的。小数转整数。Math.round()roundsMath.ceil()Math.floor()生成随机数,在Math中引入随机小数.random()[0,1)parseInt(Math.random()*(m-n)+n)[n,m)Math.round(Math.random()*(m-n)+n)[n,m]数组去重varset=newSet([1,1,2,2,3,3,3,3])vararr=[...set]indexOf如何判断数组是数组Array.isArray(arr)ES5methodarrinstanceofArrayarr.__proto__.constructor===Array()Object.prototype.toString.call(arr)==='[objectArray]'//数据原型和对象原型定义的toString方法是不同的Object.prototype.toString.call(obj)==='[objectObject]'//同上Object.prototype.toString.call(null)==='[objectNull]'//推荐使用该方法指定去重的数组个数findDuplicate(num)es6SetMap相关操作reversestringJS异步异步解析历史(Ajax进化Process)Promise,Async/Await用法Promise缺点PromiseAPIPromise.all&Promise.raceAjaxReadyState(0,1,2,3,4)5个状态js实现ajax优缺点单/双向数据绑定MV**概念vue/react数据绑定机制Vue生命周期父子组件通信双向数据绑定vm.$nextTick原理React生命周期Virtual-dom技术与改进Diff算法对比Vue.js数组去重数组扁平化深拷贝与浅拷贝Position属性几个属性值box-sizing属性content-boxborder-box盒子模型W3c标准盒子模型和IE盒子模型两列布局三列布局常用自适应布局写法reflow和redraw概念示例les如何规避eg:DocumentFragment,Absolutefloating伪元素和伪类Clearfloatingcommon3种隐藏元素的方法displaynonevisibilityhiddendifferenceverticalcenterlayout常见的垂直居中布局方法前端性能优化列表常见的前端性能优化方法列表一些优秀的答案输入网址你能看到什么?HTTP缓存域名解析流程Vue生命周期React生命周期CSRF攻击水平垂直居中布局