自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 关于JavaScript 的 for、for-in 和 for-of

循环是ES6中引入的一种新的循环迭代方式。它可以迭代所有可迭代对象(如数组、字符串、Set、Map等)的元素。循环可以简化迭代过程,并且它不需要显式的索引或迭代变量。循环是一种基本的循环结构,通过指定初始条件、循环条件和循环步进条件,可以迭代指定次数的循环。循环用于迭代对象的可枚举属性。它会迭代对象中所有可枚举的属性,包括原型链上的属性。需要根据具体的需求和循环迭代的对象选择合适的循环结构。循环来迭代数组和其他可迭代对象,而在遍历对象的属性时可以使用。循环适用于遍历对象的属性或数组的索引。

2023-08-12 14:31:39 342

原创 前端跨域问题

在 Web 开发中,浏览器的同源策略(Same-Origin Policy)限制了不同源(协议、域名、端口)之间的资源访问。因此,跨域请求会受到同源策略的限制,但在某些情况下,我们确实需要进行跨域请求。需要注意的是,不同的解决方案适用于不同的场景,选择最佳的解决方案应考虑到安全性、兼容性和便利性等因素。

2023-08-12 10:56:24 130

原创 JavaScript中的强制回流

请注意,优化回流的策略要根据具体的情况进行评估和应用,因为不同的浏览器在处理回流时可能存在差异。在性能关键的场景中,通过减少不必要的回流操作,可以显著提升页面的响应速度和性能。强制回流(Force Reflow)是指通过一些操作或属性的改变来强制浏览器重新计算元素的几何属性(比如位置、尺寸等),并触发重新渲染,以保证最新的布局信息生效。因此,在编写代码时,我们应该尽量避免频繁的强制回流操作。因为强制回流的代价较高,如果需要对多个元素进行样式修改,应尽量避免多次回流。

2023-08-12 10:38:58 527

原创 JavaScript 中 Math.floor() 和 parseInt() 的应用场景和区别

通过以上两种方法比较不难发现,如果对一个小数使用 Math.floor() ,它会向数轴的左侧取整,而对一个小数使用 parseInt() 他只会输出整数部分。因此,它可以解析整数部分,而忽略掉字符串中的非数字部分。它通常用于将浮点数转换为整数,或者对数字进行向下舍入的操作。函数是用于向下取整,它会将一个数字向下舍入到最接近的小于或等于它的整数。都是用于对数字进行取整操作的函数,但它们的功能和用法有一些不同之处。都可以对数字进行取整操作,但它们的应用场景和用法有所不同。会将其解析为十六进制或八进制的整数。

2023-08-12 09:49:43 892

原创 CSS属性——backdrop-filter

backdrop-filter属性可以应用于元素的背景,用于为背景添加一个视觉效果。它允许我们应用各种滤镜效果,比如模糊、色调调整和透明度等,来改变元素的背景外观,从而实现更加复杂的视觉效果。

2023-08-12 09:11:10 1069 1

原创 JavaScript 文档注释

通过使用这些文档注释标记,开发人员可以清晰地了解每个函数的参数、返回值以及其用途,从而更好地使用和调用这些函数。当编写代码时,文档注释是一种特殊的注释格式,用于描述函数、类、方法或变量的功能、使用方法和参数等详细信息。通过阅读文档注释,开发人员可以快速了解代码的作用和使用方式,以便更好地理解和使用代码。通过详细的文档注释,团队成员可以更轻松地理解和使用彼此的代码,减少沟通和协调成本。总而言之,文档注释是一种非常有价值的实践,它能够帮助开发人员快速理解代码的功能和使用方式,并提供良好的代码文档化和协作基础。

2023-07-30 09:16:46 379 1

原创 网络请求中常见的状态码及其含义

除了上述列举的常见状态码,HTTP 协议还定义了许多其他状态码,不同状态码代表了不同的含义。在进行网络请求时,通常会根据服务器返回的状态码来判断请求的结果,并根据需要进行相应的处理。这个状态码是服务器用来表示对请求的处理结果的一种标识。服务器在处理请求的过程中发生了错误,可能是代码错误、配置错误或服务器故障引起的。服务器未能找到请求的资源。服务器成功处理了请求并创建了新的资源,通常在发起 POST 请求时返回。客户端没有访问请求的权限,无法获取请求的资源。服务器成功处理了请求并返回了请求的内容。

2023-07-29 16:50:00 844

原创 Axios的二次封装

Axios是一个非常流行的JavaScript库,用于进行HTTP请求。二次封装是指在使用Axios库时,将其进行进一步的封装,以便更好地满足项目的需求。

2023-07-29 16:22:16 3759

原创 vscode Prettier安装及配置

Prettier 是一款流行的代码格式化工具,用于自动化和统一化代码的格式。它支持多种编程语言,并具有以下特点和优势:自动格式化:Prettier 能够自动解析代码,并根据预定义的规则和配置选项对代码进行格式化,省去手动调整代码风格的麻烦。一致的代码风格:Prettier 通过应用一致的代码风格规则,确保项目中的所有代码具有统一的风格,减少团队成员之间的风格冲突,并提高代码的可读性。可配置性:Prettier 提供了一系列的配置选项,可以根据项目需求和个人偏好进行调整。

2023-07-29 10:30:48 4581

原创 window cmd 常用命令

复制名为 “source_dir” 的目录及其内容到名为 “destination_dir” 的目录。将名为 “file1.txt” 的文件复制到名为 “file2.txt” 的新文件。将名为 “oldname.txt” 的文件重命名为 “newname.txt”。在名为 “filename.txt” 的文件中搜索 “search_text”。将名为 “filename.txt” 的文件设置为隐藏属性。显示名为 “filename.txt” 的文本文件的内容。显示当前正在运行的所有进程的详细列表。

2023-07-27 18:22:37 156 1

原创 多种方法解决“多行文本溢出”

这些方法可以帮助你处理多行文本溢出的情况,根据实际需求选择合适的方法来实现多行文本的溢出处理。

2023-07-22 16:16:42 810

原创 可组合的散列数值

这些示例展示了一些基本的可组合的散列数值的操作,在JavaScript中的语法和操作方式。需要注意的是,组合散列数值时要根据具体的需求和数据类型选择相应的操作。可组合的散列数值是指一组数值,可以通过某种组合方式得到其他数值。另外,在进行数值组合时,还需要考虑数值范围、数据类型转换、溢出等因素,以确保组合的结果符合预期且不会导致错误。可以通过对象的合并、增删改查等操作,将多个对象组合成新的对象。数组:数组是包含多个数值的数据结构,可以通过数组的操作(例如合并、追加、删除等)组合成新的数组。

2023-07-22 16:00:56 38

原创 Intersection Observer

例如,可以懒加载图片,在滚动时加载更多内容,触发动画效果,跟踪广告显示和隐藏等等。Intersection Observer(可见性观察器)是一个现代的浏览器API,用于异步地观察一个元素是否进入或退出另一个元素(或视口)的可见区域。使用Intersection Observer可以很方便地实现元素的懒加载、无限滚动、滚动动画等功能,而无需繁琐的事件监听和计算逻辑。同时,Intersection Observer还可以在性能方面提供优势,因为它通过异步执行回调来处理观察到的变化,而不会阻塞主线程。

2023-07-22 15:35:54 181

原创 监听盒子滚动条位置(原生、Vue2、Vue3)

首先,确保你已经在项目中引入了Vue 3,并创建了一个Vue实例。要在Vue 2中使用并获取盒子的滚动条位置,你可以使用Vue的指令和实例属性。首先,确保你已经在项目中引入了Vue,并创建了一个Vue实例。请注意,要获取滚动条位置,盒子元素必须存在滚动条,并且已经发生了滚动。在Vue 3中,你可以使用Vue Composition API和。要获取盒子(元素)的滚动条位置,可以使用JavaScript的。就会在盒子发生滚动时自动更新,并保持与滚动条位置的同步。在上述示例中,我们在Vue实例中定义了。

2023-07-22 15:29:54 3146

原创 预渲染与服务端渲染(SSR)

SEO(Search Engine Optimization,搜索引擎优化)是一系列技术和策略的集合,通过优化网站和其内容,以及提供良好的用户体验,旨在提高网站在搜索引擎中的排名,从而增加有机(非付费)流量和提升网站的可见性。搜索引擎优化的目标是使网站在搜索引擎结果页(SERP)中的排名更靠前,从而提高网站的曝光度和点击率。随着人们对信息的获取逐渐依赖搜索引擎,拥有较高的搜索引擎排名变得越来越重要。简单来说是用户的网站更容易被搜索引擎爬取到,以提升网站再搜索引擎的排名。

2023-07-22 15:19:06 804

原创 CSS——position属性

属性在CSS布局中非常有用,可以用于创建复杂的布局和定位效果。元素相对于最近的已定位(非static)的父元素进行定位。如果没有已定位的父元素,则相对于文档的初始定位点进行定位。绝对定位会使元素脱离文档流,不占据原有空间,会覆盖其他元素。属性用于控制元素在文档流中的定位方式。它决定了元素在页面中的位置,以及是否受到其他元素的影响。相对定位不会使元素脱离文档流,即在文档中仍会占据原有的空间。元素按照正常的文档流布局排列,并受到其他定位设置的影响。元素相对于其正常文档流中的位置进行定位,通过。

2023-07-22 15:11:14 66

原创 Vue2 响应式原理

可以看到,通过该方法,我们可以更加精细地控制对象属性的可读性、可写性、可枚举性和可配置性等特性,并且可以为一个属性自定义读取器(get)和写入器(set)等逻辑处理。简单来说,在 Vue2 响应式系统中,当数据发生改变时,会触发 get 和 set 方法,get 方法会收集所有依赖该数据的 Watcher 对象,set 方法会通知 Dep 对象触发所有 Watcher 对象的回调函数进行更新。当其中任意一个属性的值发生变化时,其对应的依赖都会被更新,从而触发其绑定的观察者的回调函数。

2023-06-04 18:24:37 2207 1

原创 JavaScript中的原型,原型链分别是什么?

原型:在JavaScript中,每个对象都有一个与之相关联的原型对象(或称为prototype),用于共享属性和方法。构造函数本身也是一个函数对象,它有自己的原型对象以及通过它创建的实例的原型对象。原型链:当我们需要访问一个对象的属性或方法时,如果该对象本身没有定义这些属性和方法,JavaScript引擎就会沿着该对象的原型链向上查找,直到找到匹配的属性或方法,或者到达原型链的顶端null。这个从当前对象所属原型对象一直向上查找的过程就是原型链。

2023-06-03 22:56:35 40

原创 谈一谈浅拷贝和深拷贝

需要注意的是,在进行深拷贝时,我们使用了hasOwnProperty来判断是否为自身属性,这是因为JavaScript中所有对象都继承自Object.prototype,并在原型链上定义了一些可枚举的属性。否则就创建一个新的对象或数组,然后遍历原对象或数组的每个属性/元素,并递归地复制其对应的值到新数组或对象中。相反地,在深拷贝中,当执行对象之间的复制时,每个属性会被递归地拷贝,新的对象被分配了一个不同的内存地址,这表示在新对象上的更改不会影响原始对象。

2023-06-03 13:34:32 38

原创 谈一谈递归

每次递归调用都会更新它的值,并且在应用递归条件之后返回新的数值和递归调用。这可以避免递归调用带来的性能和内存问题,因此,在使用递归算法时应该考虑使用尾递归实现。一般情况下,递归要求在每一次递归调用中都会将问题规模减小,并且最终能够得到返回值。递归的过程会把大问题转化为小问题,一直将问题缩小,直到克服所有的小问题。然而,在使用递归时需要注意一个问题:递归可能会用尽大量的计算资源和内存,导致程序卡顿或崩溃。作为递归条件,每次递归都会处理一个问题的规模小 1,直到。接下来是递归调用的流程,用。

2023-06-03 11:06:17 34

原创 谈谈你对 Vue 中 keep-alive 的理解

当组件失去焦点时,Vue通常会销毁该组件并释放其内存,在该组件再次获取焦点时,需要重新初始化和渲染该组件,并可能丢失之前的数据状态。而使用keep-alive后,组件会被缓存到内存中,当组件再次获取焦点时,只需要从内存中读取该组件的缓存实例即可,当然,之前的状态和数据也就得以保留下来。值得一提的是,keep-alive只适用于需要频繁切换的组件,否则,适得其反。由于已经被渲染过的组件会被缓存起来,下一次需要渲染时,组件的状态和数据都已经存在于实例中,不需要重新初始化,因此可以节省不少的渲染时间。

2023-06-02 22:21:27 123

原创 Vuex 是什么?

在Vuex中,我们定义了一个包含状态(state)、突变(mutations)、行动(actions)、组件(getters)等部分的全局store,通过显式提交(commit) mutation来改变state,在组件中可以利用dispatch和mapActions方法分发和获取actions,利用getters和mapGetters方法获取getters,利用mapState方法获取state,实现状态共享和响应状态变化的功能。而Vuex则提供了一种更好的解决方案,把所有的状态分离出来,并且可追溯。

2023-06-02 22:05:51 92

原创 Vuex有几种属性,它们存在的意义分别是什么?

先说结论:有五种,分别是 State、Getter、Mutation、Action、Module。

2023-06-02 21:48:44 233

原创 Vuex中的辅助函数怎么使用?

mapMutations:通过这个函数,我们可以将store中的mutations映射到组件的methods方法中,从而实现对store中状态变量的修改。mapGetters:通过这个函数,我们可以将store中的getters映射到组件的computed计算属性中,从而实现对store中计算状态的获取。mapState:通过这个函数,我们可以将store中的state映射到组件的computed计算属性中,从而实现对store中状态变量的访问。

2023-06-02 21:29:20 149

空空如也

空空如也

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

TA关注的人

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