- 博客(80)
- 收藏
- 关注
原创 vue生命周期
Vue 的生命周期是指一个 Vue 实例从创建到销毁的过程,涉及多个阶段和对应的生命周期钩子。理解 Vue 的生命周期有助于我们在合适的时机执行特定的操作,如数据初始化、DOM 操作、事件监听、清理等。以下是 Vue 生命周期的详细描述,按顺序列出各个阶段及其生命周期钩子的作用。
2024-11-26 14:21:56
363
原创 display:inline-block元素之间为什么会出现间隙
行内元素之间的间隙是由HTML 中的空白字符(如换行符、空格)引起的。要避免或消除这个间隙,可以通过将元素放在同一行内书写、使用注释移除空白字符、设置父元素的font-size为 0,或者使用flex布局等方式。
2024-11-11 14:34:25
511
原创 不同HTTP协议版本在连接和数据传输方面的关键特性
基于HTTP/1.1的长连接优化,允许在同一个TCP连接上通过多路复用技术同时发送多个请求和响应。然而,TCP的确认重传机制使得一个数据包丢失会影响所有数据流的传输,可能导致性能瓶颈。每个数据流彼此独立,一个数据包丢失只会影响当前的数据流,不会阻塞其他数据流,因此减少了延迟,提升了传输效率和用户体验。:引入了长连接(持久连接),可以复用TCP连接,即在同一连接上发送多个HTTP请求。:短连接(非持久连接),每个HTTP请求都需要新建一个TCP连接,用完即关闭,资源利用率低,效率较差。
2024-11-11 12:57:29
464
原创 说一说闭包形成的整个流程
创建词法环境:当一个函数被定义时(例如,内部函数定义在外部函数内部),JavaScript 引擎为该函数创建一个新的词法环境。这个环境包括函数内定义的所有变量,以及对其外部环境的引用。这是一个静态结构,反映了函数在定义时的可访问变量。函数定义:定义内部函数,创建词法环境。外部函数执行:调用外部函数,创建执行上下文和词法环境。返回闭包:外部函数返回内部函数的引用。调用闭包:外部函数执行完毕后,闭包仍然持有对外部变量的引用。变量查找:内部函数被调用时,查找外部环境中的变量。
2024-11-04 14:58:27
290
原创 闭包形成的原因是什么?
闭包的形成主要是由于词法作用域、作用域链和词法环境的特性。这些特性使得内部函数能够访问其定义时的外部环境中的变量,即使外部函数已经执行完毕。垃圾回收机制虽然不是直接原因,但它与闭包的内存管理有密切关系。4o mini。
2024-11-04 14:58:14
412
原创 什么是上下文
上下文在 JavaScript 中是一个核心概念,理解词法环境和执行上下文的区别和联系,有助于深入掌握 JavaScript 的作用域、闭包和异步编程等重要特性。词法环境决定了函数能够访问哪些变量,而执行上下文则包含函数在执行时的运行状态和上下文信息。
2024-11-04 14:28:48
396
原创 请你谈一谈闭包?详细解释闭包的概念、形成原因、作用及与作用域、垃圾回收机制的关系
闭包是 JavaScript 中一个强大的工具,允许函数记住并访问其外部环境的变量。这种特性使得闭包在数据封装、异步编程和函数柯里化等场景中非常有用。然而,闭包的使用也需要小心,避免内存泄漏和不必要的内存占用。理解闭包的概念、形成原因以及与作用域和垃圾回收的关系,将有助于更有效地编写和优化 JavaScript 代码。
2024-11-04 13:32:28
698
原创 数据双向绑定原理的详细解释
响应式数据系统:通过或Proxy实现对数据的劫持,并收集依赖数据的Watcher。视图自动更新:当数据变化时,触发 setter,通知Watcher更新视图。事件监听机制:通过input等事件监听,捕获用户输入并将其同步到数据,实现视图到数据的更新。Vue 的双向绑定通过结合响应式数据和事件监听,使得视图和数据之间的同步更新成为可能,实现了数据驱动视图和视图驱动数据的自动化。
2024-11-03 21:01:05
686
原创 ==,===,Object.is的区别
=:会进行类型转换,可能导致意外结果。===:严格比较,不进行类型转换。Object.is:更严格的比较方法,处理NaN和+0-0的情况。通常推荐使用===或Object.is进行比较,以避免由于隐式转换引起的潜在错误。
2024-10-29 16:16:35
368
原创 js中的类型转换原理
内置的转换函数:如String()Number()Boolean(), 以及对象的toString()和valueOf()方法。规则和特性:隐式转换遵循特定的规则,例如在执行运算时优先使用字符串或数字转换,并在布尔上下文中自动转换为布尔值。灵活性:JavaScript 是一种动态类型语言,允许在运行时进行类型转换,这使得开发者在编写代码时更灵活,但也可能导致意外行为。
2024-10-29 15:21:56
472
原创 css-元素居中方式
Flexbox 是一种现代的布局方法,可以轻松实现居中。绝对定位也可以用来实现居中,但需要设置父元素为相对定位。CSS Grid 也是一种强大的布局工具,适合居中。来实现水平居中,配合设置高度实现垂直居中。根据具体情况选择适合的居中方法。如果内容是单行文本,可以利用。对于块级元素,可以使用。
2024-10-27 18:37:24
416
原创 css-画一个三角形
* 底边边框的颜色(可更改为需要的颜色) */border-right: 50px solid transparent;/* 右边边框 */border-left: 50px solid transparent;/* 左边边框 */1.必须时一个块级元素。
2024-10-27 18:18:14
437
原创 结果输出---闭包
闭包会“记住”它定义时所处的作用域链,并优先使用最近的作用域中的变量。this 是执行上下文中的一个属性,它指向最后一次调用这个方法的对象。
2024-10-27 18:09:43
165
原创 当面试官让我们聊聊JavaScript的继承,我们应该怎么回答呢?
子类的prototype属性是引用类型,一修改,全部改变。子类继承父类的引用类型属性都是继承了该引用类型属性的引用地址,简单来说就是子类操作的引用类型属性并不是它自己的,而是操作了父类的,虽然子类可以访问继承的引用类型属性,但是不是只属于自己的,而是所有子类共享的,只要一个子类操作了它,所有子类访问的都是被操作后的。ES6类继承的底层原理就是寄生组合式继承,是通过封装寄生组合式继承而来的。这就是原型链继承的典型示例。
2024-10-17 16:11:53
685
原创 虚拟局域网(VLAN)
虚拟局域网(VLAN)的 ID 是用于标识同一 VLAN 中设备的数字标签。VLAN 的作用是在同一个物理网络设备(如交换机)上,将不同的设备分隔成逻辑上的多个局域网。不同 VLAN 的设备无法直接通信,除非通过路由器或三层交换机。这种技术提高了网络的安全性、管理性和效率。
2024-10-16 15:39:42
1744
原创 express和koa的区别
特性ExpressKoa设计理念简单易用,适合快速开发轻量、现代化,灵活性更高异步处理使用回调函数,支持 Promise 和 async/await完全支持 async/await中间件机制传统中间件机制,简单但庞大洋葱模型,增强中间件控制能力路由支持内置路由功能需要使用外部中间件(如 koa-router)错误处理通过 next(err) 传递错误直接使用 try/catch,优雅处理错误社区与生态社区活跃,有丰富的插件社区相对小,但在快速发展性能。
2024-10-06 20:38:30
1269
原创 什么是 Koa?
Koa 是一个轻量级、高效的 Node.js 框架,通过中间件机制来构建 Web 应用或 API。它支持现代 JavaScript 特性,如,使得异步代码编写更加简洁。由于 Koa 不自带很多功能模块,开发者可以自由选择和组合中间件来完成具体功能,使得 Koa 拥有很高的灵活性。Koa 适合需要更多灵活控制、现代化 JavaScript 开发的场景,例如高并发的 API 服务。
2024-10-06 20:08:14
1263
原创 在 Koa 中,中间件函数的参数ctx是什么?
ctx是 Koa 中用来在请求和响应之间传递信息的对象。通过它,开发者可以很方便地访问请求的各类信息并设置响应。
2024-10-06 19:55:40
511
原创 css3-----2D转换、动画
转换transform 我们简单理解就是变形 有2D 和 3D 之分 我们暂且学了三个 分别是 位移 旋转 和 缩放 2D 移动 translate(x, y) 最大的优势是不影响其他盒子, 里面参数用%,是相对于自身宽度和高度来计算的 可以分开写比如 translateX(x) 和 translateY(y) 2D 旋转 rotate(度数) 可以实现旋转元素 度数的单位是deg 2D 缩放 sacle(x,y) 里面参数是数字 不跟单位 可以是小数 最大的优势 不影响其他盒子。
2024-10-01 16:29:37
853
1
原创 浏览器预解析机制
虽然预解析线程可以提前下载资源,但不会执行 JavaScript,它只负责提前获取文件,以减少主线程在解析到这些资源时的等待时间。虽然预解析线程帮助提前下载外部资源,确实提高了效率,但。
2024-10-01 16:17:47
513
原创 外部引入的 JavaScript 放置位置
最佳实践是将外部 JavaScript 文件放在<body>底部,以确保页面内容快速加载,避免阻塞 HTML 解析。如果希望放在<head>中,可以使用 defer属性来确保 JavaScript 不阻塞页面加载,同时保证脚本在 DOM 完全解析后才执行。使用 async属性适合不依赖 DOM 或其他脚本的独立脚本,能够进一步优化页面加载性能。
2024-10-01 15:47:26
914
原创 vue的基本原理
响应式系统确保数据变化自动更新视图。虚拟 DOM通过高效的 diff 算法,提升了 DOM 操作性能。模板编译把模板编译成渲染函数,生成虚拟 DOM。组件化系统提供了模块化开发,支持父子组件通信、生命周期管理等。指令系统提供了简洁的模板语法,实现数据和视图的绑定。生命周期钩子允许开发者在不同阶段执行自定义逻辑。
2024-09-19 11:07:45
964
原创 vue框架和react框是什么,有什么区别和共性吗?
Vue是一个渐进式JavaScript框架,主要用于构建用户界面。它遵循MVVM(Model-View-ViewModel)模式,通过数据绑定和组合的视图组件来实现响应式的数据渲染。组件化:Vue鼓励通过可复用的组件来构建应用,这有助于保持代码的模块化和可维护性。指令系统:Vue提供了一套丰富的指令(如v-bind、v-model、v-if等),这些指令可以方便地操作DOM,实现数据的双向绑定和条件渲染等功能。插件化。
2024-09-16 16:16:08
313
原创 数据大屏的适配问题,为什么选择scale,优点是什么?为什么不选择其他的方法?
选择scale作为数据大屏的适配方式,是因为它能够高效、简单地保证所有页面内容按比例缩放,且保持设计的一致性,特别适合需要展示大量图表、文字以及动态内容的场景。相比其他方法,scale在保持页面比例和快速适配方面具有明显的优势,而其他方法要么维护成本高、要么适用性较低,无法应对复杂的大屏展示需求。
2024-09-11 15:05:53
806
原创 箭头函数跟普通函数的区别
箭头函数提供了更简洁的语法,并且在this绑定、构造函数以及arguments对象方面有不同的行为。它们适用于需要词法作用域的场景,如回调函数和事件处理程序。普通函数提供了传统的函数功能,能够动态绑定this,作为构造函数使用,并且支持arguments对象。适用于需要这些功能的场景。
2024-09-07 15:39:57
436
原创 map跟set的区别和共性
Map是键值对集合,适用于需要存储和操作键值对的场景,支持任何类型的键。Set是唯一值的集合,适用于需要保证值唯一的场景,主要存储单一类型的值。两者都有用于存储和操作数据的特性,但其用途和操作方式根据实际需求的不同而有所区别。
2024-09-06 22:27:03
491
原创 vue3和vue2的双向绑定原理
Vue 2使用来实现响应式数据,通过 getter 和 setter 机制拦截数据操作,结合数据绑定指令(如v-model)实现双向绑定。Vue 3使用Proxy来实现响应式系统,提供了更全面和高效的响应式能力。同时,v-model的实现也进行了改进,支持更多功能和自定义选项。Vue 3 的响应式系统和双向绑定机制在性能和灵活性上都有显著提升,使得 Vue 3 在处理复杂数据绑定和响应式逻辑时表现更加优秀。
2024-09-06 22:24:42
1159
原创 Vue2 中对数组进行操作时需要注意什么
在 Vue 2 中,对数组进行操作时,关键是确保操作能够被 Vue 的响应式系统检测到。使用 Vue 的响应式 API,如Vue.set或this.$set,可以确保数组的变化会被正确地反映到视图中。此外,避免直接修改数组的length属性或使用数组索引直接赋值,以确保视图的响应性。
2024-09-06 22:20:29
927
原创 Vue2 与 Vue3 的区别有哪些
Vue 3 在性能、功能、API 设计等方面相比 Vue 2 都有显著改进和优化。它提供了更高效的响应式系统、更灵活的组件逻辑管理、更强大的 TypeScript 支持等功能,使得开发者可以更高效地构建现代化的 Web 应用。
2024-09-06 22:14:43
974
原创 Vue 中 nextTick 的最主要作用是什么,为什么要有这个 API
nextTick是 Vue 提供的一个重要 API,用于在 DOM 更新完成后执行特定的逻辑。它解决了异步 DOM 更新带来的问题,使得代码可以在数据变化后正确地处理和访问 DOM,从而提高了 Vue 应用的稳定性和响应能力。
2024-09-06 22:14:18
692
原创 Flexbox
Flexbox(弹性布局)是 CSS3 的一套布局模式,用于在容器中分配空间并对齐内容,特别是当大小不确定或者容器的空间是动态的时。它非常适合处理复杂的布局要求,如响应式设计和中心对齐等。
2024-09-06 22:06:56
481
原创 http和https区别
HTTP(超文本传输协议)和 HTTPS(安全超文本传输协议)是用于在互联网上传输数据的协议。简而言之,HTTPS 提供了更高的安全性,保护用户的数据不被窃取或篡改,而 HTTP 则不提供这种保护。
2024-09-06 22:01:28
2167
原创 vue更新的细粒度
Vue 的细粒度更新通过响应式系统、虚拟 DOM 和异步更新机制,确保只更新那些真正需要更新的部分,从而大大提高了性能。了解和利用这些机制可以帮助你构建更加高效、响应迅速的 Vue 应用。
2024-08-18 16:01:15
613
原创 webpack中1个文件修改会全部更新吗
在开发模式下,Webpack 通过 HMR 只更新受影响的模块,不会更新整个应用。在生产模式下,Webpack 通过代码分割和缓存,只重新打包受影响的 chunk,而不重新打包整个项目。因此,Webpack 修改一个文件后并不会导致整个项目的所有文件都被重新更新或重新打包。它有很多优化手段来尽可能减少构建时间和输出文件的更新量。
2024-08-18 15:55:52
690
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人