Web面试核心口诀记忆

汇报时间：2025年汇报人员：PPTLOGO2025Web面试核心口诀记忆LOGO-HTML核心要点CSS核心要点Vue核心要点HTTP核心要点算法核心要点网络协议核心要点安全性核心要点数据库核心要点前后端分离与通信目录算法设计与优化云计算与云服务网络安全与防护PART1LOGOHTML核心要点LOGOHTML核心要点HTML三层结构：结构层(HTML)、表现层(CSS)、行为层(JavaScript)HTML5优点：语义化标签、多媒体支持、本地存储、Canvas/WebGL、跨平台HTML5缺点：浏览器兼容性问题、移动端适配需要额外处理Doctype作用：声明文档类型，避免浏览器进入怪异模式LOGOHTML核心要点1严格模式按最新标准渲染，混杂模式向后兼容严格模式与混杂模式video/audio标签、地理定位、本地存储、-s、WebWorkersHTML5新特性2frame/frameset/noframes、font/center等表现性标签移除元素3Chrome(Blink)、Firefo(Gecko)、Safari(WebKit)、Edge(Chromium)常见浏览器内核4span/a/img/input/button等行内元素5div/p/h1-h6/ul/ol/li等块级元素6br/hr/img/input/link/meta等空元素7PART2LOGOJavaScript核心要点LOGOJavaScript核心要点Cookie优缺点：存储量小(4KB)、随请求发送影响性能、安全性问题本地存储方案：localStorage(持久化)、sessionStorage(会话级)、IndeedDB(结构化)原型链机制：实例通过__proto__访问原型，原型通过prototype指向构造函数数据类型：基本类型(Undefined/Null/Boolean/Number/String/Symbol/BigInt)、引用类型(Object)事件循环：调用栈、任务队列、微任务队列的协同工作机制ES6特性：let/const、箭头函数、解构赋值、Promise、模块化、class语法异步编程：回调函数、Promise、async/await、Generator类型转换：显式转换(parseInt/Number/String)和隐式转换(==运算)执行上下文：包含变量对象、作用域链、this绑定闭包原理：函数可以访问定义时的词法作用域，即使函数在词法作用域外执行PART3LOGOCSS核心要点LOGOCSS核心要点盒子模型：content+padding+border+margin选择器类型：元素选择器、类选择器、ID选择器、属性选择器、伪类选择器优先级计算：!important>行内样式>ID>类/伪类/属性>元素/伪元素display属性：block/inline/inline-block/fle/grid/table/none布局方式：浮动布局、定位布局、fle布局、grid布局响应式设计：媒体查询、rem/vw单位、弹性图片、移动优先动画实现：transition过渡、@keyframes关键帧动画BFC特性：独立渲染区域，解决margin重叠、浮动包含等问题居中方案：margin:auto、fle布局、grid布局、transform定位清除浮动：clearfi、overflow:hidden、after伪元素PART4LOGOVue核心要点LOGOVue核心要点两大核心：数据驱动(响应式系统)、组件系统双向绑定原理：数据劫持(defineProperty/Proy)+发布订阅模式生命周期钩子：beforeCreate/created、beforeMount/mounted、beforeUpdate/updated、beforeDestroy/destroyednetTick原理：异步更新队列，DOM更新后执行回调VirtualDOM：用JS对象模拟DOM树，通过diff算法最小化DOM操作组件通信：props/$emit、provide/inject、$parent/$children、vue/pinia路由机制：hash模式和history模式、导航守卫、动态路由、懒加载状态管理：Vue核心概念(state/getters/mutations/actions/modules)v-if与v-show区别：v-if条件渲染(销毁重建)、v-show显示隐藏(display切换)常用修饰符：stop/.prevent/.capture/.self/.once/.passivePART5LOGOReact核心要点LOGOReact核心要点核心概念：JS语法、虚拟DOM、组件化、单向数据流生命周期：componentDidMount、shouldComponentUpdate、componentDidUpdate、componentWillUnmount状态管理：Redu三大原则(单一数据源、只读state、纯函数修改)、React-Redu(Provider/connect)性能优化：PureComponent、、useMemo、useCallback、key属性组件类型：函数组件、类组件、受控组件、非受控组件Hooks机制：useState/useEffect/useContet/useReducer/useCallback/useMemo路由实现：React-Router的BrowserRouter/HashRouter、Route/Switch/Link组件高阶组件：函数接收组件返回新组件，用于逻辑复用合成事件：跨浏览器封装的事件系统，事件委托机制Fiber架构：可中断的异步渲染机制，优先级调度PART6LOGOHTTP核心要点LOGOHTTP核心要点报文结构：起始行+头部字段+空行+实体主体请求方法：GET(获取)、POST(提交)、PUT(替换)、PATCH(部分更新)、DELETE(删除)GET与POST区别：参数位置(URL/body)、安全性、缓存、幂等性、数据量限制缺点改进：无状态(cookie/session)、明文(HTTPS)、队头阻塞(HTTP/2多路复用)大文件传输：分块传输(chunked)、范围请求(Range/Content-Range)、断点续传表单提交：application/-www-form-urlencoded(默认)、multipart/form-data(文件)缓存机制：强缓存(Epires/Cache-Control)、协商缓存(Last-Modified/ETag)HTTPS原理：SSL/TLS加密、对称加密+非对称加密、CA证书验证状态码分类：1(信息)、2(成功)、3(重定向)、4(客户端错误)、5(服务器错误)HTTP特点：无状态、明文传输、基于请求-响应模型PART7LOGO算法核心要点LOGO算法核心要点栈与队列：有效括号、用栈实现队列、滑动窗口最大值、循环队列链表操作：反转链表、环形链表检测、合并有序链表、删除节点排序算法：快速排序、归并排序、堆排序、冒泡排序、选择排序二叉树：遍历(前序/中序/后序/层序)、最大深度、对称判断、最近公共祖先动态规划：背包问题、最长公共子序列、爬楼梯、股票买卖查找算法：二分查找、哈希查找、二叉搜索树贪心算法：分发饼干、跳跃游戏、加油站问题回溯算法：全排列、组合总和、N皇后、子集问题位运算：汉明重量、只出现一次的数字、位1的个数双指针：两数之和、三数之和、盛水最多的容器PART8LOGO网络协议核心要点LOGO网络协议核心要点TCP/IP协议族：物理层、数据链路层、网络层、传输层、会话层、表示层、应用层TCP与UDP区别：连接/无连接、可靠性/不可靠性、流量控制/无流量控制TCP三次握手：请求SYN、同意SYN+ACK、确认ACKTCP四次挥手：发起FIN、同意FIN+ACK、双向FIN+ACKIP地址分类：A/B/C/D/E类LOGO网络协议核心要点01DNS解析过程：客户端请求、DNS服务器解析、响应返回02HTTPS与HTTP区别：SSL/TLS加密传输03HTTPS与HTTP区别：SSL/TLS加密传输04CDN原理：缓存技术、负载均衡、DNS解析05P2P网络：交换技术(BT/eMule)、传输控制协议(uTorrent/DHT)06FTP与SFTP的区别：FTP协议安全存在缺陷，SFTP为安全shell服务，需客户端登录认证PART9LOGO安全性核心要点LOGO安全性核心要点常见Web攻击：SS攻击(跨站脚本)、CSRF攻击(跨站请求伪造)、SQL注入攻击1234567SS攻击防范：HTML转义输出、内容安全策略(CSP)、HTTPSCSRF攻击防范：验证码验证、同源检测(Referrer)SQL注入原理及防范措施：使用参数化查询，严格管理数据库访问权限Web服务器安全配置：禁用不必要的服务，设置防火墙规则，定期更新补丁密码学基本概念：对称加密(DES/AES)、非对称加密(RSA)HTTPS实现原理及安全性：SSL/TLS协议，证书验证，加密传输PART10LOGO前端性能优化核心要点LOGO前端性能优化核心要点减少HTTP请求次数：合并文件大小，使用缓存使用CDN加速资源加载压缩图片等资源文件大小利用浏览器缓存机制：如本地存储等使用异步加载方式：如defer或async属性加载JS文件利用事件代理机制：减少事件处理器的注册次数对代码进行压缩和混淆处理：减小代码体积利用webworker实现离线计算和操作：减少主线程压力优化渲染性能：如减少DOM操作次数，使用虚拟DOM等库提高性能PART11LOGO前端框架与库的核心要点LOGO前端框架与库的核心要点1234ReactNative技术体系与原理：利用JavaScript核心实现原生UI渲染，ReactJS中的虚拟DOM映射至本地界面，适配跨平台UI方案组件化开发思想及优势：轻量级框架，组件化开发提高复用性。响应式数据绑定简化视图更新。插件机制扩展功能。生态丰富Angular特性及优点：TypeScript语言支持，指令化开发模型简化操作。模板语言增强开发效率。双向数据绑定减少代码量。模块化开发便于维护ES6新特性在前端开发中的应用：let/const关键字替代var，箭头函数简化this处理，模块化导入导出增强代码复用性5前端构建工具如Webpack的使用方法及优势：通过配置文件实现模块化打包。代码分割提高页面加载速度。插件机制支持多种资源处理。易于扩展的构建流程PART12LOGO数据库核心要点LOGO数据库核心要点关系型数据库与非关系型数据库的区别：关系型强调数据间的关系，非关系型强调数据存储形式1234567SQL语言基础：SELECT/INSERT/UPDATE/DELETE等操作，JOIN/WHERE/GROUPBY等查询条件索引原理及优化：B-Tree/B+Tree索引结构，合理设置索引字段提高查询效率事务管理：ACID特性(原子性/一致性/隔离性/持久性)的保障数据库设计范式：第一范式至第三范式，消除数据冗余和依赖性数据库安全：用户权限管理、数据备份与恢复、防止SQL注入等常见数据库系统比较：MySQL/Oracle/SQLServer/MongoDB等性能特点与适用场景PART13LOGO移动端开发核心要点LOGO移动端开发核心要点响应式设计原理及实践：根据设备屏幕尺寸自适应布局移动端性能优化：减少HTTP请求次数，使用CDN加速资源加载跨平台开发技术：ReactNative/Flutter等框架实现多平台应用开发原生与混合应用开发对比：原生性能优势与混合开发成本优势的权衡移动端安全：数据传输加密、防止SS和CSRF攻击等PART14LOGO前端工程化与模块化LOGO前端工程化与模块化SWOT前端工程化思想模块化开发、代码规范、自动化构建、测试驱动开发等模块化开发实践使用ES6模块、CommonJS等实现模块间的解耦和复用工具链建设利用Webpack、Gulp等构建工具进行自动化处理工程化流程规范从需求分析到项目维护的全流程规范和管理PART15LOGO前后端分离与通信LOGO前后端分离与通信1前后端分离概念及优势：服务端与前端独立开发，提升效率与可维护性2RESTfulAPI设计原则及实践：基于HTTP协议设计统一的接口规范3WebSocket与HTTP长连接的比较：实现实时通信的两种方式的特点和适用场景4前端如何与后端通信：通过API接口进行数据交互和业务逻辑处理PART16LOGO设计模式与软件架构LOGO设计模式与软件架构设计模式分类及常用模式介绍单例模式、工厂模式、观察者模式等软件架构风格及特点微服务架构、SOA架构、客户端-服务器架构等系统架构设计思路从需求分析到系统设计、数据库设计、安全设计等方面进行全面考虑PART17LOGO算法设计与优化LOGO算法设计与优化常见算法原理及实现：排序、搜索、图算法等算法时间复杂度与空间复杂度分析：如何评估算法的效率与资源占用算法优化思路：针对具体问题，如何设计更高效的算法动态规划原理及应用：通过子问题的解求解原问题的最优解

01

02

03

04PART18LOGO软件测试与质量管理LOGO软件测试与质量管理40软件测试方法及流程：单元测试、集成测试、系统测试等1缺陷管理工具及实践：使用Bug管理系统进行缺陷的记录、跟踪与修复2质量保证与质量管理：制定测试计划、编写测试用例、进行测试执行与回归测试等3PART19LOGOWeb前端框架进阶LOGOWeb前端框架进阶使用Vue/Redu进行状态管理，VueRouter/ReactRouter进行路由管理使用WebWorkers进行后台计算，减少主线程压力；利用ServiceWorker进行离线缓存和消息推送等前端性能优化进阶使用ContentSecurityPolicy(CSP)增强安全性，防止跨站脚本攻击等前端安全进阶PART20LOGO云计算与云服务LOGO云计算与云服务项目1项目2项目3项目4项目51251007550250云计算基本概念与优势云计算的架构特点，与传统的IT架构的对比常见云服务提供商及产品AmazonWebServices(AWS)、GoogleCloudPlatform(GCP)、Azure等云服务部署与运维如何部署和管理云服务，包括容器化技术如Docker和Kubernetes的使用PART21LOGO相关技术LOGO相关技术46基础及核心模块：了解的运行机制和事件驱动特性1应用开发实践：使用Epress等框架进行Web应用开发2性能优化：利用异步I/O、集群等技术提升应用性能3PART22LOGO前端框架与库的深入应用LOGO前端框架与库的深入应用1框架