自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(21)
  • 收藏
  • 关注

原创 package.json里有哪些基础配置?

环境变量新建脚本文件,并从process.argv中获取命令行传递的参数,然后执行命令并带上参数,通过这种方式获取到了我们刚刚输入的参数。description描述和keywords关键字有助于发现发布的包,会在。命令,会根据这个文件中的配置信息下载所需的模块,新项目可以在终端执行。表示项目名称,注意不得包含大写字母,可以使用。当我们克隆一个新的项目到本地时,执行。更灵活的用法是传递命令行参数,使用。表示版本号,命令格式为。还有个很常见的配置项。

2023-07-18 23:04:53 189

原创 for in 和 for of最最本质的区别?

什么是可枚举呢?属性的enumerable值为true 咱就称为是可枚举的,通过 object,getowPropertyDescriptors()验证/查看如图,以字符串为例:什么是可迭代?ES6中,具有symbol.iterator 属性,它对应的值是一个函数,调用这个函数后可以得到一个对象,每次调用对象的 next 方法能得到目标的每一项,只要符合这个特点就是可迭代的。

2023-07-16 19:33:39 308 1

原创 Vue2中$nextTick的具体应用场景?

1. 在修改数据后立即操作DOM:当你修改Vue实例中的数据,然后希望在DOM更新之后执行一些操作(如获取更新后的DOM元素、执行一些需要基于更新后的DOM进行的计算等),可以使用`$nextTick`来确保在下次DOM更新循环结束之后执行相关代码。这对于处理一些与DOM相关的操作和计算非常有用。3. 在Vue实例方法中的异步操作后执行相关代码:当你在Vue实例方法中执行异步操作,然后希望在操作完成后在下次DOM更新循环结束之后执行相关代码,可以使用`$nextTick`。

2023-07-14 09:04:27 198 1

原创 Vue2中$set的应用场景?

需要注意的是,虽然`$set`方法是处理动态添加响应式属性的一种方式,但在使用Vue 3时,推荐使用新的响应式API,例如`reactive`、`ref`和`toRefs`,它们提供了更简洁和灵活的方式来管理响应式数据。1. 动态添加对象属性:在Vue实例中,如果你需要在运行时动态添加新的属性到一个已存在的对象上,并希望这个新属性是响应式的,就可以使用`$set`方法。1. 在嵌套对象中动态添加属性:如果你有一个嵌套的对象结构,想要在内部对象中添加新的属性并使其成为响应式的,可以使用`$set`方法。

2023-07-14 09:01:36 520 1

原创 Vue2中如何使用vue.use对自定义组件/指令进行快速注册?

通过传递一个包含`install`方法的对象给`Vue.use()`,我们可以在`install`方法中注册我们的组件和指令。`install`方法会接收`Vue`作为参数,从而使我们能够通过`Vue.component()`和`Vue.directive()`方法进行组件和指令的注册。通过使用`Vue.use()`方法,我们可以在整个应用中快速注册并使用自定义组件和指令,而无需在每个组件中单独进行注册。在Vue.js中,使用`Vue.use()`方法可以快速注册自定义组件和指令。

2023-07-14 08:57:19 777 1

原创 Vue.js 3.0 响应式 API 比 2.x 好在哪儿?

所以就响应式的实现而言,Vue.js 3.0 比 Vue.js 2.x 在性能上的优势主要体现在初始化阶段,不需要递归把子对象定义成响应式。而Proxy本身并不比快,好处是在于可以直接对整个对象劫持,包括对象属性的新增和删除,劣势就是浏览器的兼容性不够好,而且没有合适的 polyfill。我出这个题主要是希望你能做到以下两点:从源码层面探索,了解 Vue.js 响应式的实现原理。对比 Vue.js 2.x 和 Vue.js 3.0 在响应式实现上的差异。要记住,分析和思考的过程远比答案重要。

2023-07-13 14:32:23 46 1

原创 Vue2响应式有哪些缺陷?

Vue.js 2.x版本中的响应式系统有一些缺陷。以下是其中一些常见的缺陷:1. 无法响应新增属性:在Vue2中,只有在实例被创建时就存在的属性才会被观察。这意味着如果你在已经创建的实例上动态添加新的属性,Vue无法检测到这些属性的变化。为了解决这个问题,你需要使用Vue.set或Vue.$set方法来添加响应式属性。2. 无法响应数组索引和length的变化:Vue2无法检测到通过索引设置数组元素的变化,以及直接修改数组的length属性。

2023-07-13 14:29:48 1214 1

原创 Vue2中怎么合理拆分store并配置全局getter?

在上述示例中,我们定义了一个全局 getter `combinedData`,它通过访问和组合模块 `moduleA` 和 `moduleB` 的状态来提供衍生的数据。在 Vue 2 中,你可以通过合理拆分 Vuex 的 store 和配置全局 getter 来更好地组织和管理应用程序的状态。在 Vuex 的 store 中,你可以定义全局的 getter,它可以访问和组合多个模块的状态,提供衍生的数据。在组件中使用 `$store.getters` 访问全局 getter,并在模板或计算属性中使用。

2023-07-13 11:36:11 656 1

原创 Vue2中v-model和.sync的区别?

在上述示例中,父组件通过 `:message.sync="message"` 将 `message` 属性传递给子组件,并监听子组件触发的 `update:message` 事件来更新 `message` 属性的值。使用 `.sync` 修饰符时,父组件需要将子组件的属性通过 `.sync` 传递给子组件,并监听子组件触发的事件来更新属性的值。在上述示例中,`v-model="message"` 会将 `<input>` 元素的值与 `message` 数据进行双向绑定。

2023-07-13 09:16:22 215 1

原创 Vue2中v-if和v-show有什么区别?

v-show` 也是一种条件渲染指令,与 `v-if` 类似,根据表达式的值来决定元素是否显示。在上述示例中,当 `show` 的值为真时,`<p>` 元素会显示;`v-show` 不会像 `v-if` 那样销毁和重新创建元素,而是通过修改元素的 CSS 样式来控制元素的显示与隐藏。在 Vue 2 中,`v-if` 和 `v-show` 是两个用于条件渲染的指令,它们有一些区别和适用场景。在上述示例中,当 `show` 的值为真时,`<p>` 元素会被渲染到 DOM 中,否则不会被渲染。

2023-07-13 09:16:03 173

原创 Vue2如何使用mixin技术来复用代码?

通过使用 mixin,可以将通用的逻辑和功能应用于多个组件,从而实现代码的复用。当多个组件需要共享相同的逻辑时,你可以将这些逻辑提取到一个 mixin 对象中,并将其应用到这些组件中。在上述示例中,我们使用 `mixins` 选项将 `myMixin` 对象应用于组件。使用 `mixins` 选项将 Mixin 对象应用于组件。你可以在组件选项中指定一个或多个 Mixin 对象,它们将与组件的选项进行合并。Mixin 是一种将组件选项(如数据、方法、生命周期钩子等)复用到多个组件中的方式。

2023-07-11 18:07:06 189

原创 typescript中ref、reactive、computed、defineprops、defineemits 的类型注解分别是什么

它接受一个事件定义对象,并返回一个具有类型注解的对象。类型注解:`computed<T>(getter: () => T): Readonly<Ref<T>>`类型注解:`reactive<T>(target: T): UnwrapNestedRefs<T>`类型注解:`defineProps<T extends Readonly<{}>>(): T`类型注解:`defineEmits<T extends Readonly<{}>>(): T`类型注解:`ref<T>(value: T): Ref<T>`

2023-07-11 18:03:27 1003

原创 如何写出一个函数来判断变量的数据类型?

这个示例函数可以处理大多数常见情况,但不一定适用于所有场景。此外,对于自定义的对象类型,该函数会返回 `'object'`,可以根据需要进行进一步处理或添加其他类型判断逻辑。该函数接受一个变量作为参数,并使用 `typeof` 运算符获取变量的基本类型。如果类型为 `'object'`,则进一步判断变量的具体类型,如 `null`、数组、日期对象等。最后,将变量的数据类型作为字符串返回。可以编写一个函数来判断变量的数据类型,可以使用 `typeof` 运算符和一些 JavaScript 的类型判断方法。

2023-07-11 17:58:00 137

原创 如何用reduce统计字符出现频率?

在上述示例中,我们首先将字符串 `str` 使用 `split('')` 方法转换为字符数组,然后使用 `reduce` 方法对字符数组进行迭代。最后,`reduce` 方法返回的是一个使用 `Map` 数据结构表示的字符频率统计结果。注意,如果需要按照出现频率的大小对字符进行排序,你可以在最后将 `frequencyMap` 转换为数组,并使用 `sort` 方法进行排序。以上示例中,`frequencyMap` 是一个 `Map` 对象,其中每个键表示字符,对应的值表示该字符在字符串中出现的次数。

2023-07-11 17:53:04 45

原创 数组的高阶排序方法怎么用?你能用原型链扩展数组的排序方法吗?

该方法接受一个比较函数 `compareFn` 作为参数,并在内部调用内置的 `sort` 方法,将比较函数作为参数传递给它。然后,我们可以通过调用 `customSort` 方法来对数组进行排序,传递自定义的比较函数。接下来我会给出一个实例,在这个示例中,我们将使用原型链来添加一个名为 `customSort` 的方法,它将接受一个比较函数作为参数,并使用该比较函数对数组进行排序。数组的高阶排序方法是指可以接受一个比较函数作为参数,并根据比较函数的逻辑对数组元素进行排序的方法。

2023-07-11 17:46:58 40

原创 递归的实现原理是什么?有哪些场景会遇到递归?

递归的实现原理依赖于函数调用栈,每次递归调用都会在栈中创建一个新的函数帧,保存局部变量和返回地址。需要注意的是,在编写递归函数时,要确保递归能够收敛到基本情况,避免无限递归导致程序崩溃。此外,递归的性能可能不如迭代循环,因为每次递归调用都需要消耗额外的栈空间。因此,在某些情况下,递归可能不是最佳的解决方案。基本情况是指递归过程中满足某个条件时,不再调用自身,直接返回特定的值或执行特定的操作。无论是解决数学问题、处理数据结构,还是处理文件系统,递归都是一种强大的编程技术,能够简洁地解决问题。

2023-07-11 17:38:52 442

原创 axios怎么在ts里使用?

请注意,上述示例中的类型声明可能需要根据你的具体请求和响应结构进行调整。你可以根据接口文档或实际返回的数据结构,定义合适的类型声明来增加代码的可读性和可维护性。- 自定义类型声明文件(例如:`axios.d.ts`),声明 axios 相关的类型。TypeScript 中可以为 axios 做类型声明,提供更好的类型检查和自动补全。- 使用第三方的 axios 类型声明库:`@types/axios`。// 请求成功后的处理。// 请求失败后的处理。// 请求成功后的处理。// 请求失败后的处理。

2023-07-11 17:30:45 1099

原创 字面量和联合类型有什么区别?怎么使用?

字面量(Literal)和联合类型(Union Type)是在类型系统中常见的概念,用于表示数据的特定值和多个可能类型的组合。联合类型的优点在于它增加了灵活性,允许处理多样化的数据。在使用联合类型时,通常需要进行类型检查或类型断言来处理不同类型的数据。

2023-07-11 17:21:51 74

原创 type和interface的区别

interface可以 声明合并,这种情况下,如果是type的话,就会报 重复定义 的警告,因此是无法实现 声明合并 的。type可以通过 typeof 操作符来定义,如 type myType = typeof someObj。type可以申明 元组类型,如 type yuanzu = [myType1, myType2]type可以定义 基本类型的别名,如 type myString = string。interface是通过extends实现的,type是通过&实现的。但是具体的形式稍有差别。

2023-07-11 17:14:51 66

原创 Cookie、Session、Token究竟区别在哪?

总之,token生成于服务端,存储在客户端,服务端不用存储,用户后面每次登录都携带首次都登录生成的token字符串用于验证,能做到这点,关键就是token使用的某种算法根据用户签名和其它一些信息生成的令牌信息是一致的,可以验证通过,对于用户量庞大的系统,或者分布式,避免了大量session对象的存储带来的内存消耗,和各服务器之间session的。以上连起来就是,你从自己的小钱包(Cookie) 里掏出了身份证(Token),递给了窗口(服务器)里面,从而达成了一种Session 能力。

2023-07-11 16:38:55 57

原创 v-if和v-show 的区别?

v-if:v-if 是惰性地编译条件块。- v-if:当条件发生变化时,v-if会在条件为真时将元素及其组件添加到DOM中,在条件为假时将其从DOM中移除。- v-show:当条件发生变化时,v-show仅通过CSS的display属性来切换元素的显示和隐藏,不涉及DOM的插入或移除操作。- v-if:在初始渲染时,如果条件为假,那么对应的元素及其组件将不会被渲染到DOM中,因此初始渲染开销较低。- v-show:在初始渲染时,无论条件是否为真,对应的元素都会被渲染到DOM中,因此初始渲染开销较高。

2023-07-10 16:53:55 50 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除