自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(60)
  • 收藏
  • 关注

原创 我落地的一个最美博客

为了美观,本网站大量使用图片,因此对网络具有一定要求。留言分为访客和登录用户,对于访客而言,只能在大屏发弹幕,登录用户可以在弹幕下方留言。来欣赏下我们的音乐厅吧,想听更多音乐吗,请去往博主的另一个开源项目。文章具有分类和标签,分类作为一级目录,分类下面可以有多个标签。

2024-04-07 15:14:17 258 1

原创 如何禁用 el-table 单独某一行,修改某一行样式等(最有效)

【代码】如何禁用 el-table 单独某一行,修改某一行样式等(最有效)

2024-01-26 11:34:34 707

原创 npm i 报错 npm ERR! code CERT_HAS_EXPIRED npm ERR! errno CERT_HAS_EXPIRED

【代码】npm i 报错 npm ERR!

2024-01-22 23:30:51 1336

原创 node笔记

我为什么要保存这可恶的session呢, 只让每个客户端去保存该多好?当然, 如果一个人的token 被别人偷走了, 那我也没办法, 我也会认为小偷就是合法用户, 这其实和一个人的session id 被别人偷走是一样的。这样一来, 我就不保存session id 了, 我只是生成token , 然后验证token , 我用我的CPU计算时间获取了我的session 存储空间!

2023-12-09 21:06:14 362

原创 请阐述keep-alive组件的作用和原理

这样做的目的在于,keep-alive内部的组件切回时,不用重新创建组件实例,而直接使用缓存中的实例,一方面能够避免创建组件带来的开销,另一方面可以保留组件的状态。另外它还提供了max属性,通过它可以设置最大缓存数,当缓存的实例超过该数时,vue会移除最久没有使用的组件缓存。在keep-alive的渲染函数中,其基本逻辑是判断当前渲染的vnode是否有对应的缓存,如果有,从缓存中读取到对应的组件实例;key数组记录目前缓存的组件key值,如果组件没有指定key值,则会为其自动生成一个唯一的key值。

2023-09-28 10:13:30 174

原创 computed和methods有什么区别

它会遍历computed配置中的所有属性,为每一个属性创建一个Watcher对象,并传入一个函数,该函数的本质其实就是computed配置中的getter,这样一来,getter运行过程中就会收集依赖。当读取计算属性时,vue检查其对应的Watcher是否是脏值,如果是,则运行函数,计算依赖,并得到对应的值,保存在Watcher的value中,然后设置dirty为false,然后返回。巧妙的是,在依赖收集时,被依赖的数据不仅会收集到计算属性的Watcher,还会收集到组件的Watcher。

2023-09-28 10:11:11 140

原创 生命周期详解

如果遇到创建一个组件的vnode,则会进入组件实例化流程,该流程和创建vue实例流程基本相同,最终会把创建好的组件实例挂载vnode的。函数,由于目前没有旧树,因此直接为当前的虚拟dom树的每一个普通节点生成elm属性,即真实dom。函数的过程中,会去掉之前的依赖,重新收集所有依赖,将来依赖变化时会重新运行。中运行,也就是微队列中,这样是为了避免多个依赖的数据同时改变后被多次执行。函数的过程中,会收集所有依赖,将来依赖变化时会重新运行。,如果没有,使用运行时编译器,把模板编译为。均会重新运行,这里仅考虑。

2023-09-28 10:09:52 103

原创 diff算法面试题

在对比其子节点数组时,vue对每个子节点数组使用了两个指针,分别指向头尾,然后不断向中间靠拢来进行对比,这样做的目的是尽量复用真实dom,尽量少的销毁和创建真实dom。具体来说,首先对根节点进行对比,如果相同则将旧节点关联的真实dom的引用挂到新节点上,然后根据需要更新属性到真实dom,然后再对比其子节点数组;当组件创建和更新时,vue均会执行内部的update函数,该函数使用render函数生成的虚拟dom树,将新旧两树进行对比,找到差异点,最终更新到真实dom。「相同」,进入**「更新」流程**

2023-09-28 10:06:47 188

原创 数据响应式原理

面试题:请阐述vue2响应式原理vue官方阐述:https://cn.vuejs.org/v2/guide/reactivity.html,是当对象本身或对象属性发生变化时,将会运行一些函数,最常见的就是render函数。在具体实现上,vue用到了。

2023-09-28 10:04:15 204

原创 v-model

即可以作用于表单元素,又可作用于自定义组件,无论是哪一种情况,它都是一个语法糖,最终会生成一个属性和一个事件。会根据作用的表单元素类型而生成合适的属性和事件。例如,作用于普通文本框的时候,它会生成。事件,而当其作用于单选框或多选框时,它会生成。,默认情况下,它会生成一个。配置来改变生成的属性和事件。也可作用于自定义组件,开发者可以通过组件的。

2023-09-28 10:02:03 306

原创 组件通信总结

面试题:vue组件之间有哪些通信方式?

2023-09-28 09:59:07 48

原创 虚拟DOM详解

如果一个组件受响应式数据变化的影响,需要重新渲染时,它仍然会重新调用render函数,创建出一个新的虚拟dom树,用新树和旧树对比,通过对比,vue会找到最小更新量,然后更新必要的虚拟dom节点,最后,这些更新过的虚拟节点,会去修改它们对应的真实dom。在一个组件实例首次被渲染时,它先生成虚拟dom树,然后根据虚拟dom树创建真实dom,并把真实dom挂载到页面中合适的位置,此时,每个虚拟dom便会对应一个真实的dom。在渲染时,使用虚拟dom来替代真实dom,主要为解决渲染效率的问题。

2023-09-28 09:54:37 131

原创 前端工程化面试题

工程化的出现,就是为了解决这一矛盾,它可以让我们舒服的在开发环境中书写代码,然后经过打包,生成最合适的生产环境代码,这样就解放了开发者的精力,让开发者把更多的注意力集中在开发环境上即可。在开发项目时,让项目依赖模块的主版本,因此,当模块更新时,只要不是主版本更新,项目都可以非常方便的升级模块版本,无须改动任何代码。组件化开发是一些前端框架带来的概念,它把一个网页,或者一个站点,甚至一个完整的产品线,划分为多个小的组件,组件是一个可以复用的单元,它包含了一个某个区域的完整功能。

2023-09-19 13:32:55 561

原创 CommonJS和ES Module

export 为普通导出,又叫做具名导出,顾名思义,它导出的数据必须带有命名,比如变量定义、函数定义这种带有命名的语句。在导出的模块对象中,命名即为模块对象的属性名。export default 为默认导出,在模块对象中名称固定为 default,因此无须命名,通常导出一个表达式或字面量。在一个模块中只能有一个默认导出。export 和 export default 的区别是什么?commonjs 和 es6 模块的区别是什么?静态依赖:在代码运行前就要确定依赖关系。下面的模块导出了什么结果?

2023-09-19 13:28:32 357

原创 网络面试题汇总

在查询域名时,客户端会先检查自身的 DNS 映射表,若找不到解析记录,则使用用户配置的 DNS 服务器,若目标 DNS 服务器中找不到记录,则继续往上一个层级寻找,直到到达根域名服务器,根域名服务器会根据域名的类型,将解析任务分发到对应的子域名服务器依次查找,直到找到解析记录为止。公钥指的是公共的密钥,任何人都可以获得该密钥。攻击者利用站点的漏洞,在表单提交时,在表单内容中加入一些恶意脚本,当其他正常用户浏览页面,而页面中刚好出现攻击者的恶意脚本时,脚本被执行,从而使得页面遭到破坏,或者用户信息被窃取。

2023-09-17 11:57:34 202

原创 HTTP各版本差异

HTTP1.0为每个请求单独新开一个TCP连接fill:#333;TCP三次握手,建立连接请求响应TCP四次挥手,销毁连接TCP三次握手,建立连接请求响应TCP四次挥手,销毁连接由于每个请求都是独立的连接,因此会带来下面的问题:连接的建立和销毁都会占用服务器和客户端的资源,造成内存资源的浪费连接的建立和销毁都会消耗时间,造成响应时间的浪费无法充分利用带宽,造成带宽资源的浪费TCP协议的特点是「慢启动」,即一开始传输的数据量少,一段时间之后达到传输的峰值。

2023-09-17 11:55:23 695 1

原创 SSL、TLS、HTTPS的关系

SSL(Secure Sockets Layer),安全套接字协议TLS(Transport Layer Security),传输层安全性协议HTTPS(Hyper Text Transfer Protocol over SecureSocket Layer),建立在SSL协议之上的HTTP协议。

2023-09-17 11:53:43 603 2

原创 网络性能优化

利用 CDN 可以大幅缩减静态资源的访问时间,特别是对于公共库的访问,可以使用知名的 CDN 资源,这样可以实现跨越站点的缓存。现代浏览器普遍支持压缩格式,因此服务端的各种文件可以压缩后再响应给客户端,只要解压时间小于优化的传输时间,压缩就是可行的。利用一些打包插件,针对不同的浏览器打包出不同的兼容性版本,这样一来,每个版本中的兼容性代码就会大大减少,从而减少包体积。对于不使用 HTTP2 的场景,将相对独立的静态资源分到多个域中保存,可以让浏览器同时开启多个 TCP 连接,并行下载。

2023-09-17 11:51:19 64

原创 XSS攻击

XSS(Cross Site Scripting,跨站脚本攻击),是指攻击者利用站点的漏洞,在表单提交时,在表单内容中加入一些恶意脚本,当其他正常用户浏览页面,而页面中刚好出现攻击者的恶意脚本时,脚本被执行,从而使得页面遭到破坏,或者用户信息被窃取。

2023-09-17 11:48:50 79

原创 CSRF攻击

CSRF(Cross-site request forgery,跨站请求伪造)它是指攻击者利用了用户的身份信息,执行了用户非本意的操作。

2023-09-17 11:46:37 60

原创 TCP协议

在TCP协议中,任何时候、任何一方都可以主动发送数据给另一方发送方如果长时间没有收到确认数据报(ACK=1),则会判定丢失或者是错误,然后重发。

2023-09-17 11:45:07 203

原创 输入url地址后

在浏览器地址栏输入地址,并按下回车键后,发生了哪些事情?

2023-09-17 11:42:16 66

原创 JWT~~

jwt本质上是一种令牌格式。它和终端设备无关,同样和服务器无关,甚至与如何传输无关,它只是规范了令牌的格式而已jwt由三部分组成:header、payload、signature。主体信息在payloadjwt难以被篡改和伪造。这是因为有第三部分的签名存在。

2023-09-17 11:36:47 52

原创 常见请求方法

上面的请求中,我们使用了自定义方法heiheihei。虽然百度服务器无法理解这样的请求是在干什么,但这样的请求也是可以正常发送到百度服务器的。

2023-09-17 11:32:51 80

原创 五层网络模型

当遇到一个复杂问题的时候,可以使用分层的思想把问题简单化比如,你有半杯82年的可乐,想分享给你的朋友王富贵,但你们已经10年没有联系了。要完成这件事,你可能要考虑:我用什么装可乐?可能的方案:塑料瓶、玻璃瓶、煤气罐怎么保证可乐始终处于低温?可能的方案:保温杯、小冰箱、冰盒如何保证可乐不被运输的人偷喝?可能的方案:封条、在上面写「毒药」如何获取王富贵的地址?可能的方案:报案失踪、联系私人侦探、联系物流公司的朋友如何运输?可能的方案:自行车、汽车、火车、高铁、飞机、火箭。

2023-09-17 11:28:36 58

原创 Promise的链式调用

若没有相关的后续处理,新任务的状态和前任务一致,数据为前任务的数据。后续执行后返回的是一个任务对象,新任务的状态和数据与该任务对象一致。后续处理执行无错,新任务的状态为完成,数据为后续处理的返回值。若后续处理执行了,则根据后续处理的情况确定新任务的状态。后续处理执行有错,新任务的状态为失败,数据为异常对象。由于链式任务的存在,异步代码拥有了更强的表达力。then方法必定会返回一个新的Promise。若有后续处理但还未执行,新任务挂起。后续处理也是一个任务。

2023-09-16 14:21:57 208

原创 Promise的面试题考点

then方法必定会返回一个新的Promise可理解为后续处理也是一个任务新任务的状态取决于后续处理:若没有相关的后续处理,新任务的状态和前任务一致,数据为前任务的数据若有后续处理但还未执行,新任务挂起。若后续处理执行了,则根据后续处理的情况确定新任务的状态。

2023-09-16 14:20:03 156

原创 函数防抖和节流

JavaScript中的函数大多数情况下都是由用户主动调用触发的,除非是函数本身的实现不合理,否则一般不会遇到跟性能相关的问题。但是在一些少数情况下,函数的触发不是由用户直接控制的。在这些场景下,函数有可能被非常频繁地调用,而造成大的性能问题。解决性能问题的处理办法就有函数防抖和函数节流。下面是函数被频繁调用的常见的几个场景:mousemove事件:如果要实现一个拖拽功能,需要一路监听mousemove事件,在回调中获取元素当前位置,然后重置DOM的位置来进行样式改变。

2023-09-16 14:15:09 69

原创 函数柯里化

在计算机科学中,柯里化(英语:Currying),又译为卡瑞化或加里化,是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数而且返回结果的新函数的技术。这个技术由克里斯托弗·斯特雷奇以逻辑学家哈斯凯尔·加里命名的,尽管它是和戈特洛布·弗雷格发明的。在直觉上,柯里化声称如果你固定某些参数,你将得到接受余下参数的一个函数。我们姑且叫它返回函数,在调用返回函数的时候,它将判断当前的参数和之前被柯里化函数固定的参数拼起来之后,是否达到了原本函数的参数个数。

2023-09-16 14:11:51 50

原创 深浅拷贝详解

在堆中重新分配内存,并且把源对象所有属性都进行新建拷贝,以保证深拷贝的对象的引用图不包含任何原有对象或对象图上的任何对象,拷贝后的对象与原来的对象是完全隔离,互不影响。:在堆中重新分配内存,并且把源对象所有属性都进行新建拷贝,以保证深拷贝的对象的引用图不包含任何原有对象或对象图上的任何对象,拷贝后的对象与原来的对象是完全隔离,互不影响。方法把字符串解析成对象,一去一来,新的对象产生了,而且对象会开辟新的栈,实现深拷贝。当对象的属性值对应的是一个对象时,该方法拷贝的是对象的属性的引用,而不是对象本身。

2023-09-16 14:07:27 59

原创 DOM 事件的传播机制

DOMDOM。

2023-09-07 16:00:25 58

原创 详解js闭包

闭包,是JavaScript中一个非常重要的知识点,也是我们前端面试中较高几率被问到的知识点之一。打开《JavaScript高级程序设计》和《JavaScript权威指南》,会发现里面针对闭包的解释各执一词,在网络上搜索关于闭包的内容,也发现众说纷纭,这就导致了这个知识点本身显得有点神秘,甚至还有一点玄幻。那么这个知识点真的有那么深奥么?非也!其实要理解JavaScript中的闭包,非常容易,但是在此之前你需要先知道以下两个知识点:JavaScript中的作用域和作用域链。

2023-09-07 15:58:42 34

原创 js包装类型

JavaScript。

2023-09-07 15:55:59 33

原创 垃圾回收与内存泄漏

程序的运行需要内存。只要程序提出要求,操作系统或者运行时(runtime)就必须供给内存。对于持续运行的服务进程(daemon),必须及时释放不再用到的内存。否则,内存占用越来越高,轻则影响系统性能,重则导致进程崩溃。也就是说,不再用到的内存,如果没有及时释放,就叫做内存泄漏(JavaScript。

2023-09-07 15:53:52 35

原创 this 指向

this关键字是一个非常重要的语法点。毫不夸张地说,不理解它的含义,大部分开发任务都无法完成。this可以用在构造函数之中,表示实例对象。除此之外,this还可以用在别的场合。但不管是什么场合,this都有一个共同点:它总是返回一个对象。关于this的指向,有一种广为流传的说法就是“谁调用它,this就指向谁”。这样的说法没有太大的问题,但是并不是太全面。总结起来,this的指向规律有如下几条:在函数体中,非显式或隐式地简单调用函数时,在严格模式下,函数内的this。

2023-09-07 15:51:39 96

原创 作用域和作用域链

作用域是在运行时代码中的某些特定部分中变量,函数和对象的可访问性。换句话说,作用域决定了代码区块中变量和其他资源的可见性。var inVariable = "内层变量2";outFun2();从上面的例子可以体会到作用域的概念,变量inVariable在全局作用域没有声明,所以在全局作用域下取值会报错。作用域就是一个独立的地盘,让变量不会外泄、暴露出去。也就是说作用域最大的用处就是隔离变量,不同作用域下同名变量不会有冲突。ES6之前JavaScript。

2023-09-07 15:47:57 24

原创 执行栈和执行上下文

这里有必要说一下变量对象。当处于执行上下文的建立阶段时,我们可以将整个上下文环境看作是一个对象。该对象拥有3。

2023-09-07 15:44:54 31

原创 原型和原型链

在设计JavaScript时,借鉴了Self和Smalltalk这两门基于原型的语言。之所以选择基于原型的对象系统,是因为一开始就没有打算在JavaScript中加入类的概念,因为JavaScript的设计初衷就是为非专业的开发人员(例如网页设计者)提供一个方便的工具。由于大部分网页设计者都没有任何的编程背景,所以在设计JavaScript时也是尽可能使其简单、易学。这因为如此,JavaScript。

2023-09-07 15:42:34 31

原创 运算符讲解

加法运算符是在运行时决定,到底是执行相加,还是执行连接。也就是说,运算子的不同,导致了不同的语法行为,这种现象称为“重载”(overload)。由于加法运算符存在重载,可能执行两种运算,使用的时候必须很小心。

2023-09-07 15:39:52 31

原创 数据类型的转换

JavaScript是一种动态类型语言,变量没有类型限制,可以随时赋予任意值。var x = y?1 : 'a';上面代码中,变量x到底是数值还是字符串,取决于另一个变量y的值。y为true时,x是一个数值;y为false时,x是一个字符串。这意味着,x的类型没法在编译阶段就知道,必须等到运行时才能知道。虽然变量的数据类型是不确定的,但是各种运算符对数据类型是有要求的。如果运算符发现,运算子的类型与预期不符,就会自动转换类型。

2023-09-07 15:30:52 23

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除