- 博客(45)
- 收藏
- 关注
RSS订阅原创 core-js 解决浏览器兼容性问题的工具之一
core-js是一个非常流行的JavaScript库，它提供了大量的 polyfills，使得开发者可以在旧版浏览器中使用新的JavaScript特性。core-js实现了ECMAScript标准中的许多新特性，还包括一些Web APIs。这使得开发者可以编写现代JavaScript代码，同时确保代码在不支持这些特性的旧浏览器中也能正常运行。core-js。
2024-11-10 23:01:26
2225
原创 web语义化
Web语义化是指在网页开发中使用恰当的HTML标签和其他标记语言，来明确地表达网页内容的结构和含义。例如，未来的浏览器可能会提供基于语义的个性化内容展示，而语义化的网页正好为此打下了坚实的基础。：对于使用屏幕阅读器或其他辅助技术的用户来说，语义化的HTML可以显著提高他们的浏览体验。一方面能提升了网页的质量和用户体验，一方面也为网站带来了长远的好处，例如增强的可访问性、更好的搜索引擎可见度以及更高效的开发流程。这样的标题标签，搜索引擎可以轻易地识别出页面的标题结构，这对于关键词排名有着积极的影响。
2024-11-10 21:43:58
431
原创 全局注册和局部注册
全局注册的组件可以在应用的任何地方使用，不需要在每个使用它的组件中单独导入。2. 全局注册：在主文件（通常是 `main.js` 或 `main.ts`）中使用 `app.component` 方法进行全局注册。局部注册的组件只能在声明它的组件中使用。这种方法更适合那些只在特定组件中使用的组件，可以避免全局命名空间的污染。2. 局部注册：在使用该组件的父组件中通过 `components` 选项进行局部注册。适合特定组件中使用的组件，可以避免全局命名空间污染，保持代码的清晰和模块化。一次注册，到处可用。
2024-11-10 19:42:51
503
原创 前端滚动锚点（点击后页面滚动到指定位置）
2，如果不含有请求，记得在onMounted(vue)，或者useEffect(react)中进行滚动操作，如果是页面滚动，可能还要在加一个小延迟（setTimeout）需要注意的是，这个方法的调用者并不是要看到的元素，而是可滚动的元素。的话是调用他们的父级元素（id="home"的div盒子）它才是可滚动的元素.缺点：不好精确控制，只能让元素指定滚动到中间，顶部，底部，没法设置偏移。把调用该方法的元素滚动到屏幕的指定位置，中间，底部，或者顶部。3，如果页面的数据是请求来的，请确保数据渲染完成后进行滚动。
2024-11-10 08:15:58
1507
原创 前端之如何解决在切换组件时回到页面顶部
如何配置:vue-router支持scrollBehavior 配置项，可以指定路由切换时的滚动位置。在不同路由切换的时候，可以自动滚动到页面的顶部，而不是停留在原先的位置。
2024-11-08 00:30:39
188
原创 vue2和vue3的区别
2，可以额外叙述vue3并不是完全抛弃了defineProperty，通过reactive定义的响应式数据使用proxy包装出来，而ref还是用的defineProperty去给一个空对象，定义了一个value属性来做的响应式。3，组合式api的写法下，源码改成了函数式编程，方便按需引入，因为tree-shaking功能必须配合按需引入写法。1，响应式原理从property改成了用proxy，解决了数组无法通过下标修改，无法监听到对象属性的新增和删除的问题（产生响应式的问题）。也提升了响应式的效率。
2024-11-06 23:02:18
415
原创 前端性能优化2
常见问题：首屏速度，白屏时间等。操作速度以及渲染速度。一打开网页时白屏，是因为还需要从服务器那边请求HTML、JS这些过来，加载下来后才有东西渲染首屏速度参考两方面：白屏时间（资源加载时间、首屏js执行）、渲染页面（首屏数据请求、Dom渲染）渲染页面是比较快的，所以大多数时间是花在了白屏时间上，而其中的资源加载时间是占比比较大的。
2024-11-06 22:41:26
1378
原创 webworker
总结：js异步是始终要回到主线程的，webworker是不需要回到主线程，它自己创建一条线程自己去操作，这样主线程就可以不用管它，等它计算完了后，它可以主动把计算结果发给主线程（得主动发，不然收不到）有的东西是无法通过主线程传递个子线程的，比如方法，dom节点，些对象里的特殊设置(freeze，getter，setter这些，所以vue的响应式对象是不能传递的)众所周知，js一直被说不擅长计算确实，计算是同步的，大规模的计算会让is主线程阻塞，主线程阻塞的结果就是界面完全卡死一样。
2024-11-06 21:35:20
459
原创 组件封装思路
组件封装的核心思路是：把可复用的结构只写一次，把可能发生变化的部分抽象成。非复杂的模版抽象成props，复杂的结构模版抽象为插槽。如果主体内容是复杂的模版，有图片有列表等，可以抽象成。如果是像纯文本，像是一些主标题和副标题，可以抽象成。1.搭建纯静态的部分，不管可变的部分。纯展示类组件通用封装思路总结。2.抽象可变的部分为组件参数。
2024-10-30 15:24:03
403
原创 动态类的控制
这个对象中的键是类名，值是一个布尔表达式。这里的 `errorClass` 可以是任何上述提到的形式（字符串、对象、数组），而 `'always-present'` 则是一个始终存在的静态类。其中 `activeClass` 和 `errorClass` 可以是字符串、返回字符串的计算属性或者是包含类名的对象。- 如果 `hasError` 为 `true`，那么 `text-danger` 类会被添加。- 如果 `isActive` 为 `true`，那么 `active` 类会被添加。
2024-10-30 01:25:05
477
原创 引入js的script标签如何做到异步加载
defer：脚本异步加载且按顺序执行，保证在HTML解析完成后执行，不会阻塞HTML解析。async：脚本异步加载并尽快执行，可能在HTML解析完成前执行，不保证顺序，不会阻塞HTML解析。选择使用defer还是async取决于脚本的用途和对执行顺序的要求。如果脚本需要与DOM交互并依赖于特定的加载顺序，defer是更好的选择。如果脚本独立且不依赖于其他脚本或DOM结构，async则可以提供更快的加载速度。
2024-07-21 19:54:50
442
原创 有关css的题目
重排会在以下情况下发生：重排是一种开销较大的操作，因为它可能会影响整个 DOM 树或其较大部分，从而导致大量的计算和页面重新绘制。重绘（Repaint）是当元素的外观发生变化但不影响布局时触发的过程。重绘只涉及外观的改变，如颜色、背景、边框颜色等，不涉及元素的位置或尺寸的计算。重绘会在以下情况下发生：重绘的开销通常比重排小，因为它不涉及布局计算，只需要更新元素的外观。 盒模型（ 默认为标准盒模型 ） 构成：content，padding，border，margin 标准盒模型 content-
2024-07-20 23:36:47
847
原创 js中如何对数据类型进行区分判断？有几种方法？
1.：返回值包括 "undefined", "boolean", "number", "string", "bigint", "symbol", "object" 和 "function"。需要注意的就是typeof无法区分引用数据类型（），且对的判断为object2.：返回布尔值true或false需要注意的是instanceof适用于引用数据类型，如对象、数组、函数等。对于基本数据类型（如NumberStringBoolean等），instanceof并不能正确区分。3.：使用。
2024-07-19 16:02:20
272
原创 js中基础数据类型与引用数据类型的种类以及区分
引用数据类型有 Object（Array/数组和 function/函数 也属于对象的一种）栈：原始数据类型 → 先进后出栈维护结构 → 栈区由编译器自动分配释放 → 临时变量方式。原始数据类型有：undefined、null、boolean、number、string。而引用数据类型是引用关系。堆：引用数据类型 → 堆内存由开发者进行分配 → 直到应用结束。一、js有哪几种数据类型？引用类型数据量大、大小不固定，赋值给的是地址。可区分为：原始数据类型和引用数据类型。引用数据类型有：对象、数组、函数。
2024-07-19 09:06:45
250
原创 前端性能优化
同步模式又称阻塞模式，全阻止浏览器的后续处理，停止了后续的文件的解析，执行，如图像的渲染同步加载。流览器之所以会采用同步模式，是因为加载的js文件中有对dom的操作，重定向，输出document等默认行为，所以同步才是最安全的。随着Webpack等构建工具的能力越来越强，开发者在构建阶段可以随心所欲地打造项目流程，与此同时按需加载和按需打包的技术曝光度也越来越高，甚至决定着工程化构建的结果，直接影响应用的性能优化。只打包真正在运行时可能会用到的代码。2、按需加载表示的是代码模块在交互的时候需要动态导入。
2024-07-18 23:03:05
543
原创 路由的模式和区别
hash是可以看到内容的，history默认情况是看不到内容的。路由的模式有两种，一种是hash，一种是history。history会给后端发送一次请求，而hash不会。1.关于找不到当前页面发送请求的问题。2.关于项目打包前端自测问题。
2024-06-24 20:28:04
169
原创 在手机中调试前端项目
这样配置后，当手机和电脑处在同一WiFi下，就可以在手机上通过地址192.168.31.xxx:8080来访问项目。打开cmd，输入ipconfig。找到IPv4 地址。port为项目启动时的端口。
2024-05-17 11:57:27
234
原创 面试题一：
2.直接调用$refs修改子组件数据会造成数据混乱，不易排查。6. .sync修饰符的作用（elementUI里面的模态框用这个来控制显示和隐藏）（实现属性双向绑定）11.路由懒加载和异步组件（能够实现把这些首次加载没有用到的组件单独抽出来，可以形成分包）9.在父子组件嵌套的情况下，（created和mounted）生命周期顺序是怎样的。8.在Vue3中和Vue2中的v-model有什么区别，在实现双向绑定的时候。4.vuex页面刷新后state是否存在？10.Vue首屏性能优化。
2024-05-02 16:19:03
149
原创 $set()的使用方法
$set是 Vue.js 中的一个全局API，主要用于动态向响应式对象中添加新属性或者修改已有属性，并确保新属性也是响应式的。的值在未来被更改，界面将会自动更新。对象添加一个新的响应式属性。
2024-04-15 15:28:06
1712
1
原创 Sourcetree使用
原因可能是有相同的修改，处理的方法是：先复制相同的代码保存起来，然后删掉，再拉取，最后再把事先保存过的代码粘贴回去。点上方加号＋ → clone → 源路径(输入要获取的代码地址) → 目标路径(获取后要存放的地址) → 克隆。在文件状态里先暂存文件(暂存所有/暂存所选) → 提交 → 推送。但是可能会遇到拉取不下来的情况。
2024-04-01 16:13:07
273
原创 限制文本显示的行数
来指定文本显示的行数为2行。当文本超出2行时，超出部分会被省略号表示。属性只在WebKit浏览器中有效，其他浏览器可能不支持。例如限制文本只显示两行，超出部分用省略号...表示。
2024-03-25 13:54:01
1066
1
原创 Vue 的父组件和子组件生命周期钩子函数执行顺序？
以上是Vue的父组件和子组件生命周期钩子函数执行顺序的完整流程，包括加载渲染过程、子组件更新过程、父组件更新过程和销毁过程。父 beforeDestroy -> 子 beforeDestroy -> 子 destroyed -> 父 destroyed。
2024-03-21 18:00:16
915
1
原创 Class 与 Style 如何动态绑定？
在Vue.js中，可以使用v-bind指令来动态绑定class和style属性，从而根据数据的变化动态改变元素的样式。
2024-03-19 20:44:25
744
1
原创 for、forEach、map异同以及性能
综上所述，选择合适的循环方法取决于具体的需求和场景。如果只是简单的遍历数组并执行操作，可以使用。是 JavaScript 中常用的循环方法，它们各有不同的特点和用途。如果需要更灵活的控制循环条件和循环体，则可以使用。在性能要求较高的情况下，可以考虑使用。如果需要返回一个新的数组，则可以使用。循环来提高执行效率。
2024-03-18 19:55:05
724
原创 箭头函数与普通函数的区别
总的来说，箭头函数通常更简洁、更易读，并且能够更好地处理 this 的指向问题。但在某些情况下，普通函数仍然更适合，特别是需要作为构造函数使用或需要访问 arguments 对象时。根据具体的需求和场景，选择合适的函数类型来编写代码。
2024-03-17 12:07:58
379
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人