自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

GodLoveMe的博客

分享技术....

  • 博客(74)
  • 问答 (1)
  • 收藏
  • 关注

原创 使用a标签下载文件

实现的原理是,给到一个下载链接,前端动态生成一个a标签,用a标签实现把文件下载下来的功能。

2024-05-17 10:15:10 66

原创 JS 实现一个简单的双向数据绑定

以上就是一个简单的双向数据绑定。二、用Proxy实现。

2024-05-15 17:02:15 124

原创 JS 实现冒泡排序

看起来没问题,不过一般生成环境都不用这个,原因是效率低下,冒泡排序在平均和最坏情况下的时间复杂度都是O(n^2),最好情况下都是O(n),空间复杂度是O(1)。因为就算你给一个已经排好序的数组,如[1, 2, 3, 4, 5, 6],它也会走一遍流程,白白浪费资源。那么好的解决办法是什么?升序冒泡:两次循环,相邻元素两两比较,如果前面的大于后面的,就交互位置;降序冒泡:两次循环,相邻元素两两比较,如果前面的小于后面的,就交互位置;答案是:加个标识,如果已经排好序的,就直接跳出循环。

2024-05-14 18:21:27 140

原创 前端面试题大合集4----框架篇(React)

setState 只在合成事件和 hook() 中是“异步”的,在 原生事件和 setTimeout 中都是同步的。方法,由于Dom事件被阻止了,无法到达document,所以合成事件自然不会被触发。React合成事件机制:React并不是将click事件直接绑定在dom上面,而是。React在事件绑定时有一套自身的机制,就是合成事件。Dom事件流分三个阶段:事件捕获阶段,目标阶段,事件冒泡阶段。,然后React将事件封装给正式的函数运行和处理。

2024-05-13 10:28:05 873

原创 JS 实现二分法查找

二分法查找,也称折半查找,是一种在有序数组中查找特定元素的搜索算法。注意前提是数组的顺序是从小到大或从大到小排列好顺序的。具体的实现步骤是:(1)首先,从有序数组的中间的元素开始搜索,如果该元素正好是目标元素(即要查找的元素),则搜索过程结束,否则进行下一步。(2)如果目标元素大于或者小于中间元素,则在数组大于或小于中间元素的那一半区域查找,然后重复第一步的操作。(3)如果某一步数组为空,则表示找不到目标元素。

2024-05-09 15:45:34 137

原创 JS 实现快速排序

(2)所有小于"基准"的元素,都移到"基准"的左边;所有大于"基准"的元素,都移到"基准"的右边。(3)对"基准"左边和右边的两个子集,不断重复第一步和第二步,直到所有子集只剩下一个元素为止。(1)在数据集之中,选择一个元素作为"基准"(pivot)。

2024-05-09 15:33:00 102

原创 JS 请编写一个Child继承Parent的方法

JS 有哪些继承方式JavaScript 中常见的继承方式有以下几种:原型链继承构造函数继承组合继承(原型链加构造函数)原型式继承寄生式继承ES6 的class的extends关键字(用于现代类继承)

2024-05-09 15:24:11 236

原创 JS数组去重的方法

介绍一下数组常用的去重复方法。

2024-05-09 11:37:14 102

原创 前端面试题大合集3----网络篇

TCP的性能瓶颈主要在于其握手过程和重传机制,而UDP的底层协议,就是大名鼎鼎的QUIC协议,一个运行在传输层的协议。在QUIC中,客户端可以无缝的从一个服务器切换到另一个服务器,而不需要断开原来的连接。当客户端想要切换到另一个服务器时,它会向新的服务器发送一个包含当前连接状态信息的包,新的服务器收到后,就可以立即开始处理客户端的请求。http3.0 :使用了 QUIC,开启多个 TCP 连接,在出现丢包的情况下,只有丢包的 TCP 等待重传,剩余的 TCP 连接还可以正常传输数据;

2024-05-06 09:35:55 488 2

原创 前端面试题大合集2----基础篇

事件代理( Event Delegation ),又称之为事件委托。是 JavaScript 中常用的绑定事件的常用技巧。顾名思义,“事件代理”即是把原本需要绑定的事件委托给父元素,让父元素担当事件监听的职务。事件代理的原理是DOM元素的事件冒泡。使用事件代理的好处是可以提高性能可以大量节省内存占用,减少事件注册,比如在 table 上代理所有 td 的 click 事件就非常棒可以实现当新增子对象时无需再次对其绑定数据封装类对象:Object、Array、Boolean、Number、String。

2024-04-28 14:35:02 668

原创 git将本地分支推送到远程

git push origin feature/0.38.0

2024-04-18 14:41:42 65

原创 前端面试题大合集1----基础篇

原型链就是实例对象在查找属性时,如果查找不到,就会沿着__proto__去与对象关联的原型上查找,有则返回,如果找不到,就去找原型的原型,直至查到最顶层Object函数的原型,其原型对象的__proto__已经没有可以指向的上层原型,因此其值为null,返回undefined。但是对于复合数据类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指向实际数据的指针,const只能保证这个指针是固定的(即总是指向另一个固定的地址),至于它指向的数据结构是不是可变的,就完全不能控制了。

2024-04-10 17:48:12 250

原创 从一个url输入到正常显示出来一个网页经历了哪些过程

最后进行浏览器渲染,浏览器对请求回来的文件进行解析,解析成浏览器可以识别的格式,然后渲染成我们可以看到的网页。发起HTTP请求把相关的html文档和相关资源例如css文件,图片从服务端给请求回来。建立TCP连接要三次握手,断开连接要四次挥手。主要是以上的几个步骤了。

2024-01-27 11:35:42 531 1

原创 DNS寻址过程

如上的简短概括一下,整个的流程要记清楚,方便在面试的时候跟面试官对答如流,字字珠玑,把他给说的心服口服的,完全征服面试官!

2024-01-19 17:36:53 634

原创 requestAnimationFrame实现动画

实现浏览器在每一帧中,将页面div元素的宽度变长1px,直到宽度达到100px后停止。

2024-01-12 10:21:33 403

原创 JS中call,apply,bind的区别和作用

【代码】JS中call,apply,bind的区别和作用。

2024-01-06 21:05:31 381

原创 给console.log加颜色

【代码】给console.log加颜色。

2023-08-29 18:07:47 610

原创 input type=number解决可以输入字母e的问题

将上面代码里面的属性都添加到这个组件里面就可以啦。

2023-08-18 14:10:23 272

原创 JS 删除的是最后一页的最后一条,页码设置逻辑

3、如果删除成功之后的总页数比小于当前总页数,需要把当前页码减去1;否则,直接进行列表数据的请求。2、删除成功之后的总页数与当前总页数进行比较。1、计算操作后的总页数。

2023-08-14 16:51:14 180

原创 antd的Form表单

最近开发项目,发现在antd的form表单中直接嵌套下拉选框,忌廉选择级联选择器这些组件,发现在给这些组件设置值或者获取值的时候,发现方法都不好用了,发现了一个解决办法,就是一定要加上一个div,这样子问题就解决了。

2023-07-24 18:02:34 73

原创 text-overflow:ellipsis 不显示省略号问题

的原因,讲该元素设置为display:block就可以解决问题了。设置单行文字长度多长以省略号显示。结果发现没有发生作用。

2023-07-05 15:45:19 635

原创 flex布局

以上就是flex布局常用的属性,有需要的可以参考一下。参考文章:1、Flex 布局教程:语法篇 - 阮一峰的网络日志2、3、

2023-06-13 11:18:53 974

原创 CSS3实现边框圆角渐变色

实现元素的圆角➕边框渐变色➕内容填充也是渐变色

2023-06-09 10:38:35 2054

原创 webstorm常用快捷键

webstorm常用快捷键

2023-04-23 14:05:10 1465

原创 reactHook实现EventBus

react,EventBus,ReactHook中使用EventBus,同步调用和异步调用。

2022-06-22 16:46:21 2399

原创 mockjs常用到的知识点

mockjs,模拟经纬度

2022-06-22 15:19:03 501

原创 JS 实现滚动定位和点击button跳转

最近在开发项目的时候,有一个交互上的需求,就是滚动内容区域的不同模块,要高亮显示上方模块对应的button,用到的是react+TS开发的项目,具体的代码如下:1.滚动定位到具体的tab下面的方法是关键的一个方法,就是获取一组button具体对应的id/** * 设置第二个tab的active的key * scrollTop + clientHeight == scrollHeight,说明滚动到最底部了,把值设置成20px * @param scrollTop * @param do

2021-10-25 14:58:13 1130

原创 react 父子组件的执行顺序

这里一定要注意一下,是先执行子组件,然后再执行父组件相关的代码。

2021-10-12 17:09:21 1777

原创 Mac系统安装Homebrew

如果官网安装不成功,可以尝试一下在终端输入如下指令:/bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)"在输入以上指令要确保没有电脑没有连接VPN,可以用中国移动的手机热点去尝试。按回车后,根据提示操作:输入镜像序号 --> 输入Y,回车等待brew安装完成即可。...

2021-08-27 12:08:54 114

原创 webstorm启动报错Load error: undefined path variables

启动webstorm时,会报如下错误:出现这个问题的原因是由于less的环境没有设置好,请看解决方法:1.打开设置的面板,如下所示:2.重启webstorm,再次打开就没有此错误了

2021-08-19 09:40:11 2425

原创 useEffect使用技巧

useEffect如果第二个参数的数组不为空,传了多个参数的情况下,使用总结。如果第二个传了多个参数,如何查看是那个参数发生了变化呢?请看代码:// 在一个正常的Hooks函数中,有如下代码,此代码实现的原理就是通过useRef来达到缓存的目的 const [a, setA] = useState(); const [b, setB] = useState(); const [c, setC] = useState(); const myRef = useRef({a, b, c})

2021-04-20 10:39:19 1117 2

原创 使用Hooks的注意事项

在使用Hooks的过程中,需要注意的两点是: 不要在循环,条件或嵌套函数中调用Hook,必须始终在React函数的顶层使用Hook。这是因为React需要利用调用顺序来正确更新相应的状态,以及调用相应的钩子函数。一旦在循环或条件分支语句中调用Hook,就容易导致调用顺序的不一致性,从而产生难以预料到的后果。 只能在React函数式组件或自定义Hook中使用Hook。 为了避免我们无意中破坏这些规则,你可以安装一个eslint插件:npm install eslint-plugin-

2021-02-08 20:33:49 2056

原创 Vue2双向数据绑定原理

<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-.

2021-02-04 20:19:07 101

原创 CSS3中的伪元素选择器与scss

以vue组件未例子来演示代码:<template> <div> Practice <ul> <li>面包屑一级导航</li> <li>二级导航</li> <li>内容</li> </ul> 哈哈哈 </div></template><script>export de

2021-01-26 15:44:02 2539

原创 vue2相关的技术栈对应的环境搭建

本文介绍了两个搭建好的环境,一个是web端,一个是mobile端,都在github上有代码的,欢迎star!欢迎PR!采用的技术栈包括:vue-cli3脚手架搭建出来的(SPA)单页面应用,涉及的技术包括vue2,vue-router,VueX,axios,sass,等等。web端:github-web端链接mobile端:github-mobile端链接欢迎在下方评论参与讨论!...

2020-12-30 11:52:44 213

原创 vue-cli3搭建环境报错

vue常见错误ERROR Error: vue-loader requires @vue/compiler-sfc to be present in the dependency tree.解决办法:npm i -D vue-loader@14这个时候报错就没有了

2020-12-29 16:29:47 359

原创 ES6的Promise结合reduce构建顺序执行队列

ES6的promise是用来处理异步操作的,他的一些基础的用法本篇就不在赘述,感兴趣的同学我可以给你们推荐几篇文章,让你们提升一下对Promise的基本认知,推荐如下:高级前端进阶-微信公众号上推送的一篇文章ES6Promise实战接下来话不多说,直接上代码: const createPromise = (id: number) => () => new Promise(resolve => setTimeout(()=>{ c

2020-12-24 17:28:30 1292 1

原创 JS 深度优先遍历与广度优先遍历 实现查找

在日常的开发工作中,牵扯到层级结构比较复杂的节点,如树形节点,级联选择器,这些都是牵扯到前端算法的遍历的;本文将介绍常用到的两种遍历方式:深度优先遍历和广度优先遍历深度优先遍历:depth first search广度优先遍历:breadth first search1.示意图通过两组示意图来明白什么叫做深度优先遍历和广度优先遍历图一(深度遍历示意图)深度遍历查找会按照图中绿色标注的数字去查找,就相当于是一条道走到黑,如果没有叶子节点的话,会再拐回来,回溯到上一个节点再搜索其余的,按

2020-12-17 19:06:29 1538

原创 React-移动端-用canvas实现电子签名,以及下载成PDF或者jpeg图片

前言电子签名通俗来说就是通过技术手段实现在电子文档上加载电子形式的签名,其作用类似于纸质合同上的手写签名或加盖的公章。虽然电子签名多年来合法性一直遭到质疑,但其在企业工作流审批、请柬、单据保全等场景应用广泛,最近的项目中就有这样一个手写签名并生成PDF文件的需求。实现思路使用canvas来实现手写签名的功能,然后将canvas转化为图片,贴在签名的位置; 将整个需要生成文档的dom区域(canvas对应的dom节点所在的区域)使用html2canvas插件转成一张大图; 使用JsPDF插件将

2020-12-10 14:13:06 1770 2

原创 Vue slot的使用范例

// MyComponent.vue这个是主文件<template> <div> <h2>匿名插槽</h2> <TodoList> <template v-slot:default> 任意内容 <p>我是匿名插槽内容</p> </template> </TodoList> <h2>具.

2020-11-26 14:10:53 128

空空如也

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

TA关注的人

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