前端、vue、react、js面试题

在前端开发领域，掌握扎实的基础知识是至关重要的，特别是在面试时。以下是一些关于前端、Vue、React、JavaScript的关键知识点： 1. **HTTP/HTTPS**： - HTTP（超文本传输协议）是一种无状态的应用层协议，而HTTPS（安全超文本传输协议）是HTTP的安全版本，通过SSL/TLS协议提供了数据加密、服务器身份验证和消息完整性检查。 2. **TCP三次握手**： - 三次握手是为了建立可靠的连接，确保双方都有能力接收和发送数据。简而言之，它包括客户端发送SYN（同步序列编号）请求，服务器响应SYN+ACK（确认），最后客户端再发送ACK确认。 3. **TCP与UDP的区别**： - TCP是面向连接的，提供可靠的数据传输，有顺序和错误校验，但相对慢；UDP是无连接的，不保证数据顺序和完整性，但速度较快。 4. **WebSocket**： - WebSocket是一种在客户端和服务器之间建立持久连接的技术，用于双向通信，常用于实时应用如聊天、游戏和股票报价等。 5. **HTTP请求方式**： - GET是最常见的请求方式，用于获取资源；POST用于提交数据；PUT用于更新已有资源；DELETE用于删除资源；HEAD只请求首部，不返回内容。 6. **图片URL直接下载**： - 添加`Content-Disposition: attachment; filename=filename.jpg`响应头可以实现图片URL点击后直接下载。 7. **Web Accessibility（无障碍）**： - Web无障碍意味着网站设计应考虑所有用户，包括视力、听力或操作设备受限的用户，比如使用屏幕阅读器的视障人士。 8. **BOM（浏览器对象模型）属性和方法**： - BOM提供了访问浏览器窗口、历史、位置、屏幕等对象的方法，如window对象的location.href、navigator.userAgent等。 9. **HTML5 Drag API**： - HTML5拖放API允许用户在页面元素之间进行拖放操作，通过`dragstart`、`drag`、`dragend`等事件实现。 10. **HTTP/2.0**： - HTTP/2引入了二进制分帧、多路复用、头部压缩等特性，提高了性能和响应速度。 11. **HTTP状态码**： - 400表示错误请求，401未经授权，403禁止访问，表示服务器理解请求但拒绝执行。 12. **Fetch两次请求**： - Fetch在发送预检请求（OPTIONS）以检查跨域策略，然后才发送实际请求。 13. **Cookie、sessionStorage和localStorage**： - Cookie存储在客户端，大小限制4KB，可设置过期时间，用于跟踪会话或用户信息；sessionStorage和localStorage也是客户端存储，但数据不会随浏览器关闭而丢失，它们分别用于临时和长期数据存储，且容量更大。 14. **Web Worker**： - Web Worker允许在后台线程中执行耗时任务，不影响主线程，提高用户体验。 15. **HTML语义化标签**： - 语义化标签如<header>、<nav>、<main>、<article>等，有助于搜索引擎理解和屏幕阅读器解析网页内容。 16. **IFrame**： - IFrame用于在页面内嵌入其他页面，但可能导致性能问题和安全风险，如XSS攻击。 17. **DOCTYPE**： - DOCTYPE声明指定文档类型和遵循的HTML或XHTML规范，影响文档的解析模式，严格模式遵循标准，混杂模式兼容旧浏览器。 18. **Cookie防止XSS攻击**： - 使用HttpOnly标记，阻止JavaScript访问Cookie，减少通过脚本注入窃取Cookie的风险。 19. **Cookie与Session的区别**： - Cookie存储在客户端，数据暴露风险较高，但不依赖服务器资源；Session存储在服务器，更安全，但过多会消耗服务器内存，且存在会话劫持的可能性。 以上内容仅涵盖了一部分前端面试可能涉及的知识点，深入学习还包括CSS布局、JavaScript高级特性、前端框架原理、性能优化、网络优化、测试与调试等方面。对于前端工程师来说，不断学习和提升技术能力至关重要。