前端面经1

is me 熊瞎子

已于 2024-04-02 16:01:33 修改

阅读量414

点赞数 6

文章标签：前端面试

于 2024-04-02 16:00:37 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_51600020/article/details/137273671

版权

this 指向：this 关键字在 JavaScript 中指向调用该函数的对象。闭包是因为 JavaScript 中的函数可以访问其定义时所处的作用域链，而不是调用时所处的作用域链。
ES6 新特性：ES6引入了许多新特性，包括箭头函数、let 和 const、解构赋值、模板字符串、Promise、class 等。
var、let、const：它们都是声明变量的关键字，但在作用域、变量提升、重复声明等方面有所不同。var存在变量提升和全局作用域问题，而let和const不存在变量提升，并且有块级作用域，const声明的变量是常量，不可修改。
Promise 原理：Promise 是一种异步编程的解决方案，其核心是解决回调地狱的问题，通过链式调用的方式来处理异步操作。
浏览器从输入到页面渲染的过程：主要包括 DNS 解析、建立 TCP 连接、发送 HTTP 请求、服务器处理请求并返回响应、浏览器解析 HTML、构建 DOM 树、解析 CSS、构建渲染树、布局和绘制等步骤。
强缓存和协商缓存：强缓存通过设置响应头来告诉浏览器可以直接使用本地缓存，而协商缓存则是在本地缓存失效时，通过与服务器通信来确定是否需要使用缓存。
Vue 和 React 的区别：Vue 更注重于简单性和易用性，而 React 更加灵活，并且有更大的生态系统和更好的性能。
Vue2 和 Vue3 的区别：Vue3 在性能、体积、响应式系统等方面进行了优化，并引入了 Composition API，使得代码更加灵活可维护。
Vue 和 React 的相同点：它们都是流行的前端框架，都采用了组件化的开发方式，并且都有着良好的社区支持和文档。
虚拟 DOM：虚拟 DOM 是将真实 DOM 结构抽象成 JavaScript 对象，并在内存中进行操作，通过比较新旧虚拟 DOM 的差异，最小化页面重绘和重新布局的开销。
Diff 算法：Diff 算法是虚拟 DOM 实现更新的核心算法，通过比较两棵树的差异，将更新操作应用到真实 DOM 上。
HTTPS：HTTPS 是基于 SSL/TLS 协议的加密传输协议，通过对数据进行加密和认证，保证了数据传输的安全性。
HTTP/2.0：HTTP/2.0 是 HTTP 协议的新版本，主要提供了多路复用、头部压缩、服务器推送等功能，以提高性能和效率。
打包工具：除了 webpack 外，还有 Parcel、Rollup 等打包工具，它们各有特点和适用场景。
Webpack 原理：Webpack 是一个模块打包工具，通过 loader 和 plugin 的机制，将各种资源模块打包成静态资源。
Vite 原理：Vite 是一种基于浏览器原生 ES 模块导入的开发服务器和构建工具，利用浏览器的本地编译能力，实现了快速的冷启动和热更新。
解决白屏问题：可以通过代码拆分、预加载、懒加载等手段来优化页面加载速度，减少白屏时间。
首屏优化方案：包括减少 HTTP 请求、压缩资源、使用 CDN、优化图片、懒加载等手段来加速首屏加载。
SSR 渲染的优点和缺点：SSR 可以提高页面的首屏加载速度、SEO 友好，但增加了服务器端渲染的复杂度和开发成本。
前端性能优化的方法：包括减少 HTTP 请求、压缩资源、使用 CDN、代码拆分、懒加载、预加载、服务端渲染等。
虚拟滚动列表的实现：通过动态渲染可视区域内的列表项，减少 DOM 元素数量，提高性能。可采用 Intersection Observer API、虚拟列表组件等技术方案。
手撕 Promise：Promise 的基本原理是通过状态管理和 then 方法链式调用来实现异步编程，可以手动实现 Promise 的核心功能，包括状态管理、then 方法等。