- 博客(26)
- 收藏
- 关注
原创 【js常见问题梳理】
bind()方法会创建一个新函数,称为绑定函数,当调用这个绑定函数时,绑定函数会以创建它时传入 bind()方法的第一个参数作为 this,传入 bind() 方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数。在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向。箭头函数的this指向,和箭头函数定义所在上下文的this相同。
2023-06-21 08:25:20
178
原创 【数组的常用方法总结】
2.filter的回调函数需要返回布尔值,当为true时,将本次数组的数据返回给filter,最后filter将所有回调函数的返回值组成新数组返回(此功能可理解为“过滤”)。根据指定的数据,从左向右,查询在数组中出现的位置,如果不存在指定的数据,返回-1,找到了指定的数据返回该数据的索引。数组的第一项开始,逐个遍历到最后,迭代数组的所有项,然后构建一个最终返回的值。向数组中添加,或从数组删除,或替换数组中的元素,然后返回被删除/替换的元素。将数组的数据进行反转,并且返回反转后的数组,会改变原数组。
2023-06-21 08:14:59
199
原创 【vue2 .sync修饰符】
我们都知道,组件之间通过props 或者 $emit 传值都是单向数据流的。age是我们要修改的状态的名称,是我们手动配置的,与传入的状态名字对应起来。这时子组件触发了父组件的修改函数使父组件的age修改成了1234567。这里我们必须在事件执行名称前加上update:的前缀才能正确触发事件。这里注意我们的事件名称被换成了<font color=red >update:是被固定的也就是vue为我们约定好的名称部分。这样就很简单的实现了,数据的双向流。这样就完成了,是不是感觉简单了很多。
2023-06-20 17:05:03
175
原创 【js 复杂判断的简化】
我们编写js代码时经常遇到复杂逻辑判断的情况,通常大家可以用if/else或者switch来实现多个条件判断,但这样会有个问题,随着逻辑复杂度的增加,代码中的if/else/switch会变得越来越臃肿,越来越看不懂,所以我们尽可能的让复杂的判断看起来清晰明了。
2023-06-20 17:00:40
52
原创 【vue3,watchEffect和watch监听】
watch API 与选项式 API this.$watch (以及相应的 watch 选项) 完全等效。立即执行传入的一个函数,同时响应式追踪其依赖,并在其依赖变更时重新运行该函数。
2023-06-20 16:58:56
204
原创 【vue-router之 tag 和 v-solt 对比】
1.在vue-router4.0之前,我们都是使用 tag 来自定义 router-link 渲染成什么标签。2.在vue-router4.x 之后废弃了 tag 有了v-solt 概念。
2023-06-20 16:57:03
81
原创 【vue2 vs vue3自定义指令】
在vue中提供了一些对于页面 + 数据的更为方便的输出,这些操作就叫做指令, 以v-xxx表示类似于html页面中的属性el: 指令所绑定的元素,可以用来直接操作DOM。binding: 一个对象,包含指令的很多信息。vnode: Vue编译生成的虚拟节点。自定义指令有五个生命周期(也叫钩子函数),分别是 bind,inserted,update,componentUpdated,unbind。
2023-06-20 16:50:27
47
原创 【vue2 vs vue3 插槽】
插槽的使用其实是很简单,你只需要明白两点:1.插槽是使用在子组件中的。2.插槽是为了将父组件中的子组件模板数据正常显示。
2023-06-20 16:47:17
289
原创 【vuex 数据持久化插件】
刷新页面,vuex里面数据丢失、清空。有时候我们需要把一些数据固话到本地,即使刷新也不能清空,例如:登陆状态、token等。这是就需要用到vuex数据持久化。
2023-06-20 10:53:07
58
原创 【v-for和v-if 优先级的问题】
如果避免出现这种情况,则在外层嵌套template(页面渲染不生成dom节点),在这一层进行v-if判断,然后在内部进行v-for循环。:永远不要把 v-if 和 v-for 同时用在同一个元素上,带来性能方面的浪费(每次渲染都会先循环再进行条件判断)如果条件出现在循环内部,可通过计算属性computed提前过滤掉那些不需要显示的项。不能直接这样写,会出现警告。
2023-06-19 12:06:02
36
原创 【vue3+vant 移动端适配】
postcss-pxtorem 是一款 postcss 插件,用于将 px 单位转化为 rem。lib-flexible 用于设置 rem 基准值。
2023-06-19 11:57:06
158
原创 【javascript 常用的开发技巧】
上面代码是一个阶乘函数,计算 n 的阶乘,最多需要保存 n 个调用数据,复杂度为 function(n),如果改写成尾调用,只保留一个调用记录,复杂度为 function(1)。我们每次进行校验的时候都需要输入一串正则,再校验同一类型的数据时,相同的正则我们需要写多次, 这就导致我们在使用的时候效率低下,并且由于 checkByRegExp 函数本身是一个工具函数并没有任何意义。保存在变量中的是对象在堆内存中的地址,所以,与简单赋值不同,这个值的副本实际上是一个指针,而这个指针指向存储在堆内存的一个对象。
2023-06-19 11:46:30
43
原创 【Promise】
原因则是Promise属于JavaScript引擎内部任务,而setTimeout则是浏览器API,而引擎内部任务优先级高于浏览器API任务,所以有此结果。这段代码定义了一个函数sleep,调用后,如果传入的实参大于10,你会发现他会触发then的回调函数,并且打印出成功,如果传入的实参小于10,你会发现他会触发catch的回调函数,并且打印出失败。然后,then方法指定的回调函数将在当前脚本所有同步任务执行完后才会执行,所以BBB 最后输出。,在异步操作失败时调用,并将异步操作的结果作为参数传递出去。
2023-06-19 11:12:36
38
原创 【es6开发常用技巧】
/ 事例自定义事件的函数有和// 向 window派发一个resize内置事件// 直接自定义事件,使用 Event 构造函数:// 监听事件// 触发事件.其中 options 可以是:detail: {...},bubbles: true, //是否冒泡cancelable: false //是否取消默认事件其中可以存放一些初始化的信息,可以在触发的时候调用。其他属性就是定义该事件是否具有冒泡等等功能。
2023-06-19 10:57:53
135
原创 【Fetch简单封装】
1.Fetch本质上是一种标准,该标准定义了请求、响应和绑定的流程。2.Fetch标准还定义了Fetch () JavaScript API。3.可用于前后端,数据交互。4.fetch返回的是promise对象,比XMLHttpRequest的实现更简洁,fetch 使用起来更简洁 ,完成工作所需的实际代码量也更少5.fetch 可自定义是否携带Cookie。6.fetch不像axios需要安装使用,fetch可以直接使用。
2023-06-19 09:03:02
877
1
原创 【Pinia的使用】
1.pinia 和 vuex 具有相同的功效, 是 Vue 的存储库,它允许您跨组件/页面共享状态。2.设计使用的是 Composition api,更符合vue3的设计思维。3.Pinia 对 Vue 2 和 Vue 3 都有效,并且不需要您使用组合 API。
2023-06-19 08:10:15
169
原创 【JS封装函数基础】
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。用函数把重复的代码块包裹起来就是函数封装。封装的作用: 其实就是为了减少代码的冗余,增加代码的可读性与易维护性, 将实现同一功能的代码封装起来,在需要实现这一功能时调用即可。
2023-05-02 21:19:09
333
1
原创 【正则表达式验证邮箱】
正则表达式,全称“Regular Expression”,在代码中常简写为regex、regexp或RE。正则表达式,就是用某种模式去匹配一类字符串的公式。这里对文章进行总结:以上就是今天要讲的内容,本文仅仅简单介绍了正则的语法和使用,一般使用场景手机号码的验证,邮箱格式等。
2023-04-23 13:00:24
3039
3
空空如也
为什么VScode写的列表里浮动运行没有反应
2022-09-21
TA创建的收藏夹 TA关注的收藏夹
TA关注的人