JS 变量提升 参考链接： 彻底解决 JS 变量提升| 一题一图，超详细包教包会 😉 什么是变量提升？举个例子 console.log(a) // undefinedvar a = 10 为什么打印的是 undefined 呢？就是由于 js 的变量提升机制，代码执行前，浏览器会将带有var, function关键词的变量提前进行声明（默认值就是 undefined）。在变量提升解读啊，带var的只是声明还没有被定义，带function的已经声明和定义。 示例： var a = 12var b = ab = 1function sum(x, y) { var total = x + y return total}sum(1, 2) 变量提升只发生在当前的作用域 带 var 和不带 var 的区别 全局作用域中可以不带var声明变量，但是建议带上，不带相当于给window设置一个属性 私有作用域，带var的是私有变量，不带的会向上级作用域查找 全局中使用var声明的变量会映射到window下称为属性 a = 12 // == window.acon ...

qiankun 微前端学习笔记仓库地址: https://github.com/Juns-g/qiankun-learn 参考链接： qiankun 官网 微前端的核心价值 Why Not Iframe 【微前端】single-spa 到底是个什么鬼 黑马前端基于 qiankun 搭建微前端项目实战教程 Vue3 + Vite + qiankun 微前端实践 如何让 vite 完美接入 qiankun 介绍什么是微前端微前端的概念其实类似于后端的微服务架构，出发点就是把一个复杂的大应用分为多个子应用，每个子应用可以独立运行、开发、部署，从而达到分布式，多团队并行的项目需求。 微前端也有一个主应用称为基座项目，嵌入其他 n 个子应用，子应用之间相互独立，不过也可以相互通信 价值 技术栈无关 主框架不限制接入应用的技术栈，微应用具备完全自主权 独立开发、独立部署 微应用仓库独立，前后端可独立开发，部署完成后主框架自动完成同步更新 增量升级 在面对各种复杂场景时，我们通常很难对一个已经存在的系统做全量的技术栈升级或重构，而微前端是一种非常好的实施渐进式重构的手段和策略 独立运行 ...

《延迟满足》笔记参考链接 《延迟满足》 懂得《延迟满足》才能拥有选择的权利 专注、自控、追求长期价值 记录作者做了棉花糖实验得知：那些从小就能做到延迟满足的人，长大后在学业、事业和健康上都表现的更好。 为什么做到延迟满足这么难？从人脑的生理机制来看，抑制冲动、延迟满足本身就是在和人基因里的无意识的本能做对抗。面对诱惑，我们的反应取决于大脑中的两个系统，分别是冲动的情绪系统和冷静的认知系统。 冲动系统的工作机制就是刺激行动，针对强烈的刺激快速做出反应，同时自动引发愉悦疼痛和恐惧等情绪。冲动系统是必须的也是本能驱动的，是一种无意识的结构，是反射性的、简单的、情绪化的，像是性冲动和攻击性冲动都是为了寻求即刻满足，不考虑后果。 但是更多情况下我们需要保持冷静， 运用理性解决问题。冷静系统启动的慢，而且他和冲动系统是此消彼长的关系，所以他常常打不过冲动系统。人有心里免疫系统，会为自己找理由，所以当你发现自己产生了 “因为我做了某事，所以我现在就可以怎样“ 的想法就要警惕起来了。情绪、压力和状态都会影响我们延迟满足的能力。那些执行功能和自我掌控感更强、情绪状态更好的人，更容易做到延迟满足。 如何 ...

《睡眠革命》笔记参考链接 《睡眠革命》 《睡眠革命》熬夜不可怕，告别“睡够 8 小时”误区，R90 睡眠法让你的睡眠更高效！ 记录如何打造合适的睡眠环境其实我们每天都在做一些不利于我们睡眠的事情，一堆反光/产生光的东西。原始人的昼夜节律是，日出而作，日落而息。现在的环境充斥着各种光，正常来说人体夜间会比白天分泌多 5 ～ 10 倍的褪黑素，他能帮助进入睡眠。但是因为现代生活的光线影响，会让褪黑素的分泌减少，久了就影响了睡眠。 所以说营造合适的睡眠环境是很重要的，作者提倡我们卧室里要准保好这俩样东西：合适的寝具、一个闹钟或一盏唤醒灯。 推荐寝具前先介绍作者推崇的一个睡眠姿势：胎儿睡姿。这是侧卧的一种，但他的要点是要侧向身体相对不太重要的一侧，就是平常习惯使用相对比较少的一边，于我而言就是左手在下。 挑选寝具。事实上选择床垫需要考虑我们的身材，简单的方法就是躺下来试一试，不用被子和枕头，用婴儿睡姿侧卧着。让朋友帮忙拍一张照，从你的背面把整个人都拍进去，然后观察照片，如果头部、颈部和脊柱连成了一条直线，这就说明这个床垫是适合你的。如果头下意识想歪向床垫，像躺在地板上一样，就说明床 ...

TEDxTalks 为什么你应该拥抱平庸 笔记记录演讲者的儿子学到了两堂关于语言的非常重要的课： 语言是很有影响力的，但他们的含义往往很微妙 优越感和对比性的语言，可能会让人失望，但这很难 我们的焦虑源于一直担心自己不够好，或者总是需要成为一个更好的人，或者需要有更好的东西。不过现实是，不是每个人都是赢家，大多数人过上的是更加平凡的生活。 平庸一词起源于 medium，实际上是处于俩个极端的中间，对于我们大多数人来说，处于中间是不可避免的，这并不是一个糟糕的位置。学会认识我们的平庸，而别让其他人让我们觉得自己像失败者。 精英和高端这俩个词很常见，这些都是更好的意思，其实这是“象征性暴力”的一个很常见的例子。我们怎么避免对自己进行象征性暴力？接受我们不可避免的平凡，我们被持续的优越感和对比性的语言所包围时，想要平凡需要决心和勇气。 思考感觉思绪比较杂乱，在国内的内卷的这种环境中，感觉接受自己的平庸是比较难的一件事，总有人做的比你更好，过于平庸可能会使自己落后。 不过我们也不应该是被别人逼着去做的更好，不是被别人推动，应该是找到自己真正乐意愿意去做的事情，我们可以接受在一些领域上的平庸 ...

Vue2 面试知识点1. Vue2 的响应式关键词Object.defineProperty(), getter/setter, 发布-订阅模式, 观察者模式, 依赖收集, Watcher, Observer, Dep, 原型链, __proto__, prototype, Array.prototype, parsePath, diff算法, 虚拟DOM, 设计模式, 正则表达式 这些都是有所涉及的，并且可以拓展下去问的 原理简单概括就是： Vue是采用数据劫持结合观察者(发布-订阅)模式的方式，通过Object.defineProperty()来劫持各个属性的getter和setter，在数据变动时发布消息给订阅者(Watcher)，触发相应的监听回调来更新DOM 响应式的创建、更新流程 当一个Vue实例创建时，Vue会遍历data选项的属性，用Object.defineProperty()为他们设置getter/setter，并且在内部追踪相关依赖，用户访问或修改属性时，会触发getter/setter的监听回调来更新DOM 每个组件实例都有相应的watcher实例，它会在组件渲 ...

这才是最好的学习方式笔记 https://www.bilibili.com/video/BV1GG411a7Wt/?vd_source=9928f2a9263e4b4f8d78f76eb5a79a03 记录学习 📑 半小时并不需要休息半小时来充电 🔋，对大多数人来说，5 分钟就够了，离开电脑用 5 分钟做点自己喜欢的事，回来后会发现效率回到最高。 创建一个学习专属区域，视频中用的是一个灯 很多人因为睡眠不足而影响了学习效果，快速眼动睡眠有助于记忆巩固， 思考总共就记录的三个点。 第一点主要是沉浸状态与休息状态的转变，这个其实不需要限定 25min 和 5min，每个人专注的时长是可能不一样的，但是主要是需要自己在感到疲惫的时候，能够及时的休息，而不是一直强迫自己学习，这样会导致效率低下。 第二点更多的是一个象征意义，也像是潜暗示，让自己更加专注，减少分心。 第三个的话是需要比较多的快速眼动睡眠，有助于记忆。 评论区推荐的一本书：深度工作

树 https://github.com/sisterAn/JavaScript-Algorithms/issues/39 需要思考的问题： 什么是树？ 树的高度如何计算？ 什么是二叉树 什么是平衡二叉树 在代码中如何表示一棵二叉树？ 二叉树的前序、后序、中序遍历是什么？如何实现？ 能否用递归和迭代俩种方式来遍历？ 树树是一种非线性的结构，它遵循： 仅有唯一一个根节点，没有节点则为空树 除了根节点外，每个节点都有且仅有唯一一个父节点 节点间不能形成闭环 树的几个概念： 拥有相同父节点的节点，互相称为兄弟节点 节点的深度：从根节点到该节点所经历的边的个数 节点的高度：节点到叶节点的最长路径 树的高度：根节点的高度 B、C、D 互相为兄弟节点，B 的高度是 2，B 的深度是 1，树的高度是 3 树的高度计算公式：height = 1 + max(height(p.left), height(p.right)) 下图的每个节点的值都代表当前节点的高度 二叉树最多仅有俩个子节点的树 平衡二叉树二叉树中，每一个节点的左右子树的高度差不能大于 1，称为平衡二叉树 满二叉树 ...

vue-insights学习 vue 的底层、设计与实现 仓库地址：https://github.com/Juns-g/vue-insights 参考资料： 深入浅出 Vue.js Vue2 源码 响应式系统Vue 的特性之一是其看上去并不显眼的响应式系统。数据模型仅仅是简单的 JS 对象，但是当我们修改它们时，视图会进行更新。这让状态管变得简单直接。但是理解他的原理也很重要，这样可以让我们避免一些常见的问题。 从状态生成 DOM，在输出到用户界面，这样的流程叫渲染，应用在运行时会不断的重新渲染。响应式系统赋予框架重新渲染的能力，其中的一个重要组成部分就是变化侦测。他也是响应式系统的核心。 变化侦测的作用就是侦测数据的变化，当数据变化时，会通知视图进行相应的更新. object 的变化侦测如何追踪变化在 JS 中如何侦测一个对象的变化？我们可以轻易的想到Object.defineProperty()和Proxy, Vue2使用的是Object.defineProperty()，Vue3使用的是Proxy。这里我们就只看Object.defineProperty()。 那我们就可以写 ...