- 博客(68)
- 收藏
- 关注
RSS订阅原创 var / let / const 区别
建议在 JavaScript 中使用 let 和 const 来声明变量，因为它们提供了更好的作用域控制和可读性，且可以避免一些常见的错误。只在需要兼容旧版本 JS 或特殊情况下使用 var。const 关键字也是在 ES6 中引入的，用于声明常量。引用不可变，但对象或数组内部的属性可以被修改。ES6 引入了 let 关键字，用于。声明块级作用域的变量。
2024-07-29 11:18:38
762
原创 new Set() 的基础用法及应用场景
Set 是es6新增的数据结构，似于数组，但它的一大特性就是所有元素都是唯一的，没有重复的值，我们一般称为集合。Set 本身是一个构造函数，用来生成 Set 数据结构。
2024-07-26 17:41:09
414
原创 JS 进制及进制转换
JS中提供的进制表示方法有四种：二进制、八进制、十进制、十六进制。对于数值字面量，主要使用不同的前缀来区分：二进制(Binary)：取值数字0和1；前缀0b或0B八进制(Octal)：取值数字0-7；前缀0o或0O(ES6规定)十进制(Decimal)：取值数字0-9；不用前缀十六进制(Hexadecimal)：取值数字0-9和a-f；前缀0x或0X注意非严格模式下：如果有前缀0并且后面只用到0-7八个数字的数值时，该数值视为八进制；如果有前缀0并且后面跟随的数字中有8或者9，则视为十进制。
2024-07-26 15:50:20
656
原创 JS 事件循环（Event Loop）机制
因此，JS 采取了异步编程，凡是需要等待的操作，都会交给浏览器或 NodeJS 进行挂起，等同步代码执行完毕后再执行异步操作。浏览器执行的时候，所有的js代码都会被解析到<script>标签中，而<script>标签又是一个宏任务，所以整个事件循环机制可以看作是在解析一个全局的宏任务。事件循环机制是 JS 的一种执行机制，一种可以实现异步编程的机制。事件循环机制就是围绕同步任务、宏任务、微任务的执行时机展开的。同步任务在调用栈中执行，异步任务在任务队列中执行。MutationObserver 回调。
2024-07-24 17:54:53
571
原创 async / await 详解
当遇到 await，会先暂停 await 及后边代码的执行，直到 Promise 的状态发生改变后，才会继续执行 await 以及后边的任务await 本质是 then 的语法糖，其实是个微任务在 await new Promise 中如果包含一个定时器，定时器的回调函数中写 resolve() 或者reject()，那么这个定时器是个宏任务，会在宏任务队列排队完成后，再改变 Promise 的状态，然后 await 才能执行，再取消阻塞。
2024-07-24 17:28:37
1198
原创 Promise 详解（原理篇）
Promise 是一种异步编程的解决方案。在异步操作中，callback 会导致回调地狱的问题，Promise 解决了这个问题。一个 Promise对象有以下三种状态:pending：初始状态，既不是成功，也不是失败状态。：意味着操作成功完成。rejected：意味着操作失败。当 new Promise() 被实例化后，即表示 Promise 进入 pending 初始化状态，准备就绪，等待运行。
2024-07-20 23:55:03
1475
原创 浏览器的垃圾回收机制
内存泄漏是指在程序运行过程中，动态分配的内存没有得到释放，导致可用内存逐渐减少。：通过及时回收不再需要的内存，垃圾回收机制有助于提高浏览器的运行性能和响应能力。与其他需要手动管理内存的语言不同，在 JavaScript 中，当我们创建变量（对象，字符串等）的时候，系统会自动给变量分配对应的内存。当系统发现这些变量不再被使用的时候，会自动释放（垃圾回收）这些变量的内存，开发者不用过多的关心内存问题。当对象的引用计数器为0时，即没有任何引用指向它时，该对象被判定为不再被使用，可以回收。
2024-07-18 16:21:11
914
原创 JS 前端数据去重
使用排序和双指针可以实现 O(nlogn) 的时间复杂度。先对数组进行排序，然后使用双指针遍历数组，如果左指针和右指针指向的值相同，就把右指针向右移动，直到找到不同的值，然后把左指针向右移动，继续遍历。11.双层循环，复杂度 O(n^2)循环和对象，复杂度 O(n^2)方法和对象，复杂度 O(n)方法，复杂度 O(n^2)方法，复杂度 O(n^2)数据结构，复杂度 O(n)数据结构，复杂度 O(n)方法，复杂度 O(n^2)，复杂度 O(n^2)，复杂度 O(n^2)8.使用排序和双指针。
2024-06-21 16:12:57
219
转载 Chrome 控制台 performance 性能分析
（4）FMP（First Meaningful Paint）首屏有意义的内容绘制，这个“有意义”没有权威的规定，本质上是通过一种算法来猜测某个时间点可能是 FMP。通过记录这些数据，开发者可以了解网页在不同阶段的性能表现，并找出可能存在的性能问题。通过性能面板，开发者可以记录和分析网页在运行时的性能数据，识别性能瓶颈，并进行针对性的优化。（3）FCP（First Contentful Paint）首屏内容绘制，首次绘制任何文本，图像，非空白canvas 或 SVG 的时间点。：每条彩色横杠表示一种资源。
2024-06-20 16:54:04
1903
原创 JS 中的各种距离 scrollTop？clientHeight?
只读，返回窗口的文档显示区的宽度（不包括菜单栏、工具栏以及滚动条等），IE 不支持，window.innerWidth。（不管是 onclick，还是 omousemove，onmouseover 等）元素滚动条被向下拉动的距离。元素被滚动条向左拉动的距离。
2024-06-14 11:15:28
737
原创 vue 之 vuex
默认情况下，模块内部的 action、mutation 和 getter 是注册在全局命名空间的——这样使得多个模块能够对同一 mutation 或 action 作出响应。的，页面刷新会导致 Vue 实例重新加载，进而 Vuex 中的数据被重置为初始状态。在 Vuex 的 mutation 或 action 中，监听数据的变化，将数据同步到浏览器的本地存储中。这些状态信息，我们都可以放在统一的地方，对它进行保存和管理，而且它们还是响应式的。页面刷新时，从本地存储中读取数据并恢复到 Vuex 中。
2024-06-13 16:05:25
1035
1
原创 vue 之 h() 函数
vue在绝大多数情况下都推荐使用模板来编写html结构,但是对于一些复杂场景下需要完全的JS编程能力，这个时候我们就可以使用渲染函数 ，它比模板更接近编译器vue在生成真实的DOM之前，会将我们的节点转换成VNode，而VNode组合在一起形成一颗树结构，就是虚拟DOM（VDOM）我们之前编写的 template 中的HTML 最终也是使用渲染函数生成对应的VNode。
2024-06-11 17:59:26
2533
1
原创 JS 函数柯里化
在数学和计算机科学中，柯里化是一种将使用多个参数的一个函数转换成一系列使用一个参数的函数的技术，每个函数都返回一个新的函数，直到所有参数都被传递完毕。而对于 Javascript 语言来说，实际应用中的柯里化函数，可以传递一个或多个参数。简单来说就是简化函数的参数接收，将多个参数尽可能的变少。
2024-06-06 18:06:38
500
原创 Vue 数据更新了但页面没有更新
在 vue 项目中，有时我们会遇到修改完数据，但是视图却没有更新的情况。具体的场景不一样，解决问题的方法也不一样，在此汇总一下。
2024-06-04 18:00:45
1356
原创 如何发布自己的 npm 包
以上步骤应该能够帮助你成功发布自己的npm包。请确保在发布前认真测试和验证你的代码，以确保其他开发者能够无缝地使用你的包。然后在项目的 node_modules 文件夹下查看是否有 npm 包。在项目目录中编写你的 npm 包代码。这表示 npm 将从 index.js 文件开始加载你的包。1、开发过程中可以在其他本地项目中使用调试，以查看实时效果。如果在发布后进行了一些修改，需要更新版本号并重新发布。按照提示填写项目信息，包括包名、版本、描述等。在本地创建一个新的项目目录，并进入该目录。
2024-05-30 16:29:34
1059
原创 Promise 详解（应用篇）
因为第一个 .then 没有给返回的具体值，所以在第二个 .then 中，剥离掉 promise，拿到的结果就是 undefined。虽然 .then 返回值是 promise，但 .then 里面的参数，拿到的是 promise 里面携带的值。，不管是成功的状态还是拒绝的状态，都等待全部执行后，并返回一个包含每个 Promise 解决状态的对象数组。因为 p1，p2，p3 都是 reject，所以 any 一直在等有成功的状态，所以一直到 p3 结束后，都没有成功的，就走 catch 那边。
2024-05-27 10:57:45
642
原创 Git 基本使用
当你执行 `git rebase -i ` 命令时，Git 会打开一个文本编辑器，列出从 `` 到当前 HEAD 的所有 commit。git init --bare 创建时不带 .git 文件夹，事实上它不带工作目录，而是作为服务器仓库供各开发者push、pull 数据，实现数据共享和同步，不保存文件，只保存历史提交的版本信息。安装完成后，在开始菜单里找到“Git”->“Git Bash”，蹦出一个类似命令行窗口的东西，就说明Git安装成功！，然后按默认选项安装即可。
2024-05-21 16:58:26
1080
原创 HTTP 与 HTTPS 的区别
浏览网站时，我们会发现网址有两种‘格式’，一种以 http:// 开头，一种以 https:// 开头。好像这两种‘格式’差别不大，只多一个 s，实际上它们有天壤之别。HTTP 与 HTTPS 主要区别如下。
2024-05-16 17:39:02
1225
原创 谈谈 HTTP 的方法
举个例⼦，我们在开发⼀个博客系统，当我们要创建⼀篇⽂章的时候往往⽤ POST https://www.jianshu.com/articles ，这个请求的语义是，在 articles 的资源集合下创建⼀篇新的⽂章，如果我们多次提交这个请求会创建多个⽂章，这是⾮幂等的。这种直接覆盖资源的修改⽅式应该⽤put，但是你觉得每次都带有这么多⽆⽤的信息，那么可以发送 PATCH。其实这么说不够严谨，这是由客户端对 GET 和 POST 的策略决定的。当我们要修改⽂章的作者时，我们可以直接发送PUT。
2024-05-15 14:20:29
517
原创 HTTP 发展史
超文本传输协议（英语：HyperTextTransferProtocol，缩写：HTTP是万维网（World Wide Web）的基础协议。自蒂姆·伯纳斯-李（Tim BernersLee）博士和他的团队在 1989-1991 年间创造出它以来，HTTP 已经发生了太多的变化，在保持协议简单性的同时，不断扩展其灵活性。如今，HTTP 已经从一个只在实验室之间交换文档的早期协议进化到了可以传输图片，高分辨率视频和 3D 效果的现代复杂互联网协议。HTTP的诞生1989 年 3 月。
2024-05-14 17:51:45
849
原创 JS中的逗号“,”运算符
它首先计算左操作数，然后计算右操作数，最后返回右操作数的值，用逗号运算符可以在一条语句中执行多个运算。在JavaScript中逗号“,”也是一种运算符，称为逗号运算符。并不是在所有出现逗号的地方都组成逗号表达式，例如在变量说明中，函数参数表中逗号只是用作各变量之间的间隔符。程序中使用逗号表达式，通常是要分别求逗号表达式内各表达式的值，并不一定要求整个逗号表达式的值。逗号运算符可以用于赋值，在用于赋值时，逗号运算符总是返回表达式中的最后一项。一般形式形式: 表达式1，表达式2，…
2024-05-10 16:43:54
1497
原创 设计模式之策略模式
我们可以观察在计算绩效奖金的过程中，算法的使用方式是不变的，都是根据某个算法取得计算后的奖金数额。而算法的实现是各异和变化的，每种绩效对应着不同的计算规则。一个基于策略模式的程序至少由两部分组成，
2024-05-10 10:28:25
677
1
原创 设计模式之观察者模式
观察者模式是一种行为型设计模式，它定义了一种一对多的依赖关系，当一个对象的状态发生改变时，其依赖者（观察者）会自动收到通知并更新。
2024-05-09 17:12:58
780
原创 设计模式之工厂模式
工厂模式属于创建型设计模式，将对象的创建与使用分离。将new操作单独封装遇到new时，就要考虑是否该使用工厂模式了上面的两个概念也是比较抽象哈，我们可以结合现实中的例子去思考，假如你去买汉堡直接点餐、取餐，不会自己亲手做商店要“封装”做汉堡的工作，做好后直接给消费者。
2024-05-07 10:02:32
756
原创 vue 的 keep-alive 详解
在该函数内对this.cache对象进行遍历，取出每一项的name值，用其与新的缓存规则进行匹配，如果匹配不上，则表示在新的缓存规则下该组件已经不需要被缓存，则调用pruneCacheEntry函数将其从this.cache对象剔除即可。是一个内置组件，它的功能是在多个组件间动态切换时缓存被移除的组件实例，而不是销毁它们，可防止重复渲染。发生了变化，即表示定义需要缓存的组件的规则或者不需要缓存的组件的规则发生了变化，那么就执行。表明该组件还没有被缓存过，则以该组件的。的组件实例，此时重新调整该组件。
2024-04-24 16:04:13
1173
原创 vue 实现懒加载
懒加载，也称为延迟加载，是一种将资源（如图片、组件、代码等）推迟到需要的时候再加载的策略。在 Vue 中，懒加载通常涉及到组件和图片的加载。
2024-04-23 18:09:29
2881
原创 package.json 里面的 dependencies 和 devDependencies 的差异
其实不严格的话，没有特别的差异；若是严格，遵循官方的理解。
2024-04-23 16:52:59
639
原创 谈谈 vue 生命周期
每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。（ps：生命周期钩子就是生命周期函数）例如，如果要通过某些插件操作 DOM 节点，如想在页面渲染完后弹出广告窗， 那我们最早可在 mounted 中进行。
2024-04-22 16:23:31
1179
2
原创 Vue 常用修饰符
修饰符是用于限定类型以及类型成员的声明的一种符号，vue 中修饰符分为以下五种：事件修饰符、鼠标按键修饰符、v-bind 修饰符、键值修饰符、表单修饰符。
2024-04-19 17:10:48
1139
原创 vue 钩子函数
bind：指令绑定到元素之上的时候触发 只执行一次unbind：指令被移出的时候触发 只执行一次update：所有节点更新的时候执行componentUpdate：指令所在节点以及所有子节点都更新完成的时候执行inserted：绑定指令的元素在页面展示的时候执行。
2024-04-18 17:21:50
714
1
原创 Vue 中 mixins（混入）的介绍和使用
在项目开发的时候，常会碰到这样的一种现象：有两个组件非常相似，比如较为熟悉的 Modal 、 Tooltip 和 Popover ，它们都具有同样的基本函数，而且它们之间也有足够的不同。很多时候，就让人很难做出选择：是把它们拆会成多个不同的组件呢？还是只使用一个组件，创建足够的属性来改变不同的情况？这些解决方案都不够完美。如果拆分成多个组件，就不得不冒着如果功能变动你要在多个文件中更新它的风险。另一方面，太多的属性会很快变得混乱，难维护，甚至对于组件开发者自已面言，也是件难事。
2024-04-18 16:27:27
1185
1
原创 vue 组件间通信方式
要注意的是 provide 和 inject 传递的数据不是响应式的，也就是说用 inject 接收来数据后，provide 里的数据改变了，后代组件中的数据不会改变，除非传入的就是一个可监听的对象。在父组件中给子组件绑定自定义事件，然后调用需要的方法，然后在子组件中用 this.$emit 触发父组件的事件，第一个是事件名，第二个是参数。在父组件子组件添加自定义属性，挂载需要传递的数据，子组件用 props 来接受，接收方式也可以是数组，也可以是对象，子组件接收到数据之后，
2024-04-17 11:05:14
1147
原创 iframe 的基本介绍与使用
iframe（内嵌框架）是 HTML 中一种用于将一个网页嵌入到另一个网页中的标签，它可以在一个页面中显示来自其他页面的内容。在网页中，使用<iframe>标签可以将一个网页嵌套在另一个网页中，实现网页间的互联互通。
2024-04-15 15:25:05
2618
原创 TypeScript 中文错误消息
TypeScript 本身支持多语言显示错误消息，默认会追随操作系统或开发工具选择一个显示错误消息的语言。如果我们想强制让其显示某种语言可以如下设置，例如强制显示中文。注：不推荐使用中文，因为英文的错误提示更方便我们在 Google 搜索解决方案。对于 vsCode 中的错误消息可如下设置。设置完成之后，显示中文错误消息了。
2024-04-11 16:29:43
244
1
原创 Vue2 响应式原理
这样，当 obj.message 属性发生变化时，Dep 会通知到相关的观察者，触发相应的更新操作。它会重写对象的属性访问器（getter和setter），使得当属性被读取或修改时，Vue 能够捕捉到这一操作，并触发相应的更新。在 Vue 的响应式系统中，依赖收集是指收集数据属性的依赖关系，也就是说，当一个属性被使用时，Vue 会追踪到这个属性的依赖，并建立起一个关联关系。当属性被读取时，会打印相应的信息，当属性被修改时，也会打印对应的信息。对于对象的变化，Vue 的响应式系统使用了类似的方法进行劫持。
2024-04-09 16:55:34
798
原创 vsCode 刷 leetcode 使用 Cookie 登录
找到 graphql/ 请求（可能多个，随便选择一个就行了），右边 Headers 下方主要有三个部分，分别是常规（General）、响应标头(Response Headers)、请求标头(Request Headers)，下划找到到请求标头(Request Headers)的 Cookie，复制 Cookie 的值 粘贴 到 vscode 就可以登录了。插件安装成功之后，侧边栏选择 leetcode 菜单，切换终端，选择中文版本，切换成功后，会显示一个打勾，图示笔者已切换成中文版本。
2024-04-01 11:08:17
1692
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人