生命周期 <script> export default { // 实例初始化之前 beforeCreate() { console.log('home', 'beforeCreate') }, // 初始化实例（DOM还未挂载） created() { console.log('home', '...

宏任务和微任务 宏任务：setTimeout, setInterval, Ajax, DOM事件 微任务：Promise, async/await 微任务执行时机比宏任务要早，微任务在DOM渲染前调用执行，宏任务在DOM渲染后调用

async/await与Promise的关系 执行async函数，返回的是promise对象 await相当于Promise的then try…catch可捕获异常，代替了Promise的catch async function foo() { return 10 // 相当于 return Promise.resolve(10) // return P...

Iterator遍历器 ES6语法中，有序集合的数据类型已经有很多 Array、May、Set、String、TypedArray、arguments、NodeList function each(data) { let iterator = data[Symbol.iterator]() // iterator.next() // 有数据返回 {value:...

动态组件实现原理 Vue 的动态组件是 Vue 中一个非常强大和有用的功能，它允许你在同一挂载点动态地切换不同的组件。 动态组件的使用 首先，你可以在父组件模板中使用 <component> 元素来指定动态组件的挂载点： <component :is="currentComponent"></component> 在上面的代码中，current...

自定义useLocation 模拟获取一个地理位置 import {reactive, onMounted, toRefs } from 'vue'; // 模拟异步获取 function getLocation(fail) { debugger return new Promise(resolve => { setTimeout(() =>...

工厂模式 工厂函数是一种设计模式，它是一个返回对象或函数的函数。其目的是用于创建和初始化对象，使得代码更具可读性、可维护性和可扩展性。 在 JavaScript 中，工厂函数通常用于创建对象，允许你在创建对象的过程中执行一些初始化逻辑。这样可以封装对象的创建细节，同时提供一个清晰的接口。 一个简单的工厂函数的示例： function createPerson(name, age) {...

自定义v-model input输入框自定义v-model // Input.vue <template> <input type="text" :value="modelValue" @input="change1"> </template> <script setup> defineProps(['model...

什么是作用域？这是老生常谈的问题了，作用域分为： 全局作用域 函数作用域 块级作用域（es6） this指针 const obj = { f1() { const fn = () => { console.log('this1', this) } fn() fn.call(...

WeakMap 和 WeakSet 是 ES6 中引入的两个新数据结构，它们可以用来存储弱引用。弱引用是指不会阻止对象被垃圾回收的引用。 WeakMap 和 WeakSet 与 Map 和 Set 类似，但它们的行为略有不同。Map 和 Set 中的键和值都是强引用，这意味着它们不会被垃圾回收。如果一个 Map 或 Set 中的键或值被垃圾回收，那么整个 ...