- 博客(64)
- 收藏
- 关注
RSS订阅原创 vue3 响应式 Ref和Reactive 中的一些细节
但是下面因为没有解包，意味着 object.id 仍然是一个对象，因此最终计算的结果为 [object Object]1。DOM的更新不是同步的*,这意味这当响应式数据发生改变之后,我们去获取DOM值,拿到的还是之前的DOM值。例如我们在模板中各自加 1 就会发现上面因为已经解包出来了，所以能够正常的进行表达式的计算。上面的例子，感觉非顶级的 Ref 好像也能够正常渲染出来，仿佛也是自动解包了的。在模板里面，只有顶级的 ref 才会自动解包。响应式数据的更新*(响应式数据更新是同步的)
2024-07-24 21:50:24
247
原创 vue面试题汇总之响应式理解
vue在全局中写了一个用来运行函数的函数,有一个全局变量保存当前运行的是哪个函数,这样在getter的时候只要检查这个全局变量就知道是哪个函数在使用这个变量了,vue还建立了一个对映关系表当setter的时候把对映表中的函数重新运行一遍。vue2使用Object.defineProperty进行数据代理(getter和setter),vue3使用Proxy进行数据代理。会把函数放入异步队列,同一个渲染函数只会存在一个,这样就不会多次渲染造成效率问题。,当需要派发更新的时候不会立即运行函数,而是交给。
2024-06-12 17:51:51
558
3
原创 vue面试题汇总之什么是虚拟dom
如果一个组件受响应式数据变化的影响，需要重新渲染时，它仍然会重新调用render函数，创建出一个新的虚拟dom树，用新树和旧树对比，通过对比，vue会找到最小更新量，然后更新必要的虚拟dom节点，最后，这些更新过的虚拟节点，会去修改它们对应的真实dom。在一个组件实例首次被渲染时，它先生成虚拟dom树，然后根据虚拟dom树创建真实dom，并把真实dom挂载到页面中合适的位置，此时，每个虚拟dom便会对应一个真实的dom。在渲染时，使用虚拟dom来替代真实dom，主要为解决渲染效率的问题。
2024-06-12 14:25:48
218
原创 计算机网络之crc循环冗余校验、子网划分、rip协议路由转发表、时延计算、香浓定理 奈氏准则、TCP超时重传 RTO
crc循环冗余校验异或运算 : 相同得0,相异得1从多项式获取除数在原数据的末端补0 , 0的个数等于最高次项的阶数子网划分子网掩码：用于识别IP地址中的网络号和主机号的位数表示方式：32位二进制数字，在子网掩码中，对应于网络号部分用“1”表示，主机号部分用“0”表示。如IP地址1.1.1.1的子网掩码是255.0.0.0，表示这个地址的前8位是网络号网络后缀法表示子网掩码，即“/”，如138.96.0.1/18表示网络号18位，主机号14位STEP1STEP2确认子网掩码。
2024-06-04 20:44:00
628
原创 js知识点之深浅拷贝
首先，我们需要明确深拷贝和浅拷贝的概念。：只是拷贝了基本类型的数据，而引用类型数据，复制后也是会发生引用，我们把这种拷贝叫做浅拷贝(浅复制)。浅拷贝只复制指向某个对象的指针（引用地址），而不复制对象本身，新旧对象还是共享同一块内存。：在堆中重新分配内存，并且把源对象所有属性都进行新建拷贝，以保证深拷贝的对象的引用图不包含任何原有对象或对象图上的任何对象，拷贝后的对象与原来的对象是完全隔离，互不影响。
2024-06-04 19:27:32
866
原创 js知识点之函数柯里化
在计算机科学中，柯里化（英语：Currying），又译为卡瑞化或加里化，是把接受多个参数的函数变换成接受一个单一参数（最初函数的第一个参数）的函数，并且返回接受余下的参数而且返回结果的新函数的技术。这个技术由克里斯托弗·斯特雷奇以逻辑学家哈斯凯尔·加里命名的，尽管它是和戈特洛布·弗雷格发明的。在直觉上，柯里化声称如果你固定某些参数，你将得到接受余下参数的一个函数。我们姑且叫它返回函数，在调用返回函数的时候，它将判断当前的参数和之前被柯里化函数固定的参数拼起来之后，是否达到了原本函数的参数个数。
2024-06-04 17:28:14
599
原创 js知识点之函数防抖和节流
JavaScript中的函数大多数情况下都是由用户主动调用触发的，除非是函数本身的实现不合理，否则一般不会遇到跟性能相关的问题。但是在一些少数情况下，函数的触发不是由用户直接控制的。在这些场景下，函数有可能被非常频繁地调用，而造成大的性能问题。解决性能问题的处理办法就有和。下面是函数被频繁调用的常见的几个场景：mousemove事件：如果要实现一个拖拽功能，需要一路监听mousemove事件，在回调中获取元素当前位置，然后重置DOM的位置来进行样式改变。
2024-06-03 19:31:31
614
原创 js知识点之严格模式
严格模式是从ES5开始新增的一种方式，是采用具有限制性JavaScript变体的一种方式，从而使代码隐式地脱离“马虎模式/稀松模式/懒散模式“（sloppy）模式。JavascriptJavascript“严格模式”体现了Javascript更合理、更安全、更严谨的发展方向，支持严格模式的浏览器有：。在“严格模式下”，同样的代码，可能会有不一样的运行结果。一些在“正常模式”下可以运行的语句，在“严格模式”下将不能运行。掌握这些内容，有助于更细致深入地理解Javascript。
2024-06-03 18:52:32
759
原创 js知识点之浮点数精度问题
在JavaScript中整数和浮点数都属于number数据类型，所有数字都是以64位浮点数形式储存，即便整数也是如此。所以我们在打印1.00这样的浮点数的结果是1而非1.00。在一些特殊的数值表示中，例如金额，这样看上去有点别扭，但是至少值是正确了。：进行浮点值运算结果的判断：将小数乘以10的n次方取整比如将钱币的单位，从元转化成分，经常写出来的是：四舍五入保留n位小数例如我们会写出在上面的例子中，我们得出的结果是1.33，而不是预期结果1.34。
2024-06-03 18:21:05
712
原创 js知识点之 class 和构造函数区别和new关键字到底做了什么
1. 创建了一个新的对象，2. 将新对象的\_\_proto\_\_函数指向构造函数的prototype，这个新对象就可以访问构造函数原型上的属性3. 将this指向改变，指向新的对象，这样就可以访问构造函数内部的属性4. 返回新的对象
2024-05-30 15:32:58
799
原创 js知识点之递归
递归调用是一种特殊的调用形式，指的是方法自己调用自己的形式。method会先输出然后再调用自己，导致无限递归（当然这一般是我们需要避免的状况。下面是递归的一个示例，求某个数的阶乘。使用递归时需要注意如下事项：递归函数的优点是定义简单，逻辑清晰。理论上，所有的递归函数都可以用循环的方式来实现。使用递归时需要注意防止栈溢出。在计算机中，函数调用是通过栈（stack）这种数据结构实现的，每当一个函数调用，栈就会加一层，每当函数返回，栈就会减一层。
2024-05-30 11:10:12
254
原创 js知识点之阻止事件默认行为
所谓默认行为，一般是指HTML元素所自带的行为。例如点击一个a在上面的代码中，设置了a元素的href属性指向百度，当用户点击该a元素时，就会跳转至百度。上面的代码中我们书写了一个form元素，该元素有一个action属性，指的是表单内容要提交的地址。而当用户点击表单元素中嵌套的提交按钮时，就会进行一个默认的提交操作。这些，就是HTML元素中的默认行为。但是有些时候，我们是不需要这些默认行为的，例如，用户在填写了一个表单后，提交信息时我们采用ajax。
2024-05-30 11:09:39
791
原创 js知识点之DOM事件的传播机制
*IE* 的事件流叫做事件冒泡（*event bubbling*），即事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到较为不具体的节点（文档）。
2024-05-30 10:39:37
561
原创 js知识点之闭包
闭包，是JavaScript中一个非常重要的知识点，也是我们前端面试中较高几率被问到的知识点之一。打开《JavaScript高级程序设计》和《JavaScript权威指南》，会发现里面针对闭包的解释各执一词，在网络上搜索关于闭包的内容，也发现众说纷纭，这就导致了这个知识点本身显得有点神秘，甚至还有一点玄幻。那么这个知识点真的有那么深奥么？非也！其实要理解JavaScript中的闭包，非常容易，但是在此之前你需要先知道以下两个知识点：JavaScriptJavaScript。
2024-05-29 20:17:54
1191
原创 js知识点之垃圾回收与内存泄漏
程序的运行需要内存。只要程序提出要求，操作系统或者运行时（runtime）就必须供给内存。对于持续运行的服务进程（daemon），必须及时释放不再用到的内存。否则，内存占用越来越高，轻则影响系统性能，重则导致进程崩溃。也就是说，不再用到的内存，如果没有及时释放，就叫做内存泄漏（JavaScript。
2024-05-29 19:48:29
674
原创 js知识点总结之this指向
this关键字是一个非常重要的语法点。毫不夸张地说，不理解它的含义，大部分开发任务都无法完成。this可以用在构造函数之中，表示实例对象。除此之外，this还可以用在别的场合。但不管是什么场合，this都有一个共同点：它总是返回一个对象。关于this的指向，有一种广为流传的说法就是“谁调用它，this就指向谁”。这样的说法没有太大的问题，但是并不是太全面。总结起来，this的指向规律有如下几条：在函数体中，非显式或隐式地简单调用函数时，在严格模式下，函数内的this。
2024-05-29 19:36:44
1420
原创 js知识点汇总之数据类型转换
JavaScript是一种动态类型语言，变量没有类型限制，可以随时赋予任意值。上面代码中，变量x到底是数值还是字符串，取决于另一个变量y的值。y为true时，x是一个数值；y为false时，x是一个字符串。这意味着，x的类型没法在编译阶段就知道，必须等到运行时才能知道。虽然变量的数据类型是不确定的，但是各种运算符对数据类型是有要求的。如果运算符发现，运算子的类型与预期不符，就会自动转换类型。比如，减法运算符预期左右两侧的运算子应该是数值，如果不是，就会自动将它们转为数值。
2024-05-24 08:51:41
347
原创 js知识汇总之包装类型
基本数据类型和引用类型这两个类型其中一个很明显的区别是，引用类型有自己内置的方法，也可以自定义其他方法用来操作数据，而基本数据类型不能像引用类型那样有自己的内置方法对数据进行更多的操作。对于引用类型的数据，在执行流离开当前作用域之前都会保存在内存中，而对于自动创建的基本包装类型的对象，只存在于一行代码的执行瞬间，执行完毕就会立即被销毁。基本包装类型的对象和引用类型的对象最大的一个区别是，对象的生存期不同，导致的一个结果就是，基本包装类型无法自定义自己的方法。提供了对应的特殊引用类型（包装类型）
2024-05-23 19:46:01
412
原创 js知识点汇总之let const 和 var的区别
声明的变量会先在作用域中被创建出来，但因此时还未进行词法绑定，所以是不能被访问的，如果访问就会抛出错误。因此，在这运行流程进入作用域创建变量，到变量可以被访问之间的这一段时间，就称之为暂时死区。其实上面不存在变量提升的例子中，其实也是暂时性死区，因为它有暂时性死区的概念，所以它压根就不存在变量提升了。实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。中的作用域有：全局作用域、函数作用域，命令声明变量之前，该变量都是不可用的。，导致绑定这个块级作用域，
2024-05-23 16:08:37
1615
原创 webpack编译过程
hash：一种算法，具体有很多分类，特点是将一个任意长度的字符串转换为一个固定长度的字符串，而且可以保证原始内容不变，产生的hash字符串就不变。此步骤非常简单，webpack将利用node中的fs模块（文件处理模块），根据编译产生的总的assets，生成相应的文件。chunk hash是根据所有chunk assets的内容生成的一个hash字符串。每个chunk都有一个模块记录,一个模块编译完了之后,会对依赖的模块继续进行编译(将多个chunk的assets合并到一起，并产生一个总的hash。
2024-05-22 17:28:23
533
原创 node fs模块常用功能
目录的size为0，目录记录一个指针，指针指向其中文件的地址，打开目录其实是通过指针找到文件的位置。可以传递三个参数第一个是路径，第二个是编码方式，第三个是回调函数，如果写了编码方式传过来的就不是一个Buffer，就是编码过后的东西。如果文件不存在就会新建一个,如果目录不存在就会报错。可以使用fs.writeFile（）创建一个文件。
2024-05-18 15:40:16
272
原创 node I/O流(背压问题)
造成原因：内存速度太快了，但是磁盘写入很慢，很多要写入的东西都积压在写入队列，造成很大的内存空间占用。因为写入队列是内存中的数据，是有限的，可以使用。来解决这个问题，这个事件会在当原来是满的时候，当写入队列清空时，会触发drain事件，如果本来就没有满，就算清空了也不会触发事件。ws.write(data)会。，反之就是写入通道被。
2024-05-18 15:37:35
226
原创 vue的history路由实现形式
在HTML5，history对象提出了 pushState() 方法和 replaceState() 方法，这两个方法可以用来向历史栈中添加数据，就好像 url 变化了一样（过去只有 url 变化历史栈才会变化），这样就可以很好的模拟浏览历史和前进后退了，现在的前端路由也是基于这个原理实现的。pushState(stateObj, title, url) 方法向历史栈中写入数据，其第一个参数是要写入的数据对象（不大于640kB)，第二个参数是页面的 title, 第三个参数是 url (相对路径)。
2024-03-24 15:49:18
895
原创 XSS攻击及防御方式
XSS（Cross Site Scripting，跨站脚本攻击），是指攻击者利用站点的漏洞，在表单提交时，在表单内容中加入一些恶意脚本，当其他正常用户浏览页面，而页面中刚好出现攻击者的恶意脚本时，脚本被执行，从而使得页面遭到破坏，或者用户信息被窃取。
2024-03-19 21:00:54
261
原创 jwt的组成及解决的问题
jwt本质上是一种令牌格式。它和终端设备无关，同样和服务器无关，甚至与如何传输无关，它只是规范了令牌的格式而已jwt由三部分组成：header、payload、signature。主体信息在payloadjwt难以被篡改和伪造。这是因为有第三部分的签名存在。
2024-03-19 20:59:38
1044
原创 BFC块级格式化上下文
简单来说，就是页面中的一块渲染区域，并且有一套属于自己的渲染规则，它决定了元素如何对齐内容进行布局，以及与其他元素的关系和相互作用。在上面的代码中，父元素的高度是靠子元素撑起来的，但是一旦我们给子元素设置了浮动，那么父元素的高度就塌陷了。效果：在上面的代码中，我们要设置两栏布局，左边栏宽度固定，右边栏自适应。这就好比你在你自己家里面，你想怎么摆放你的家具都可以，你家的家具布局并不会影响邻居家的家具布局。是一个独立的布局环境，里外不影响，但也不是意味着布局没有章法，基本的规矩还是要有的。
2024-03-13 14:16:43
820
原创 浏览器的url不能写中文
在浏览器中输入url(get请求)不能输入中文,因为url中只能用ascll编码,现在为什么可以呢?因为现在浏览器会把非ascll编码自动转换成ascll编码。
2024-03-13 14:14:48
130
原创 浏览器缓存 四种缓存分类 两种缓存类型
在正式开始讲解浏览器缓存之前，我们先来回顾一下整个Web应用的流程。上图展示了一个Web应用最最简单的结构。客户端向服务器端发送HTTP请求，服务器端从数据库获取数据，然后进行计算处理，之后向客户端返回HTTP响应。那么上面整个流程中，哪些地方比较耗费时间呢？总结起来有如下两个方面：发送请求的时候涉及到大量计算的时候一般来讲，上面两个阶段比较耗费时间。首先是发送请求的时候。这里所说的请求，不仅仅是HTTP请求，也包括服务器向数据库发起查询数据的请求。其次是大量计算的时候。
2024-03-11 15:03:18
1207
原创 h5 File API 看这一篇就够了
本文主要包含以下内容：- *File API* 介绍- *File* 对象 - 构造函数 - 实例属性和实例方法- *FileList* 对象- *FileReader* 对象
2024-03-11 15:00:43
1356
原创 JS 你知道为什么一个普通的“123“为什么可以调用方法吗
基本数据类型和引用类型这两个类型其中一个很明显的区别是，引用类型有自己内置的方法，也可以自定义其他方法用来操作数据，而基本数据类型不能像引用类型那样有自己的内置方法对数据进行更多的操作。
2024-03-08 13:56:10
507
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人