- 博客(30)
- 收藏
- 关注
RSS订阅转载 ts封装axios,多个实例灵活配置，拦截提示。
写在前面虽然说Fetch API已经使用率已经非常的高了，但是在一些老的浏览器还是不支持的，而且axios仍然每周都保持2000多万的下载量，这就说明了axios仍然存在不可撼动的地位，接下来我们就一步一步的去封装，实现一个灵活、可复用的一个请求请发。这篇文章封装的axios已经满足如下功能：无处不在的代码提示；灵活的拦截器；可以创建多个实例，灵活根据项目进行调整；每个实例，或者说每个接口都可以灵活配置请求头、超时时间等；取消请求（可以根据url取消单个请求也可以取消全部请求）。基础封装
2022-04-07 09:57:26
2128
原创 JS高级应用--防抖、节流、数组扁平化、柯里化、对象拷贝
JS高级应用--防抖、节流、数组扁平化、柯里化、对象拷贝防抖节流数组扁平化柯里化对象拷贝防抖,浏览器resize、scroll、keypress、mousemove等事件触发时，会不断的调用绑定在事件上的回调函数，浪费资源、降低性能，为了优化体验，对这类事件调用次数限制。
2022-02-24 15:44:12
380
转载 经常需要用到的34种JS优化技巧
你可能做了很长时间的 JavaScript 开发，但有时候你可能没有使用最新的 JavaScript 特性或技巧，这些特性和技巧可以在不需要编写额外代码的情况下解决你的问题。它们可以帮助你写出干净且优化的 JavaScript 代码。此外，如果你在 2021 年准备去参加面试，可以参考本文的内容。1. 带有多个条件的 if 语句把多个值放在一个数组中，然后调用数组的 includes 方法。//longhandif (x === 'abc' || x === 'def' || x === 'ghi'
2021-07-05 12:12:06
304
原创 vue初始化项目后，git提交到gitee远程仓库
vue初始化项目后，git提交到gitee远程仓库使用vue create 初始化cli3项目后，在git新建仓库，使用git工具提交到gitee远程仓库直接使用“git remote add origin https://gitee.com/huanmeng122/preparation.git”提交后，会提示错误：fatal: remote origin already exists.翻译如下：fatal: remote origin already exists.致命：远程源已存在。需
2021-05-18 17:38:57
671
原创 如何精准判断数据类型
如何精准判断数据类型typeof 实现原理Object.prototype.toStringinstanceof 操作符总结typeof 实现原理typeof 一般被用于判断一个变量的类型，我们可以利用 typeof 来判断number, string, object, boolean, function, undefined, symbol 这七种类型，但是，很遗憾的一点是，typeof 在判断一个 object的数据的时候只能告诉我们这个数据是 object, 而不能细致的具体到是哪一种 objec
2020-11-17 21:42:26
384
翻译 如何获取Google地图API密钥？
如何获取Google地图API密钥？使用Google地图的用户需要注意了！Google地图于2016年6月22日更新了Google地图API接口，更新接口后必需要申请Google地图API密钥才可以使用Google地图。如果您以前引用的Google地图中没有设置API密钥，可能会在页面上出现报错提示：“Oops! Something went wrong. This page didn’t l...
2019-08-21 23:08:56
8299
转载 测试 JavaScript 函数的性能
在软件中，性能一直扮演着重要的角色。在Web应用中，性能变得更加重要，因为如果页面速度很慢的话，用户就会很容易转去访问我们的竞争对手的网站。作为专业的web开发人员，我们必须要考虑这个问题。有很多“古老”的关于性能优化的最佳实践在今天依然可行，例如最小化请求数目，使用CDN以及不编写阻塞页面渲染的代码。然而，随着越来越多的web应用都在使用JavaScript，确保我们的代码运行的很快就变得很重要...
2018-12-08 09:18:53
414
原创 SSMS--SQL Server Management Studio语言切换中文问题
SSMS--SQL Server Management Studio语言切换问题问题描述问题解决问题描述安装SSMS英文版后重新安装回中文版，依旧显示英文界面。问题解决运行 SSMS 并通过以下菜单选择你想要使用的语言：“工具” | “选项” | “区域设置”关闭并重新启动 SSMS。英文版本为：“Tool” | “Options” | “International Setting...
2018-11-14 09:31:43
37684
5
原创 Ajax跨域访问出现Uncaught SyntaxError: Unexpected token : 解决方案
在访问外网提供的Api时出现跨域问题，尝试使用普通方式JSONP解决，但是出现Uncaught SyntaxError: Unexpected token : 的错误，所有专注于研究ajax请求跨域问题，在前人基础上逐渐理出脉络，以此记之，希望对大家有所帮助。搜罗资源比较杂乱，所有看到“撒网要见鱼”的一篇文章，下面的内容以此为蓝本，加入自己的总结。感谢“撒网要见鱼”。关于跨域，有N种类型，本文...
2018-08-08 15:35:59
123303
5
原创 浏览器缓存详解:expires,cache-control,last-modified,etag详细说明
每个状态的详细说明如下：1、Last-Modified在浏览器第一次请求某一个URL时，服务器端的返回状态会是200，内容是你请求的资源，同时有一个Last-Modified的属性标记(HttpReponse Header)此文件在服务期端最后被修改的时间，格式类似这样：Last-Modified:Tue, 24 Feb 2009 08:01:04 GMT客户端第二次请求此UR...
2018-07-30 14:28:27
550
转载 前端性能优化
性能衡量指标指标：白屏时间首屏时间 用户可交互时间 完全加载时间 首字节时间 DNS 解析时间 TCP 连接时间 HTTP 请求时间 HTTP 响应时间 维度：运营商网络URL性能优化高频事件消抖、节流。使用_.debounce()和_. throttle()，控制高频事件的操作，如：scroll、onChangeJavaScritp很快，...
2018-07-26 17:57:02
183
转载 fetch API获取返回值的方式
使用fetch API来做后端请求，相比较传统的Ajax方式，在写出的代码上更加容易理解，也更便于别人看懂。但是在使用的过程中，经常有同学不能顺利从传统的Ajax请求（如果使用jquery的话，就是$.ajax,$.post,$.get）转移到新的fetch方式，很多时候就是卡在了获取响应数据的环节上。用fetch来获取数据，如果响应正常返回，我们首先看到的是一个response对象，其中包括返回的
2017-11-11 10:51:48
18429
2
原创 fetch 使用，如何能够接收JS的传值
fetch 使用，如何能够接收JS的传值使用fetch基本方式：fetch('https://mywebsite.com/endpoint/', { method: 'POST', headers: { 'Accept': 'application/json', 'Content-Type': 'application/json'}, body: JSON.stringify
2017-11-11 09:58:34
2126
转载 欢迎使用CSDN-markdown编辑器
互联网架构设计：高性能的前端当我们讨论互联网产品高性能架构的时候，往往聚焦在高性能的后端服务。其实用户是通过客户端前端来直接体验互联网产品的，前端高性能设计也是很重要的。用户使用互联网产品的基本流程如下图。用户使用电脑Web浏览器或者手机App来直接使用互联网产品服务，用户终端将会把用户的操作行为请求到网站服务器，网站服务器对请求进行响应，用户终端（Web浏览器或者手机App）将解析服务器的响应进行
2017-08-09 15:25:10
158
转载 【移动端】使用REM进行的响应式布局
工具ViewtoREM：PX转换到REM（自动预处理）REM的定义： rem是相对于根元素<html>来设置字体大小的，这样就意味着，我们只需要在根元素确定一个参考值，在根元素中设置多大的字体，这完全可以根据您自己的需求。REM与EM、PX的区别： PX：像素，比较精确的单位，但不好做响应式布局 EM：以父节点font-size大小为参考点，标准不统一，容易造成混乱REM支持的浏览器： 支持
2016-11-16 08:23:39
2674
转载 HTML5中的Web Notification桌面通知
HTML5 Web Notification通知是属于桌面性质的通知，有点类似于显示器右下角蹦出的QQ弹框，杀毒提示之类的，跟浏览器是脱离的，消息是置顶的。
2016-09-20 10:58:18
849
转载 jQuery点击自身以外地方关闭弹出层-closest()
百度，谷歌搜索时出现的提示框，点击输入框外部任意地方后，隐藏提示框。但是通过jquery怎么实现这个交互效果呢，closest()函数
2016-07-13 08:43:45
9691
1
转载 input keyup 500ms 延时输入 事件处理
==================input keyup 500ms 延时输入 事件处理==================var last;$(".input").keyup(function(event){//.input为你的输入框 last = event.timeStamp; //利用event的timeStamp来标记时间，这样每次的keyup事件都会修改
2016-07-12 10:02:21
914
转载 如何解决inline-block元素的空白间距
有关于使用inline-block来代替float的讨论也蛮多的，最常说的就是使用inline-block来代替float进行布局，或者使用inline-block来实现元素的居中效果。前面《CSS3制作的分页导航》一文中就是使用的inline-block制作的居中效果，不过留下了一上问题，就是使用inline-block的元素之间会存在“4px”的空白间距。那么今天我们就一起来说说这个“4px”的
2016-06-18 09:15:30
359
转载 chrome浏览器设置小于12号的字体不起作用？
在某些chrome浏览器下，css里设置的10号字体竟然不起作用！仍显示12号大小，对比firefox、ie6、7、8、9，他们的显示都是好的。要是你也碰到这问题，可以这样解决：-webkit-text-size-adjust: none;在css里加上这一句就可以。如你的样式是这样 .copyright{ font-size:10px; background-color:#ee
2016-04-29 09:27:53
913
转载 浅析CSS——元素重叠及position定位的z-index顺序
HTML5有无限可能，总是在释出一些新鲜实用的功能，让原生的web环境更加炫酷。今天看到datalist 这个元素，可以用来预先定义一个输入框的潜在选项，也就是我们在平时项目中经常用jQuery插件或者自己写JS来实现的autocomplete「自动补全，但似乎自动提示更贴切一些」功能。具体来说，页面上的input还是原来的input，只是在它的下面定义一下新的datalist在其中填充触发提示的文
2015-12-19 08:33:25
308
转载 从css3书写顺序引出来的border-radius参数
当时写这篇文章主要是想探讨一下优雅降级和渐进增强的区别，按照正常的逻辑思维，不管是降级还是增强，应该对于效果是没什么区别的，因为后者会覆盖前者，关于CSS3属性的书写顺序，标准的css3属性和带webkit的前缀在某些情况是不一样的效果，比如border-radius和-webkit-border-radius带两个参数时，显示的效果并不一样：.not-a-square { border-ra
2015-09-16 08:42:51
515
转载 移动端网页开发经验与心得-分辨率、内容与缓存
智能手机发展确实很迅速，像今年，我的大部分工作就都在移动端网页上。 再往前些年，看到的手机版/移动版网页，限制于浏览器与手机性能，2g网络速度等 网页设计无非是蓝、黑、白，界面单调，并且要尽可能的设计简单。 现在情况就大不相同了，软件上webkit内核浏览器大行其道，硬件突飞猛进，网速来说，4g正炒得火热。 下面就和大家分享一下我的一些移动端网页设计经验与心得。1、分辨率这应该是移动端网页最
2015-09-11 16:40:52
1130
转载 Flex 布局教程：语法篇
网页布局（layout）是CSS的一个重点应用。 布局的传统解决方案，基于盒状模型，依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。2009年，W3C提出了一种新的方案—-Flex布局，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持，这意味着，现在就能很安全地使用这项功能。Flex布局将
2015-08-31 18:04:39
899
转载 设备像素比devicePixelRatio简单介绍
本文所说devicePixelRatio其实指的是window.devicePixelRatio, 被所有WebKit浏览器以及Opera所支持，随着显示器的发展，这个属性也慢慢登上了前端技术的舞台。 本文内容大部分属于翻译性质内容，因此，会不那么通俗易懂。不过，你是做手机开发的，或是有意向的，本文的内容如果细细读来，还是有些收获的。 一、定义 定义如下：window.devicePixelR
2015-08-22 18:19:59
11284
转载 响应式网页设计
概念 响应式网页设计最初是由 Ethan Marcotte 提出的一个概念：为什么一定要为每个用户群各自打造一套设计和开发方案？Web设计应该做到根据不同设备环境自动响应及调整。当然响应式Web设计不仅仅是关于屏幕分辨率自适应以及自动缩放的图片等等，它更像是一种对于设计的全新思维模式；我们应当向下兼容、移动优先。
2015-08-22 11:09:24
659
转载 通过预加载器提升网页加载速度
预加载器（Pre-loader）可以说是提高浏览器性能最重要的举措。Mozilla 官方发布数据，通过预加载器技术网页的加载性能提升了19%，Chrome测试了 Alexa 排名前2000名网站，性能有20%的提升。它并不是一门新技术，有人认为只有 Chrome 才具备这个功能。也有人认为它是有史以来提升浏览器性能最有效的方法。如果你第一次接触预加载器，也许心中已经有了无数个问号。什么是预加载器？
2015-08-21 16:39:37
421
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人