- 博客(36)
- 收藏
- 关注
原创 react相关知识
(1)类组件(2)函数组件高阶组件是一个,它接收一个组件作为参数,并返回一个新的增强型组件。为了解决 React 中的问题。在自定义 Hooks 出现之前,这是 React 中主要的逻辑复用方式。重新渲染 render 会做些什么?Fiber 是 React 16 中全新的协调引擎(reconciliation engine),也是一种新的数据结构。,它让 React 能够实现增量渲染和更精细的任务控制。旧架构的问题(Stack Reconciler)在 React 16 之前,React 使用。
2025-08-23 23:49:18
939
原创 微前端介绍
在渲染某些区域的内容时,从「加载自身chunk」变成「加载应用入口」,加载器从webpack换成微前端容器。4.大型复杂应用,单体前端应用的局限性是比较明显的,构建时间漫长、团队协作困难、技术栈升级风险高。3.子应用匹配到/sub-route/xxxx路由时,在自己的区域内渲染对应路由内容。2.聚合前端应用:微服务架构可以解耦后端服务间依赖,前端应用也要相互解耦互不影响。1.主应用匹配到/main-app/sub-route路由,渲染当前路由内容。2.当前路由内容中有子应用,则异步加载子应用入口。
2025-08-12 16:16:50
244
原创 npm、pnpm、yarn区别
pnpm安装的依赖都会放到一个仓库,通过软链接创建了一个引用(相当于快捷方式),这个快捷方式通过硬链接引用了同一个依赖的内存地址。不需要重新下载很多份相同的依赖,只需要在同一个仓库取就可以了,节省了很多空间资源(所有的依赖只会用到一份)。Monorepo 是一种项目代码管理方式,指单个仓库中管理多个项目,有助于简化代码共享、版本控制、构建和部署等方面的复杂性,并提供更好的可重用性和协作性。通过非扁平化方式,加上软硬链接的方式,提升了性能,节省了磁盘开销。
2025-08-12 16:00:04
336
1
原创 xhr、fetch和axios
Axios 是一个基于 Promise 的 HTTP 客户端,专为浏览器和 Node.js 设计。Fetch API 是现代浏览器提供的用于替代 XHR 的新标准,它基于 Promise,提供了更简洁、更强大的接口来处理网络请求。当你按顺序写 XHR 请求时,它们会立即开始执行,但不会等待前一个请求完成。"只有当请求 1 成功完成后,才开始请求 2;只有当请求 2 成功完成后,才开始请求 3"Fetch API 的主要设计目标是提供一个现代、简洁的网络请求接口,但它。第三个请求需要前两个请求的结果 (
2025-05-26 23:51:00
1783
原创 CSS相关知识
相对定位不脱离文档流,仍然占据原来的位置(最频繁的作用是给绝对定位当爹)绝对定位脱离文档标准流,不再占有原来位置。静态定位相当于标准流。
2025-05-25 21:45:57
364
原创 计算机网络面经
主动关闭方(A )在收到对方的 FIN 报文段并发送确认(ACK )后进入的状态。此时连接已经基本关闭,但 TCP 协议还要等待一个 2 倍报文段最大生存时间(2MSL,Maximum Segment Lifetime )的时长。:主动关闭方(A )收到对方对其 FIN 报文段的确认(ACK )后进入的状态。:主动关闭连接的一方(图中 A )发送了释放连接请求(FIN = 1 )后所处的状态。:从接收到对方的 ACK 报文段开始,到接收到对方发送的 FIN 报文段结束。,来表示对方也没有数据要发送了。
2025-05-22 11:09:54
504
原创 Vue面试题
vue2中通过Object.defineProperty递归data对象中的每个属性进行数据劫持,添加getter和setter,新增和删除属性无法监控,得通过Vue.set和Vue.delete,修改数组得通过数组方法。在视图中有人使用data中的属性值,则触发getter,在getter里面记录相应组件的watcher,data中的属性值发生变化,则在setter中让记录的watcher重新执行。路径时,SPA 不会重新请求服务器获取新 HTML,而是通过前端路由加载对应的组件,在客户端直接渲染。
2025-05-21 23:04:25
930
原创 网络相关面经
握手过程:先三次握手建立TCP连接,客户端向服务器发送hello信息,包含了支持的TLS版本号和支持的加密算法,服务器向客户端回一个hello,里面包含选择的TLS版本和加密算法,并向客户端发送一个数字证书,客户端使用系统的公钥对证书进行解密,并提取出服务器发送的公钥,客户端生成一个预主秘钥,并用提取出来的服务器公钥对预主秘钥进行加密,然后发送给服务器,服务器再用自己的私钥进行解密得到预主秘钥,之后客户端和服务器用同样的算法在预主秘钥的基础上生成会话秘钥,最后用会话秘钥对发送的数据进行加密传输。
2025-05-20 23:46:52
174
原创 Node.js相关知识
同步任务执行的过程中,遇到了异步任务,不会阻塞下面同步任务的进行,异步任务像文件IO会交给另外一个线程(底层系统或内置线程池),这个异步任务完成后将它的回调放入队列,如果同步任务全部执行完了,再将队列里的回调取出执行。目录下的文件路径匹配,Express 就会自动将对应的文件发送给客户端,无需再编写额外的路由处理函数。相同之处都是异步任务交给其他线程处理,执行完将回调放入队列,然后通过时间循环执行。目录)作为静态资源目录后,它会自动处理对该目录下文件的请求。分隔,标识响应头结束,是必需的。
2025-05-19 18:53:28
803
原创 前端面试题(B站)
切完后,将blob,存储到IndexDB,下次用户进来之后,看一下是否有未完成上传的切片,有就尝试继续上传。1.前端切片 chunk 1024M,500K,切片数量 = 1024M/500K。前端切片:主进程卡顿,使用web-worker 多线程切片,处理完后交给主进程发送。解决方案: 使用BigInt,使用外部库Decimal,使用big.js。2.将切片传递给后端,切的片要取名:hash作为名字,index作为顺序。场景:大数据的计算,格式展示,用户输入。大数据做处理:金融,科学计算,数据分析。
2025-05-18 13:01:47
905
原创 XSS攻击和CSRF攻击
XSS(Cross-Site Scripting)是一种常见的 Web 安全漏洞,攻击者通过在目标网站注入恶意脚本(如 JavaScript),使浏览器执行这些脚本,从而窃取用户数据、会话信息或控制用户行为。1.反射型XSS服务器未对参数过滤直接返回给浏览器执行,指的是服务器在处理用户输入(如 URL 参数、表单数据)时,未对其中的特殊字符(如<script>标签)进行过滤或转义,直接将这些内容嵌入到响应 HTML 中返回给浏览器。浏览器会将这些恶意内容视为合法代码执行,从而导致 XSS 攻击。
2025-05-18 01:03:28
240
原创 回流和重绘
回流会重新计算元素的几何位置和布局(如尺寸、位置),并导致渲染树部分或全部重建;重绘会更新元素的视觉样式(如颜色、背景)但不影响布局。
2025-05-17 22:54:40
327
原创 JS手写题
检查Map中是否含有该元素,如果没有则加入新数组,此方法可以区分对象引用。(2)使用filter + indexOf。始终返回元素第一次出现的位置。(2)使用栈迭代展开。
2025-05-17 16:59:47
221
原创 前端八股总结
Vue.js 使用(或 ES6 的 Proxy)来劫持数据的变化。:Vue 不会立即更新 DOM,而是将这些 DOM 更新操作放入一个队列中。Vue 的解决方案是:Vue 提供的一个方法,用于在 DOM 更新完成后执行回调函数。因为 DOM 更新是异步的,如果你在修改数据后立即访问 DOM,可能获取到的是更新前的状态。这段代码通过 Promise 模拟了$nextTick$nextTickcreatedsetTimeout你可能会想:“为什么不直接用?虽然setTimeout。
2025-05-16 15:29:26
322
原创 git基础知识
将content分支合并到主分支后,git会新产生一个新的提交C11(ort合并策略),(合并顺序按照提交记录顺序)git restore 目标文件名 将暂存区的文件内容覆盖当前工作区的文件内容(工作区文件恢复到暂存区文件内容)切换分支后当前工作区的文件也会回到对应分支指向的版本记录。git rm--cached移除暂存区的目标文件。git log --online 查看提交日志。git ls-files查看暂存区所有文件。不同分支之间互相看不到各自提交的版本记录。
2025-05-10 19:34:17
210
原创 两栏布局 三栏布局
容器给出相对定位属性,左右盒子绝对定位,分别为left=0,right=0,中间盒子给出margin-left=左边盒子宽度,margin-right=右边盒子宽度。左右盒子分别左右浮动,中间盒子margin-left=左盒子宽度 margin-right=右盒子宽度。容器给出相对定位,左盒子给出绝对定位,left为0,右盒子给出一个左盒子宽度的margin-left。左边盒子有固定宽度,给定一个向左浮动属性,右边盒子给一个等于左边盒子宽度的margin-left。,后续元素会占据其原本的空间。
2025-05-10 01:15:24
313
原创 vue3基础
新增属性可以用this.$set或者vue.set,删除属性可以用this.$delete或者vue.delete。修改数组可以通过数组方法例如splice去修改,这样vue可以监听到数组内容的变化。
2025-05-05 16:46:25
150
原创 vue基础(尚硅谷80-100)
this代表vue实例对象,vue实例对象上有$on、$emit,所以在vue的原型对象上挂载一个名为$bus的vue实例对象,这个$bus就是各组件之间进行通信的媒介,每个组件顺着原型链都可以找到这个$bus,然后调用$bus中的$on和$emit实现通信。atguigu方法被绑定在了Student的组件实例对象上,用$emit触发。解决方法:可以写成箭头函数,也可以写一个在A中methosds的事件回调。谁触发了aiguigu事件,这个事件回调中的this就是谁。3. 消息订阅与发布。
2025-05-03 18:06:32
152
原创 防抖和节流
setTimeout定时器里面的this指向window,所以如果里面使用匿名函数,就得先把this转存起来,如果使用箭头函数,就不需要转存这个步骤。这里的this代表调用deFunc函数的input框对象.search-city。函数执行完毕,其作用域不会被销毁,因为返回的匿名函数(闭包)引用了。函数内部,返回了一个匿名函数。这个匿名函数可以访问。
2025-04-30 16:50:28
249
原创 vue基础(尚硅谷21-40)
在最后一点中,如果不写成箭头函数,那么this指向window。6.v-model收集表单数据。5.vue监测数据的原理。2.绑定class样式。
2025-04-27 17:05:23
160
原创 Vue基础知识(尚硅谷1-20)
v-model是双向数据绑定,只能应用于表单元素,默认绑定value属性,页面数据变化也会引起data里面的数据变化 v-model:value=“ ” 简写: v-model=“ ”v-bind是单向数据绑定,只能把data里面的数据渲染给页面 简写 :value=“ ”通过一个对象代替另一个对象中属性的操作。
2025-04-26 22:02:40
224
原创 手写promise
都解决后,将它们的解决值按顺序组成一个数组作为结果。回调函数,不过这些回调函数不会马上执行,而是要等对应的。是 JavaScript 中用于处理异步操作的对象,状态改变(解决或拒绝)之后才执行。方法也是异步执行的。循环里,当遍历到每个。
2025-04-26 16:50:35
284
原创 call、apply、bind
方法接受的第二个参数是一个数组(或类数组对象),数组中的元素会作为参数传递给函数。是函数对象的方法,所有函数都可以调用它,所以要把自定义的。这样一来,任何函数都能使用这个自定义的。对象上的函数并执行,最后将执行结果保存到。对象造成不必要的影响,需要把之前挂载到。的指向,并且调用该函数。的指向,需要把这个函数挂载到传入的。方法接受的参数是一个参数列表,而。方法类似,都是用于改变函数内部。在函数执行完毕后,为了避免对。最后,返回函数的执行结果。对象原有的属性,使用。对象上的函数属性删除。
2025-04-24 18:04:14
214
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅