uperficialyu的博客

Vue：采用双指针和key策略，能更精准地找出差异，更新DOM。React：基于启发式策略，通过双循环遍历列表，性能也较为出色。两者都运用了虚拟DOM和Diff算法，减少了不必要的DOM操作，提高了渲染性能。在实际开发中，合理使用key能进一步优化Diff算法的性能。在 JavaScript 里，闭包是一个强大且重要的概念。下面为你详细解释 JavaScript 中的闭包。闭包是指有权访问另一个函数作用域中变量的函数。

Vue 2v-forv-ifv-for优先级更高）Vue 3v-ifv-forv-if优先级更高）最佳实践是避免两者同时用于同一元素，使用计算属性或嵌套结构替代try {}, []);

特性HTTPHTTPS加密无SSL/TLS 加密端口80443安全性低高（防窃听、篡改）证书不需要需要 CA 签发证书速度略快稍慢（可优化）适用场景非敏感数据敏感数据、现代网站建议：当前所有网站都应迁移到 HTTPS，尤其是涉及用户数据的服务。协议相同域名相同端口相同（默认80/443）URL1URL2是否同源原因是协议、域名、端口相同否协议不同否域名不同否端口不同。

Vue 2v-forv-ifv-for优先级更高）Vue 3v-ifv-forv-if优先级更高）最佳实践是避免两者同时用于同一元素，使用计算属性或嵌套结构替代try {}, []);

Webpack 插件是基于事件流机制实现的，其核心是借助钩子（Hooks）来达成。Webpack 在构建流程的不同阶段会触发不同的钩子，插件可以在这些钩子上挂载自己的逻辑，进而在特定的构建阶段执行自定义操作。下面是一个自定义 Webpack 插件的示例代码，此插件会在构建完成后输出构建信息。// 接收插件配置选项// 监听 'done' 钩子，该钩子在构建完成后触发console.log('构建完成！');console.log('输出路径:', outputPath);

在面试中回答这个问题时，可以结合实际的项目经验，例如：“在我之前的项目中，使用 Vite 开发一个 Vue 3 项目，开发服务器的启动速度非常快，几乎是瞬间完成，而之前使用 Webpack 时，启动时间会随着项目规模的增加而显著增加。综上所述，Vite 在开发时的启动速度、HMR 性能、配置的简洁性、对现代前端框架的支持、插件生态的易用性以及对 TypeScript 的支持等方面都有一定的优势，尤其是对于开发体验和开发效率有更高要求的项目，Vite 是一个很好的选择。同时进行预加载扫描，查找外部资源引用。

<button @click="increment">增加</button>

特性WebpackVite工作原理完整打包，解析依赖，编译代码按需编译，即时加载，利用浏览器原生 ESM启动时间较长，尤其是大型项目非常快，通常只需几百毫秒热更新 (HMR)局部更新，但需要重新打包更高效，不刷新页面，快速更新模块配置复杂度复杂，需要详细配置简单，默认配置已足够适用场景复杂项目，需要高度定制化快速开发，中小型项目，追求极致开发体验生态系统成熟，插件丰富相对较小，但发展迅速。

在 JavaScript 中，普通函数和箭头函数是两种不同的定义函数的方式，它们存在多方面的区别，下面为你详细介绍：箭头函数：使用箭头 来定义，语法更加简洁。当只有一个参数时，可以省略括号；当函数体只有一条语句时，可以省略花括号和 关键字。2. 指向普通函数： 的值取决于函数的调用方式，它可以是全局对象（在非严格模式下）、函数本身（使用 、 或 方法时）、对象实例（当函数作为对象的方法调用时）等。箭头函数： 的值继承自外层函数（即定义时的上下文），不会根据调用方式改变。3

设计模式即 Software Design Pattern，是一套被反复使用、多数人知晓的、经过分类编目的、代码设计经验的总结。它描述了在软件设计过程中的一些不断重复发生的问题，以及该问题的解决方案。原型链是JavaScript实现继承的主要方式。每个对象都有一个内部属性（可以通过__proto__访问），指向其原型对象。当查找一个对象的属性时，如果对象本身没有这个属性，就会沿着原型链向上查找。闭包是指一个函数能够访问并记住其词法作用域中的变量，即使该函数在其原始作用域之外执行时也是如此。

刚到坐了5分钟，对方说，你可以回去了。

骑车来回30公里去面试。刚填完资料，hr过来对我说，你学历不符合我们的要求，你回去吧。

目录快速排序你怎么带人的说一下从url输入到返回请求的过程let、var、const的区别深拷贝的实现cookie和storage的区别compose函数的实现性能优化统计字符串个数Vue和react的区别1. 快速排序const quickSort = (arr) => { let length = arr.length; if (length < 2) { return arr; } else { // 选择标尺元素 let l

目录讲下数组的一些方法跨域的处理方式讲下你最近的项目setState到底是异步还是同步讲下hooks讲下react的性能优化前端的通信方式讲下webpack的构建流程1. 讲下数组的一些方法比如：concat,fill,filter,map,pop,push,shift,slice,some,sort,includes等。2. 跨域的处理方式跨域主要分3部分：协议相同域名相同端口相同只要有一个不同，那么就是跨域 // 地址 http://www.baidu.

目录讲下react生命周期js的数据类型什么是闭包Vue和react的区别性能优化输入URL到页面渲染的整个流程如何处理跨域问题谈谈你对原型链的理解重排和重绘你做过一些什么基础的搭建项目中最难的问题是什么HTTPS是如何保证安全的你怎么带实习生的你遇到的最难的技术问题是什么后端设置cors，跨域后，前端怎么设置，后端可以拿到cookie谈一下你对js运行机制的理解浏览器渲染机制前端怎么实现微信的授权diff算法原理讲下hooks的使用讲下reactNative

目录大数相加手写讲下你最近的项目如何做性能优化如何⽤webpack来优化前端性能1. 大数相加手写JS在存放整数的时候是有一个安全范围的，一旦数字超过这个范围便会损失精度。我们不能拿精度损失的数字进行运行，因为运算结果一样是会损失精度的。所以，我们要用字符串来表示数据！（不会丢失精度）方案1：let a = "9007199254740991";let b = "1234567899999999999";function add(a, b) { // 取两个数字的最大长度

目录cookie的处理流程说一下从url输入到返回请求的过程说下数组去重的几种方式ts中interface可以继承吗ts中interface可以写多个吗ts的泛型有什么作用new的原理是什么防抖和节流的区别是什么？防抖和节流的实现发布订阅模式hash路由和history路由如何正确的判断this跨域的处理方式类型检测的几种方式项目中为何使用json化配置React的生命周期setState到底是异步还是同步promise all和rase有什么区别useRef虚拟列表

目录怎么看nodejs可支持高并发前端怎么处理文本编辑、计算，类似excel1. 怎么看nodejs可支持高并发nodejs的单线程架构模型nodejs其实并不是真正的单线程架构，因为nodejs还有I/O线程存在（网络I/O、磁盘I/O），这些I/O线程是由更底层的libuv处理，这部分线程对于开发者来说是透明的。JavaScript 代码永远运行在V8上，是单线程的。所以从开发者的角度上来看 nodejs 是单线程的。来张网图：注意看图的右边有个Event Loop，接下来要讲的重

目录讲下你最近的项目开发中你最有成就感的事情1. 讲下你最近的项目我最近一个项目是一个金融的交易系统。项目团队前端10人，后端50多人。前端技术栈是多技术栈，新版本用的是React，老版本用的是Jquery。在团队中我是主力开发，主要是负责项目的组件开发，还有交易的业务开发。项目中采用的是一个类似low coding的解决方案。因为，我们需求变化不大，所以这样的一个解决方案，会提高开发效率，也会减少bug率，而且后期维护，也会方便很多。2. 开发中你最有成就感的事情2019年下半年，2020

目录讲下你会的几种排序算法讲下冒泡排序的实现能不能对冒泡排序进行优化讲下快速排序实现能不能对快速排序进行优化React的生命周期作用讲下HTTP1.0和HTTP1.1有什么区别为什么有了HTTP为什么还要HTTPSHTTPS是如何保证安全的组件通信的方式讲下讲下redux的⼯作流程讲下性能优化网页输入url出现的效果讲下webpack的配置说下js的继承讲下1. 讲下排序算法冒泡排序，选择排序，插入排序，希尔排序，快速排序，归并排序，堆排序等。2. 讲下冒泡排序的实现

目录vue中，watch、methods、computed有什么区别v-if和v-show有什么区别组件是怎么封装的讲下前端工程化1. vue中，watch、methods、computed有什么区别computer当页面中有某些数据依赖其他数据进行变动的时候，可以使用计算属性。<p id="app">{{fullName}}</p><script> var vm = new Vue({ el: '#app', data