summary:知识点总结

【CSS知识点总结】 CSS（Cascading Style Sheets）是用于定义网页中元素样式的语言，是Web设计的重要组成部分。在CSS中，你可以控制文本样式、颜色、布局、响应式设计等多个方面。 1.选择器：包括类选择器、ID选择器、元素选择器、属性选择器等，用于定位要修改的HTML元素。 2.属性：如color、font-size、background-color、padding、margin等，用于设置元素的样式属性。 3.盒模型：包括内容(content)、内边距(padding)、边框(border)和外边距(margin)，理解盒模型对于布局至关重要。 4.相对单位与绝对单位：如px、em、rem、%等，合理使用可以实现响应式设计。 5.浮动(float)和清除(clear)：用于处理元素的排列，解决元素重叠问题。 6.定位(position)：static、relative、absolute、fixed，理解定位模式对于复杂的页面布局很有帮助。 7. Flexbox（弹性盒子布局）：提供了一种更为灵活的布局方式，适用于一维布局。 8. Grid（网格布局）：用于二维布局，能更精确地控制元素的位置和大小。 9. CSS预处理器：如Sass、Less，可以编写更简洁、可维护的CSS代码。 10. CSS模块化：如CSS Modules、CSS-in-JS，提高代码复用和组织性。 【JS基础】 JavaScript是一种脚本语言，常用于网页交互和动态效果。主要知识点包括： 1.数据类型：包括基本类型（String、Number、Boolean、Null、Undefined）和引用类型（Object）。 2.变量声明：var、let、const关键字的区别和使用场景。 3.运算符：算术运算符、比较运算符、逻辑运算符、赋值运算符等。 4.控制流程：条件语句（if...else）、循环（for、while、do...while）、switch语句。 5.函数：声明函数、函数表达式、箭头函数，以及参数默认值和rest/spread运算符。 6.对象和数组：对象字面量、数组字面量，以及属性访问、方法调用、数组方法（map、filter、reduce等）。 7.作用域：全局作用域、局部作用域、块级作用域（let/const）。 8.闭包：理解闭包的概念及其在内存管理中的作用。 9.事件和DOM操作：添加/移除事件监听器，修改DOM元素的属性和样式。 10.异步编程：回调函数、Promise、async/await，理解异步执行的原理和解决回调地狱的方法。 【Vue框架】 Vue.js是一个轻量级的前端框架，用于构建用户界面。核心知识点包括： 1.指令：v-if、v-else、v-for、v-bind、v-on等，用于增强HTML模板。 2.组件化：创建组件、组件通信（props、$emit）、递归组件。 3.计算属性与侦听器：基于数据的动态计算和监听数据变化。 4.响应式系统：依赖收集和数据绑定，实现数据驱动视图。 5.路由（Vue Router）：实现单页应用的页面跳转和状态管理。 6.状态管理（Vuex）：集中管理组件间的共享状态。 7.生命周期：了解组件从创建到销毁的各个阶段，优化性能。 8.自定义指令：扩展Vue的功能，实现个性化需求。 9.插槽：用于组件内容分发，实现自定义布局。 10. Vue CLI：快速搭建项目，自动化构建工具。 【Webpack】 Webpack是一个模块打包工具，用于处理前端资源。关键概念有： 1.入口(entry)：定义应用的起点，Webpack从这里开始解析和构建。 2.输出(output)：配置打包后的文件路径和命名规则。 3.模块加载器(loader)：转换不同类型的模块，如.js、.css、.svg等。 4.插件(plugins)：执行更复杂的构建任务，如HtmlWebpackPlugin生成HTML文件。 5.分离代码chunk：通过CommonsChunkPlugin或SplitChunksPlugin实现按需加载，优化性能。 6.热更新(HMR)：在开发过程中实时更新代码，不刷新页面。 7.模块解析(resolve)：设置模块查找规则，简化导入语句。 8.源码映射(source map)：方便调试，将打包后的代码映射回源码。 9. Loader配置：例如Babel用于转换ES6+语法，StyleLoader和CssLoader处理CSS。 10.配置优化：如tree shaking（摇树优化），减少未使用的代码。 【HTTP和浏览器相关】 1. HTTP协议：请求方法（GET、POST等）、状态码、请求头、响应头等。 2. HTTPS：加密传输，确保数据安全。 3.浏览器缓存：利用Cache-Control、ETag等控制策略提高页面加载速度。 4.跨域：理解同源策略，以及JSONP、CORS、代理等跨域解决方案。 5.域名解析与DNS：域名到IP的转换过程。 6.浏览器存储：Cookie、LocalStorage、SessionStorage、IndexedDB，以及它们的用途和限制。 7.浏览器渲染过程：解析HTML、CSS，构建DOM树和CSSOM树，合成帧，发送到GPU绘制。 8.性能优化：减少HTTP请求、压缩资源、图片优化、预加载、懒加载等。 9. PWA（渐进式Web应用）：Service Worker、Web App Manifest，提供离线体验和安装应用功能。 10. SEO（搜索引擎优化）：关键词、元标签、URL结构、网站结构等，提升搜索排名。 【常见手写题】 1.冒泡排序、快速排序、二分查找等经典算法的实现。 2.原型链、构造函数、实例化过程的理解和模拟实现。 3. Promise/A+规范的理解和Promise实现。 4.事件循环(Event Loop)和宏任务、微任务的解释。 5.函数柯里化(Currying)、偏函数(Partial Application)的应用与实现。 6.函数防抖(Debounce)和节流(Throttle)的实现，优化性能。 7.数据结构操作，如栈、队列、哈希表的实现。 8.类似Array.prototype.slice()、Array.prototype.map()等数组方法的实现。 9. Vue的双向数据绑定原理和实现。 10.虚拟DOM的原理及手动实现一个简单的版本。 【项目总结】实际项目开发中，除了技术细节，还需要关注以下几点： 1.项目架构：MVC、MVVM、Flux、Redux等架构模式的选择和实现。 2.代码规范：遵循一定的编码风格，提高代码可读性和团队协作效率。 3.测试：单元测试、集成测试，确保代码质量。 4.性能监控：使用Lighthouse、Chrome DevTools等工具进行性能分析和优化。 5.代码部署：了解CDN、负载均衡、服务器配置等，确保应用稳定运行。 6.版本控制：熟练使用Git进行代码管理和协作。 7.团队协作：良好的沟通技巧，使用敏捷开发方法，如Scrum或Kanban。 8.用户体验：理解用户需求，优化交互设计和视觉设计。 9.技术选型：根据项目需求，合理选择技术和工具。 10.持续学习：跟踪技术发展，不断提升自己的技能水平。