- 博客(153)
- 收藏
- 关注
原创 项目中遇到的关于映射二维数组的方法
最近有这样的一个需求,后端给我一个数据类型dataType,brr 数组是返回的数据,id 对应数据的类型我们需要生成这样的数据结构将 brr 二维数组变成下图这样的数据结构brr 数组目标结构类型从结构类型的变化来说,我们将数组按类型依次排列起来了,没有出现的id ,变成空数组了。我们渲染类型时,会将后端返回的数据,依次对应起来了。全部代码...
2022-06-30 10:35:54
409
原创 前端 vue生命周期
beforeCreatecreatedbeforeMountedmountedbeforeUpdataupdatedbeforeUnmountedunmountedvue3 compositionAPI生命周期有何区别keep-alive组件的生命周期在正常开发,挂载周期的执行顺序为:在数据更新阶段执行顺序为:在组件销毁阶段执行顺序为:...
2022-06-28 23:23:19
189
原创 虚拟DOM真的是最快的吗?
以前一直以为操作虚拟DOM是在最快的,其实不是的。虚拟DOM并不快,JS直接操作DOM才是最快的。前端框架流行的,数据驱动视图,要有一个合适的方案,data改变不能让所有的DOM重建虚拟DOM使用的diff算法,是递归的,可以找到data改变的DOM,进行视图更新。不是因为快,而是因为合适...
2022-06-28 22:30:40
129
原创 项目中 if else 的代替写法
什么你敢在项目中写多个if else判断不怕被打死?在项目中超过或者等于3个if else的判断的话,这种写法是不友好的。项目中遇到这样的一个需求,切换不同的选项,展示不同的数据。正常的写法,就是 if else 判断切换的索引值,然后展示不同的数据下面的这种写法可能会更好有人会觉得这种写法,代码好像更多了,这种想法是错误的。很喜欢一个老师说过的话:如果写的代码是为了,更好的展示数据层次性的话,多余的代码是有必要的...
2022-06-28 19:49:38
257
原创 前端 for... in for ...of
for…in 得到key值for… of 得到value值for of 是迭代器的语法糖forEach
2022-06-27 22:58:18
168
原创 Ajax Fetch Axios三者区别
从维度上来说三者都是实现网络请求的,fetch是最底层的,接着是Ajax 最后是axios,Ajax原生API HMLHttpRequestajaxaxiosfetch
2022-06-27 21:02:46
413
原创 前端预防攻击手段
XSSvue 和 react 插值表达式,都是可以预防的但是 vue v-html react dangerouslySetInnerHTML这个是没有预防的预防手段比如csrf 跨站请求伪造预防手段比如点击劫持点击劫持预防DDoSSQL注入
2022-06-26 20:20:58
716
原创 HTTP 和 HTTPS
HTTPHTTPSHTTPS不是新的应用层协议,只是在HTTP协议上进行加密了。HTTPS采用了对称加密和非对称加密对称加密传输效率比较高对称加密有风险,秘钥是服务端传给客户端的,如果秘钥在传输过程被第三方劫持了,那么对称加密就没有任何意义了。非对称加密传输效率比较低中间人攻击这种加密也会存在一种风险,中间人攻击,黑客可以有自己的公钥和私钥,将服务端传给客户端的公钥,替换成自己的公钥,客户端传给服务端,拦截加密的随机码,用自己的私钥来解密,可以拿到随机码了。解决方案利用浏览器对服务端给的公钥进行验
2022-06-26 14:24:01
388
原创 前端判断数据类型的方式
1. typeof2.instanceof原理: 判断某个实例对象是否是这个构造函数的实例需要注意一点:如果判断数组和对象的话,需要优先判断数组的类型为什么上面都打印 true实际上数组和对象的祖先都是Object3. Object.prototype.toString.call()...
2022-06-22 22:34:12
871
原创 前端 forEach 和map的区别
关于这两者的区别是一直想写的,网上看别人写的不是很全面。1. map2.forEach正常下的 return我们需要中断的话使用try catch 来捕获错误信息关于 try catch类似于 promise then catch以下几种情况下会用到...
2022-06-22 22:19:16
292
原创 前端常用的css面试题
1. 清除浮动的方案元素浮动是会脱离文档流的2. 标准盒模型和怪异盒模型怪异盒模型又被称为IE盒子标准盒模型的 width = 自身的width + padding + margin + border怪异盒模型 width = 设置的width = 自身的width + padding + margin + border总结就是 设置了一个盒子 100px怪异盒子的话就是width + padding + margin + border == 100px标准盒子 width = 100px
2022-06-20 23:52:27
117
原创 pm2 的学习
1. pm2的优势2.pm2的安装3.pm2 的启动以下是三种启动方式4. pm2 管理流程5.pm2日志查看日志配置文件进行监听日志命名为 pm2.config.js启动命令为 6. pm2 信息目前接触的比较基础,先把自己常用的写下来,加深印象,做一个笔记。文档官方地址pm2文档官方地址...
2022-06-20 21:52:42
271
原创 x项目部署 全栈项目,部署和安装
1. 今天把项目部署成功了,还是很开心了,某种意义上是我自己第一次部署全栈的项目。2. 部署成功之后觉得这个项目好像没有那么难吧。整个流程需要的东西我简单的讲一下整个项目的流程。我用的是node+koa2+ejs+mysql+redis的项目。我们需要做什么,我会先将服务端的部署。买一个阿里云服务器,远程连接,进入控制台。安装 node 环境我们去下图下载 linux 安装包(),我们在远程连接中 cd /usr/local/node 进入这个目录下,把下载的压缩包放入这个目录下(使用
2022-06-19 21:57:25
457
原创 关于使用koa2开发接口,pm2和Nginx代理
把压缩包放入 /usr/local/node 目录下执行下面的命令 对文件进行解压,这是Linux文件解压命令,zip 的解压是 解压完成之后进入解压文件夹 /bin 目录执行下面命令配置环境变量接下来我们 node -v 可以看到版本号了。node 环境也就是安装完成了。接下来执行 npm i 安装我们需要的依赖在执行 node api.js我们再开一个远程服务器 执行下面命令,测试node接口可以使用cd /node_koa安装 pm2 输入软连接命令 启动pm2然后执行
2022-06-16 00:54:11
446
原创 vue 中的this.nextTick遇到的问题-工作中的问题
最近有看了之前一直想解决的bug, 之前在uniapp插件市场中找了一个组件。然后发现了一个bug 竟然是 this.nextTick 导致的。简单的介绍一下 this.nextTick,将回调延时到 DOM更新之后调用。数据是同步更新的, 但是DOM是异步更新的,具体的话可以看JS的事件机制,放入队列中更新。有些文章说下面两个代码是可以等价的。在组件中向获取DOM元素信息,mounted是组件类的生命周期,就是DOM更新之后调用。
2022-06-01 23:15:56
688
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅