- 博客(655)
- 收藏
- 关注
RSS订阅原创 【网络】cookie
再比如，浏览器发送请求时，会附带匹配的 cookie 到请求头中。与此同时，也正是因为浏览器的默认行为，给了恶意攻击者可乘之机，CSRF 攻击就是一个典型的利用 cookie 的攻击方式。当这样的响应头到达客户端后，浏览器会自动的将cookie保存到卡包中，如果卡包中已经存在一模一样的卡片（其他path、domain相同），则会自动的覆盖之前的设置。cookie 的大小是有限制的，一般浏览器会限制同一个域下的 cookie 总量为4M, 而sessionStorage和localStorage则没有限制。
2024-05-22 12:09:35
521
原创 【Webpack】webpack scope hoisting
但 scope hoisting 的启用是有前提的，如果遇到某些模块多次被其他模块引用，或者使用了动态导入的模块，或者是非 ESM 的模块，都不会有 scope hoisting。在未开启 scope hoisting 时，webpack 会将每个模块的代码放置在一个独立的函数环境中，这样是为了保证模块的作用域互不干扰。scope hoisting 是 webpack 的内置优化，它是针对模块的优化，在生产环境打包时会自动开启。这样做的好处是减少了函数调用，对运行效率有一定提升，同时也降低了打包体积。
2024-05-22 12:09:01
150
原创 【Vue】性能优化
从另一方面来说，由于可以通过保持属性引用稳定来避免子组件的重渲染，那么我们应该细分组件来尽量避免多余的渲染（只要组件对应的对象 地址不发生改变，则不会重新渲染）。当使用v-mode1绑定一个表单项时，当用户改变表单项的状态时，也会随之改变数据，从而导致vue发生重渲染(rerender)，这会带来一些性能的开销。我们可以通过使用lazy或不使用v-model的方式解决该问题，但要注意，这样可能会导致在某一个时间段内数据和表单项的值是不一致的。但是这种也会存在问题，就是数据不是实时的。
2024-05-22 12:06:42
271
原创 【Vue】computed 和 methods 的区别
在使用时，computed 当做属性使用，而 methods 则当做方法调用computed 可以具有 getter 和 setter，因此可以赋值，而 methods 不行computed 无法接收多个参数，而 methods 可以computed 具有缓存，而 methods 没有。
2024-05-22 12:06:10
369
原创 【Vue】diff 算法
当组件创建和更新时，vue均会执行内部的update函数，该函数使用render函数生成虚拟dom树，将新旧两树进行对比，找到差异点，最终更新到真实dom。对比差异的过程叫diff，Vue在内部通过一个叫patch的函数完成该过程。在对比时，Vue采用深度优先、同层比较的方式进行比对。在判断两个节点是否相同时，vue是通过虚拟节点的key和tag来进行判断的。具体来说，首先对根节点进行对比，如果相同则将旧节点关联的真实 dom 的引用挂到新节点上，然后根据需。
2024-05-22 12:05:40
221
原创 【CSS】媒体（媒介 / media）查询
媒体查询（Media Queries）是 CSS3 中引入的一种技术，用于根据设备的特性和属性，为不同的媒体类型提供不同的样式规则。媒体查询使得我们可以根据设备的屏幕尺寸、分辨率、屏幕方向、设备类型等条件来适应不同的设备和媒体类型。表示媒体类型，比如screen（屏幕）、print（打印）等，而是媒体特性，比如width（宽度）、height（高度）、（方向）等。未指明类型为默认值 all。
2024-05-22 12:05:09
273
原创 【CSS】计算属性 calc 函数
然而，需要注意的是，calc() 函数在某些旧版本的浏览中可能不被完全支持，特别是在 IE 11 及以下版本。CSS 中的 calc() 函数是用于动态计算数值的函数。它可以在 属性的值中执行基本的数学运算，包括加法、减法、乘法和除法，以及使用 CSS 单位进行计算。// 计算出宽度为容器宽度减去40像素的三分之一。// 计算出内边距为10像素加上父元素宽度的5%width: calc(100% - 20px);
2024-05-22 12:04:38
181
原创 【CSS】import
这样，当浏览器解析 CSS 文件时，会先加载和应用导入的样式表，然后再继续解析和应用后续的 CSS 规则。它可以将一个 CSS 文件中的样式引入到另一个 CSS 文件中，使得样式可以在多个文件中共享和重用。另外，@import 还支持一些选项和参数，例如媒体查询（media query），可以根据不同的设备或屏幕尺寸导入不同的样式表。在IE中，@import会引发资源文件的下载顺序被打乱，即排列在@import。后面的JS文件先于@import下载，并且打乱甚至破坏@import自身的并行下载。
2024-05-22 12:04:08
254
原创 【JavaScript】尺寸和位置
pageX 是相对于文档页面左上角的水平坐标，pageY 是相对于文档页面左上角的垂直坐标。screenX 是相对于显示屏幕左上角的水平坐标，screenY 是相对于显示屏幕左上角的垂直坐标。X 是相对于事件目标元素内边界左上角的水平坐标，offsetY 是相对于事件目标元素内边界左上角的垂直坐标。clientX 是相对于浏览器窗口左上角的水平坐标，clientY 是相对于浏览器窗口左上角的垂直坐标。scrollTop和scrollLeft：获取或设置元素的垂直和水平滚动条位置（），不包括边框和滚动条。
2024-05-14 14:52:51
483
原创 【数据结构与算法】力扣 49. 字母异位词分组
lodash 里面自带一个方法，可以根据规则对字符串数组进行分组，而分组后的 value 刚好是我们需要的结果。当然不用 lodash 也可以，我们自己实现一个分组，相当于把以上 lodash 的原理实现了一遍。是由重新排列源单词的所有字母得到的一个新单词。可以按任意顺序返回结果列表。给你一个字符串数组，请你将。
2024-05-14 14:52:15
237
1
原创 【JavaScript】eval
是一个全局函数，它接受一个字符串参数，并将其作为 JavaScript 代码进行解析和执行；如果接收的不是一个字符串，则会将传入的数据直接返回。JavaScript 中的。不推荐使用 eval。
2024-05-14 14:51:45
248
原创 【JavaScript】WeakMap 和 WeakSet
Map 用于存储键值对。添加属性：使用 Map 的 方法可以向 Map 对象中添加键值对。例如：通过二维数组快速创建 map 键值对。获取属性和长度：使用 Map 的 方法可以根据键获取对应的值。使用 Map 的 属性可以获取 Map 对象中键值对的数量。例如：遍历 Map 对象：使用 Map 的 方法可以遍历 Map 对象的键值对。可以传入一个回调函数，对每个键值对执行相应的操作。例如：删除属性：使用 Map 的 方法可以根据键删除对应的键值对。例如：Ma
2024-05-14 14:51:14
949
原创 【JavaScript】严格模式
严格模式是一种 JavaScript 的执行模式，通过启用严格模式，可以对一些不规范或潜在的问题进行检测，并禁用一些不安全的语言特性，以提高代码质量和可维护性。严格模式（Strict Mode）是一种运行模式，它提供了一种更加严格的语法和错误检查，以帮助开发者编写更可靠、更规范的代码。字符串，即可开启严格模式。在脚本文件或函数的开头添加。
2024-05-14 14:50:13
281
原创 【数据结构与算法】力扣 222. 完全二叉树的节点个数
的定义如下：在完全二叉树中，除了最底层节点可能没填满外，其余每层节点数都达到最大值，并且最下面一层的节点都集中在该层最左边的若干位置。你可以设计一个更快的算法吗？遍历树来统计节点是一种时间复杂度为。，求出该树的节点个数。
2024-05-14 14:49:34
252
原创 【Node.js】事件循环
Node.js 的事件循环是一个 Event Loop，通过异步回调函数的方式实现非阻塞的处理。事件循环会在主线程上不断地执行，监听和处理事件，执行相应的回调函数。Node.JS的事件循环比浏览器端复杂很多。V8引擎解析JavaScript脚本。解析后的代码，调用Node API。libuv 库（C++）负责Node API的执行。它将不同的任务分配给不同的线程，形成一个事件循环，以异步的方式将任务的执行结果返回给V8引擎。V8引擎再将结果返回给用户。
2024-05-14 14:14:36
1147
原创 【JavaScript】浮点数精度问题
由于浮点数采用二进制表示，某些十进制小数无法准确转换为二进制表示。，在存储时会进行截断。JavaScript 中整数和浮点数都属于 number 数据类型，所有数据都是以 64 位浮点数的形式存储。由于浮点数的表示范围有限，对于超出表示范围的数值，计算机会进行舍入。由于二进制表示的限制，一些十进制小数在转换为浮点数后会存在精度损失。这意味着在进行浮点数计算时，结果可能会与预期的结果有微小的差异。双精度的浮点数在这64位上划分为3段，而这3段也就确定了一个浮点数的值，64bt的划分是“1-11-
2024-05-12 21:39:39
427
原创 【JavaScript】阻止事件默认行为
在JavaScript中，事件默认行为是指在特定的事件发生时浏览器自动执行的操作。form 元素 的 action 属性值表单内容要提交的地址，而用户点击表单元素中嵌套的提交按钮时，就会有一个默认的提交操作。需要注意的是，不同的事件有不同的默认行为，因此阻止默认行为的方法可能会有所不同。方法用于阻止事件的进一步传播，而不是直接阻止事件的默认行为。也是 event的一个属性，表示默认行为是否被阻止，true 表示被阻止。方法用于阻止事件传播，而不是直接阻止事件的默认行为。可以阻止默认行为的执行。
2024-05-12 21:38:39
311
原创 【JavaScript】DOM 事件的传播机制
当一个事件发生在某个元素上时，它会沿着元素层次结构向上传播或向下传播，这就是事件流。在事件捕获过程中，事件会逐级触发每个祖先元素的相同事件，进而触发这些事件对应的处理函数。在事件冒泡过程中，事件会逐级触发每个父元素的相同事件，进而触发这些事件对应的处理函数。事件委托利用了事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。事件冒泡是指事件从最具体的元素开始（例如用户点击的按钮），然后逐级向上传播至最不具体的节点（例如。事件捕获与事件冒泡相反，事件从最不具体的节点开始（例如。
2024-05-12 21:37:16
387
原创 【数据结构与算法】力扣 111. 二叉树的最小深度
如果将根节点当做叶子节点，那和求最大深度没什么区别，只是将却左右子树最大值改为求最小值。最小深度是从根节点到最近叶子节点的最短路径上的节点数量。首先一个可能犯错的点，根节点肯定不是叶子结点。这道题用前序、后序、迭代都可以求。给定一个二叉树，找出其最小深度。叶子节点是指没有子节点的节点。
2024-05-12 21:36:38
414
原创 Failed to parse source map (@toast-ui/editor/dist/purify.js.map)
使用 toast-ui-editor 时出现报错：Failed to parse source map (@toast-ui/editor/dist/purify.js.map)在启动脚本时添加执行 GENERATE_SOURCEMAP=false 的指令即可。
2024-05-11 21:46:45
189
原创 【HTML】可替换元素
再比如，select 也是可替换元素，他在页面的呈现是用户操作系统上的下拉列表样式，呈现由操作系统决定。所以，同一个select 元素，放到不同操作系统的电脑上也会不同。比如 img 元素就是可替换元素，在页面中呈现什么样的效果取决于链接的什么图片，图片是什么就展现什么，CSS 只是可以控制图片的尺寸位置，无法控制图片本身。非可替换元素就是指普通元素，在页面上呈现什么，完全由 CSS 决定。img，video，audio，大部分表单都属于可替换元素。
2024-05-09 20:34:15
177
原创 【JavaScript】原型
在 JavaScript 中，每个对象都有一个原型（prototype），它是对象的一种特殊属性。原型对象包含了对象的属性和方法，当我们访问对象的属性或方法时，如果对象本身不存在这些属性或方法，JavaScript 引擎会自动去原型对象中查找。
2024-05-08 14:33:13
1282
原创 【JavaScript】闭包
闭包是一种现象。闭包是指在 JavaScript 中，内部函数可以访问外部函数作用域中的变量，并且在外部函数执行结束后仍然保持对这些变量的引用。换句话说，只要函数中使用了外部的数据，就创建了闭包。而作用域链是实现闭包的手段。要不要放入闭包取决于该变量有没有被引用。自动形成的闭包，是会被销毁掉的。因为没有引用，所以闭包也会被销毁。let food = '米饭'eat()方法执行结束之后，上下文被销毁，food 变量也会跟着消失。let food = '米饭'fd() // 米饭。
2024-05-08 14:32:42
803
原创 【数据结构与算法】力扣 226. 翻转二叉树
而最好使用前后序遍历，中序有点复杂。当然层序和非递归遍历也可以。，翻转这棵二叉树，并返回其根节点。给你一棵二叉树的根节点。比较简单，就是一个递归。
2024-05-08 14:32:12
387
原创 react 项目中使用 iconfont
将一些样式放到项目中（此时我放入的是项目的全局 css 文件 index.css ），注意需要将 url 路径修改为相对路径。将 ttf 字体文件添加到项目的某个文件夹（这里我的文件夹是 font）内。添加购物车，下载代码，解压。
2024-05-08 14:31:42
290
原创 【JavaScript】this 的指向
全局执行环境中,指向全局 window 对象(非严格模式、严格模式)函数内部,取决于函数被调用的方式直接调用的this值：① 非严格模式:全局对象(window) ② 严格模式:undefined对象方法调用的this值：① 调用者使用 new 方法调用构造函数，构造函数内的 this 会绑定到新创建的对象上。箭头函数，this 指向由外层（函数或者全局）作用域决定。apply / bind / call 方法调用，函数体内的 this 绑定到指定参数的对象上。
2024-05-08 14:30:59
790
原创 【JavaScript】作用域
作用域是代码中定义变量的区域，它决定了变量的可见性和生命周期。作用域规定了在程序中哪些部分可以访问某个变量，以及变量在哪些地方是可用的。作用域最大的作用就是隔离变量。自由变量是指在当前函数作用域中未声明但被引用（使用）的变量。当 JavaScript 引擎在当前作用域中找不到某个变量时，它会沿着作用域链向上查找，直到找到该变量为止。如果在全局作用域中也找不到该变量，那么该变量就是一个自由变量。// Outer Variable 是一个自由变量// globalVar 是一个自由变量。
2024-05-07 19:03:43
723
原创 【JavaScript】执行栈和执行上下文
当 JavaScript 代码执行时，会创建执行上下文，并将其推入执行栈的顶部。当函数执行完成后，对应的执行上下文将从栈顶弹出，控制权返回到上一个执行上下文。在JavaScript中,通过栈的存取方式来管理执行上下文，我们可称其为执行栈，或函数调用栈（Call Stack）。程序代码中基本都会存在函数，那么调用函数，就会进入函数执行环境，对应就会生成该函数的执行下文。执行上下文是 JavaScript 中代码执行的环境的抽象概念，它包含了代码运行时所需的所有信息，比如变量的值、函数的引用等。
2024-05-07 19:03:10
796
原创 【数据结构与算法】力扣 102. 二叉树的层序遍历
队列中只要有元素，就需要循环遍历。为了将当前层的元素添加到 temp 当前层的数组中。而循环的次数刚好就是当前 queue 的长度（当前层元素个数）。将旧的（当前层元素）推入 temp，将新的（子节点）添加到 queue。输出为一个二维数组，所以需要一个 res 作为最终结果数组，需要一个个的 temp 作为每一层的数组。注：需要先保存一下 length 因为 在获取子节点的时候会改变 queue.length。（即逐层地，从左到右访问所有节点）。那么如何控制元素的遍历条件呢？上图来自：代码随想录。
2024-05-07 19:02:36
396
2
原创 【JavaScript】运算符
自增运算符（++）用于将变量的值增加 1，而自减运算符（–）用于将变量的值减少 1。如果第一个运算子的布尔值为 false，则直接返回第一个运算子的值，不再对第二个运算子求值。先看两个运算子是否都是字符串，如果是，就按照字典顺序比较（比较 Unicode 码点，几乎包含所有字符），位数不相同依次比较各位上的字符；如果所有表达式的布尔值都为 false，则返回最后一个表达式的值。在上面的例子中，逗号运算符首先执行了加法操作 5 + 3，然后执行了减法操作 10 - 2，最终返回了减法的结果，即 8。
2024-05-06 22:24:37
1101
3
原创 【JavaScript】数据类型转换
JavaScript 中的数据类型转换主要包括两种：隐式类型转换（Implicit Type Conversion）和显式类型转换（Explicit Type Conversion）。
2024-05-06 22:23:49
866
1
原创 【数据结构与算法】力扣 144.前序遍历，145.后序遍历，94.中序遍历
递归算法很简单，你可以通过迭代算法完成吗？递归算法很简单，你可以通过迭代算法完成吗？递归算法很简单，你可以通过迭代算法完成吗？给你一棵二叉树的根节点。给定一个二叉树的根节点。
2024-05-05 09:34:40
372
原创 【数据结构与算法】力扣 347. 前 K 个高频元素
相同元素都对应一个出现次数，可以很容易想到 map。key, value 代表元素和出现的次数。然后就可以不断（k 次）遍历 比较 value，并把 key 加入结果数组中。，请你返回其中出现频率前。你所设计算法的时间复杂度。这里使用优先级队列来解决。
2024-05-04 13:38:46
401
原创 【数据结构与算法】堆
堆是是一个完全二叉树，其中每个节点的值都大于等于或小于等于其子节点的值。这取决于是最大堆还是最小堆。小根堆：每个根都小于子节点。大根堆：每个根都大于子节点。【从堆的定义到优先队列、堆排序】 10分钟看懂必考的数据结构——堆_哔哩哔哩_bilibili。
2024-05-04 13:38:15
755
2
原创 【数据结构与算法】力扣 239. 滑动窗口最大值
而这道题我们需要维护的就是最大值，是队尾元素，也是我们最终需要存放到结果队列中的元素。要保持始终队尾元素是最大值，因为维护其他元素没有意义（不是我们要求的）。而因为我们需要找到每一个滑动窗口的最值，所以就需要使用单调队列（维护一个队列的单调性）。单调队列的应用场景就是滑动窗口问题。**的滑动窗口从数组的最左侧移动到数组的最右侧。此时的滑动窗口就很像是一个队列，所以可以直接把它当做一个队列来分析解答。当滑动窗口不再覆盖的元素（队尾元素），需要直接弹出。依次找到每一个窗口中的最大值，添加到结果数组中。
2024-05-01 13:28:02
304
原创 【数据结构与算法】力扣 1047. 删除字符串中的所有相邻重复项
思路也很简单了，和之前做的括号匹配思路相同，不再赘述了。在完成所有重复项删除操作后返回最终的字符串。在 S 上反复执行重复项删除操作，直到无法继续删除。会选择两个相邻且相同的字母，并删除它们。给出由小写字母组成的字符串。
2024-04-30 20:17:31
301
原创 【JavaScript】包装类型
包装类型是指将基本数据类型（如字符串、数字、布尔值）转换为对应的引用数据类型的过程。JavaScript 在访问基本数据类型值的时候会自动创建对应的包装对象，以便调用对象的方法和访问属性。这种自动创建包装对象的过程称为包装。
2024-04-30 20:16:45
700
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人