- 博客(13)
- 收藏
- 关注
RSS订阅原创 async/await 函数到底怎么使用 try catch ?
然后 getUserInfo 函数中断执行，这是符合逻辑的，对于有依赖关系的接口，中断执行可以避免程序崩溃，这里唯一的问题是 try catch 貌似占据了太多行数，如果每个接口都写的话看起来略显冗余。几种写法，初看可能觉得第三种 catch 这种写法是最好的，但是细想下，从用户体验上来看，我觉得 try catch 是最好的，逻辑直观、符合同步编程思维，控制台不会暴露。来捕获异常, 可是实际上我看了很多项目的代码，遵循的并不是严谨，很多都没有用，甚至 catch 函数都没写，这是为什么呢？
2025-04-23 09:46:29
408
原创 封装 axios 拦截器实现用户无感刷新 access_token
vuexmutations（vuex不过多介绍了）存储token与},},axios（也不过多介绍了）的响应拦截器if (!console.log('抱歉，您的登录状态已失效，请重新登录！')return Promise.reject(err)//重新发起请求})})约定返回401状态码表示access_token过期或者无效，如果用户发起一个请求后返回结果是access_token过期，则请求刷新access_token的接口。请求成功则进入then。
2024-12-25 14:55:22
1144
1
原创 接口一异常你的前端页面就直接崩溃了？
在 JavaScript 开发中，细节处理不当往往会导致意想不到的运行时错误，甚至让应用崩溃。可能你昨天上完线还没问题，第二天突然一大堆人艾特你，你就说你慌不慌。
2024-11-27 10:15:08
1000
原创 检查前端项目和node项目中未被使用的依赖包
Depcheck 是一款用于分析项目中依赖关系的工具，它可以帮助我们找出以下问题：在 package.json 中，每个依赖包如何被使用、哪些依赖包没有用处、哪些依赖包缺失。你可以看到，当我们添加了一个动态包导入之后，babel-polyfill 被从未使用的依赖中移除掉了。接下来的内容中，我们不是使用这个库，而是自己编写一个脚本来实现我们想要的功能。这两个正则表达式的目的是为了在文件中找到对指定依赖的引用，无论这些引用是静态的还是动态的。运行上面的代码我们可以获取到哪些依赖包是没有被使用到的。
2024-09-24 11:00:27
582
原创 工作中常用到的前端小知识
一个简单的原因就是，js在设计之初只是进行一些简单的表单校验，这完全不需要多线程，单线程完全可以胜任这项工作。即便后来前端发展迅速，承载的能力越来越多，也没有发展到非多线程不可的程度。而且还有一个主要的原因，设想一下，如果js是多线程的，在运行时多个线程同时对DOM元素进行操作，那具体以哪个线程为主就是个问题了，线程的调度问题是一个比较复杂的问题。HTML5新的标准中允许使用new Worker的方式来开启一个新的线程，去运行一段单独的js。
2024-09-24 09:40:01
614
原创 执行npm run serve/build的时候到底执行了什么？
举一反三，npm run serve也就不难理解了，node_modules/.bin下面一定有两个vue-cli-service的文件，然后很容易就会找到vue-cli-service.js 这个文件（未完待续）众所周知，npm run 执行的是package.json里面scripts对象的key对应的value值，npm run serve实际执行的就是npm run vue-cli-service serve。我们再换个写法，毋庸置疑，肯定会报错，因为找不到自定义的my-npm-test。
2024-04-25 15:34:49
1054
1
原创 SessionStorage多窗口到底能不能共享信息
其实不仅window.open("同源页面")这种方式新开的页面会复制之前的，通过a标签新开的页面同样也会，原理相同，在这就不赘述了。
2024-03-15 11:05:03
1328
1
原创 面试官：如何实现在浏览商品时，进入详情，再返回，列表刷新，滚动条还在之前的位置？
当用户点击商品详情时，我们记录当前的滚动条位置，然后在返回列表页时，首先触发列表的刷新操作，然后再将之前记录的滚动条位置重新设置回去。利用Vue Router来管理页面跳转，使用了VueX来存储和恢复滚动条位置。在浏览商品时，点击商品详情，然后返回，要求列表刷新，同时滚动条还在之前的位置，怎么实现？组件更新时，检查是否有之前保存的滚动条位置，并将滚动条位置恢复到之前的状态。页面时，记录当前滚动条位置并将其保存在Vuex store 中。action来保存当前滚动条位置，在返回列表页时，再使用。
2024-01-25 11:32:05
1418
原创 一个页面同时发出百条请求时怎么处理？
在这种情况下，可以将一部分内容延迟加载，例如将广告或某些推荐文章放置在用户滚动到页面底部时才加载，而不是在页面初始加载时就全部请求和展示。在发送批量请求时，前端可以将多个独立的请求合并为一个请求发送给后端，通常使用类似于RESTful API的方式。如果不使用批量请求和数据合并，页面可能会发出100条单独的请求来获取每个用户的动态信息，导致大量的网络开销和响应时间延长。在处理多个请求时，可以根据请求的重要性和紧急程度为它们设置优先级，以确保重要内容能够优先加载，从而提高用户感知的加载速度。
2024-01-19 11:00:02
2734
1
原创 高质量的前端代码
有良好的可读性，代码应易于理解。如使用清晰的命名、保持函数和方法简短、使用注释来解释复杂的代码段等。应该尽可能地简洁，避免不必要的复杂性和冗余。在一个项目中，代码应该有一致的风格和模式。这使得代码更易于阅读和理解。可为维护性高，应该易于修改和扩展。这通常意味着代码应该遵循某种设计模式，避免过度复杂的依赖关系，并且有良好的模块化。好的代码应该是直观的，当有人需要进行修改时，他们应能迅速找到需要修改的部分，能够快速进行更改，而且不容易引入新的错误。健壮性有考量，对于边界场景有覆盖和处理。
2024-01-16 11:00:50
2803
1
原创 beforeRouterEnter为data赋值未生效
之前在mounted或在created中写的方法通通放在next的回调函数中，赋值操作进来写在方法中，问题就解决了。从不同来源跳转该页面，为isView赋boolen值，进而判断是否显示某些操作。当执行next里面的时候，该组件内生命周期几乎已经执行完毕（异步除外）
2024-01-15 15:35:18
795
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人