![](https://img-blog.csdnimg.cn/20190918140213434.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
前端
文章平均质量分 92
来啊,搞全栈啊,我头发多啊,谁怕谁啊!
阿彪最稳 Jian了
博客已搬家到 https://juejin.cn/user/3245414491891240
展开
-
关于前端安全性那些事
1、XSS攻击 2、 Iframe 3、跨站请求伪造(Cross-site request forgery) 4、ClickJacking(点击劫持)5、HTTPS重定向问题 6、CDN劫持原创 2022-10-21 14:56:04 · 1497 阅读 · 0 评论 -
前端团队代码规范
代码的最终归宿都是屎山罢了,而一份适用于团队的代码规范,可以极大延缓屎山的堆积速度。原创 2022-04-29 17:19:18 · 1439 阅读 · 0 评论 -
从零开始搭建一个私有前端组件库
本文包含了组件库搭建、为组件库提供类型文件、npm私服搭建、组件库国际化、组件按需引入、自定义主题、为组件库编写文档、包体积优化等一系列过程原创 2022-01-06 17:35:05 · 9528 阅读 · 5 评论 -
基于ts封装axios
除了基础的设置token,和token失效对应操作后,还支持自动取消重复请求,和请求失败后的重试策略,其中重试策略支持针对特定的错误码进行重试。原创 2021-12-16 11:10:54 · 3431 阅读 · 0 评论 -
如何基于el-table封装一个方便好用的table组件
之前听到很多人讲在用 element-ui 的 table 组件时,还是自己循环 el-table-column 去实现的!每个页面都这么写想想就头大,另外万一产品要求你项目中所有的表格都要扩展一个功能,比如说按shift,可以实现数据行多选?那岂不是当场傻眼!我们完全可以基于el-table去封装一个组件,基于**配置**自动生成表格。原创 2021-11-30 17:24:25 · 6025 阅读 · 5 评论 -
为什么v-for不推荐使用index做为key
本文续接上篇 我终于搞懂了vue的diff算法为什么v-for不推荐使用index做为key引用这篇掘金文章中所列出的两种情况,本文只对分析过程做一些图示补充1、节点reverse即数组倒置时假设如下代码,值直接以文本格式绑定在dom节点内部 <div> <span v-for="(item,index) in arr" :key="index" >{{item}}</span> </div>当使用index作为key时,我们来.原创 2021-11-10 16:43:45 · 1813 阅读 · 0 评论 -
我终于理清了vue的diff算法
> 1、最近好几个月都比较忙,刚好项目接近尾声,今天终于抽出来了一点时间重新捋了一下diff算法,具体的解析后面抽时间补上,画了个大概的图,可以配合代码注释凑活着看> 2、草稿箱里也放了好多篇想写的文章,后面整理成一个系列慢慢发出来@[TOC](diff算法)### 1、怎么更好的阅读源码这个问题困扰我挺久的,在网上搜过大佬们谈怎么阅读源码的心得,总觉得拿来自己套用起来并不适用,这里分享下自己阅读源码时的思路 - 明确自己的主线任务,即自己读这个源码是想干嘛,写代码过程中遇到问题,需要解惑?还原创 2021-10-15 18:17:45 · 429 阅读 · 0 评论 -
Cordova App 热更新 超详细教程
目前Cordova平台我找到的热更新方案有两种 1. 使用cordova-hot-code-push插件 [GitHub仓库地址](https://github.com/nordnet/cordova-hot-code-push) 2. 使用 cordova-plugin-code-push [GitHub仓库地址](https://github.com/Microsoft/cordova-plugin-code-push) 第一个插件,已经官宣不再维护了。第二个插件是微软官方提供的。果断选择原创 2020-12-17 15:01:11 · 3473 阅读 · 0 评论 -
Cordova设置iOS App启动页
前言iOS13推出后要求开发者必须在今年4月之前使用LaunchScreen.storyboard启动,不能再使用之前Image.asset中的LaunchImage方式了。对于使用原生iOS的开发者来说,操作起来就是在xcode里面点点点,控件拖一拖设置一下.但是对于我们使用cordova开发混合App的开发者来说,不熟悉xcode的话,操作起来会很懵。(我硬是在那搞了两个小时也没搞好!)看下Cordova 官方对于这两种方式的解释:There are two mechanisms for dis原创 2020-12-10 15:47:41 · 1219 阅读 · 1 评论 -
webpack常用plugin和loader,以及打包优化
一、开发环境1、插件1.1、webpack dev servewebpack-dev-server实际上相当于启用了一个express的Http服务器+调用webpack-dev-middleware。它的作用主要是用来伺服资源文件。这个Http服务器和client使用了websocket通讯协议,原始文件作出改动后,webpack-dev-server会用webpack实时的编译,再用webpack-dev-middleware将webpack编译后文件会输出到内存中。适合纯前端项目,很难编写后端服原创 2020-11-20 14:50:56 · 1512 阅读 · 0 评论 -
关于axios请求源码分析
Axios的特点:请求返回Promise,可以很方便的进行链式调用可以附加拦截器:请求拦截器、响应拦截器可以随时取消未完成的请求客户端支持防御 XSRF(跨站请求伪造)会帮你转换请求数据和响应数据在node.js中发送请求使用http,在浏览器使用XMLHttpRequest原创 2020-10-24 08:26:30 · 497 阅读 · 0 评论 -
使用Cordova打包H5到安卓
1、配置开发环境安卓的话,随便搜一下都有很多,这里放一个相对比较详细的 传送门安装cordova 就直接看官方文档 官网链接2、创建项目cordova create 文件名 appid app名称cordova platform add ios/androidcordova cordova plugin addcordova build...原创 2020-09-29 16:44:45 · 2141 阅读 · 0 评论 -
关于Ionic3 +Cordova 开发App中遇到的问题和解决方案
ImagePicker 相关1、选择照片闪退解决方案:参考自 传送门把红框里改掉,改成v4:26.+,原来是v4:27.+猜测是与当前指定的Android版本不匹配。2、ImagePicker选择的照片质量下降当ImagePickerOptions 配置了宽高之后,哪怕配置了图片质量为100,选择的照片质量也会下降,去掉宽高就好了。我怀疑这里的宽高指的是分辨率吧? chooseFromAlbum() { const options: ImagePickerOptions原创 2020-09-18 17:34:03 · 1203 阅读 · 0 评论 -
Vue响应式原理和简单实现
Vue内部通过Object.defineProperty方法属性拦截的方式,把data对象里每个数据的读写转化成getter/setter从而监听数据,当数据变化时通知视图更新。转载 2020-02-29 23:07:31 · 292 阅读 · 0 评论 -
Vue组件的插槽笔记
1.普通插槽父组件写法:<ShoppingCar> <button>按钮</button></ShoppingCar>子组件写法:<template> <slot> <span>默认为span</span> </slot></template>...原创 2020-02-28 17:18:49 · 216 阅读 · 0 评论 -
总结下Vue和Angular组件交互方式
回想起来Vue和Angular,他们的父子组件的交互方式不管是组件传值的方式,还是监听值发生变化的方式都很相似,心里第一个想法就是他们的实现是不是也极为相似,还是让熟悉其中一个框架的人能迅速上手另一个?另外因为没用过React,不了解React组件交互是怎样的。这会儿特别想去读一下他们组件交互相关的源码,后面再来填上这个坑吧!原创 2020-02-28 17:18:57 · 2616 阅读 · 0 评论 -
css超出规定行数隐藏,兼容版
单行overflow: hidden;text-overflow: ellipsis;white-space: nowrap;多行超出隐藏overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;//设置行数-webkit-box-orient: vertical;这个...原创 2019-02-15 15:11:05 · 1611 阅读 · 0 评论 -
关于window环境下nodejs的版本控制
使用 nvm-windows 通过它可以安装和切换不同版本的nodejs。安装下载地址:https://github.com/coreybutler/nvm-windows/releasesnvm-noinstall.zip: 绿色免安装版本,但是使用之前需要配置nvm-setup.zip:一个安装包,下载之后点击安装,无需配置就可以使用本机测试使用的是nvm-setup进行安装。扒...原创 2019-11-19 12:44:31 · 904 阅读 · 0 评论 -
对于js中apply和call的区别和用法
在学习js继承的时候,apply和call出现的频率很高,心里也只是有个大概的理解,刚好今天有时间,就整理一下。首先,apply和call是干嘛用的?一句话概括:用来重定义 this 这个对象的!听起来好像很懵,来看代码: function Person(skinColor = 'yellow', gender = 1, age = 1) { ...原创 2020-01-13 16:54:02 · 388 阅读 · 0 评论 -
js实现继承的几种方式
一、原型链继承 重点:让新实例的原型等于父类的实例。 特点:1、实例可继承的属性有:实例的构造函数的属性,父类构造函数属性,父类原型的属性。(新实例不会继承父类实例的属性!) 缺点:1、新实例无法向父类构造函数传参。 2、继承单一。 3、所有新实例都会共享父类实例的属性。(原型上的属性是共享的,一个实例修改了原型 ...原创 2020-01-07 13:57:25 · 271 阅读 · 0 评论 -
关于js的执行机制
首先js是单线程的,也就是说js同时只能执行一个任务。那么js为什么被设计为单线程呢?这与浏览器的用途有关,js的主要用途是与用户交互和操作dom,假设一段代码,被分配给两个或多个线程去执行,一个线程执行的代码在添加dom,另一个在删除dom,那么两个操作的结果以哪个为准?保留哪...转载 2020-01-06 15:00:41 · 243 阅读 · 0 评论 -
通俗的解释什么是Promise
**说了这么多其实翻译成大白话就是:**1、媳妇儿饿了需要吃饭,所以我要上街买菜(**异步方法**)2、我什么时候买完菜回来她不知道(**异步方法执行几秒未知**),3、但是买完菜回到家之后我会马上做个红烧排骨给媳妇吃(**异步方法执行结束之后需要对返回值做处理**)这时候怎么办呢,就用promise(承诺):就说这个事情交给我吧,我承诺我去买菜,买完回来马上给你做红烧排骨,做完马上就叫你吃(这个地方相当于**promise链式调用**),你现在该干嘛干嘛去,去刷抖音,打游戏都可以(**不影响其他原创 2020-01-06 15:01:02 · 1910 阅读 · 0 评论 -
var,let,const的区别
定义的区别:var 和 let一般用来定义变量,而const用来定义常量初始化的区别var 和 let初始化可以不用初始化给默认值(不给值的情况下默认是undefined),而const定义的是常量,后续的值是不变的,所以使用时必须给定值作用域的区别:var定义的变量,没有块的概念,可以跨块访问, 不能跨函数访问。let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函...原创 2019-10-31 16:38:43 · 136 阅读 · 0 评论 -
浮点型运算的舍入误差(四舍五入错误)
看犀牛书的时候突然发现一个有意思的地方记录一下:去浏览器试了下果然是这样:好奇的我又去试了c#,也是这样但是c#里面有decimal这个数据类型,不存在精度损失...原创 2019-12-18 15:11:25 · 1907 阅读 · 0 评论 -
函数节流和防抖
我觉得啃犀牛书已经不能满足我了!记录下函数节流和防抖,以前写后端的时候从来不知道还有这个说法,但是在前端好像应用的很多函数节流限制函数在一段时间内只能执行一次适用情景:1、高频点击表单提交2、滚动条问题等(滚动加载更多)3、搜索栏搜索关键字提示代码实现:// 第一种通过判断时间间隔实现function throttle(fn, interval = 1000) { ...原创 2020-01-06 15:01:19 · 229 阅读 · 0 评论 -
JS数据类型
基本数据类型:Number、String、Boolean、Null、 Undefined、Symbol(ES6)引用数据类型:Object(在JS中除了基本数据类型以外的都是对象,数据是对象,函数是对象,正则表达式是对象,等等)关于Symbol:https://blog.csdn.net/weixin_34354945/article/details/91460921JS里的基本数据类型...原创 2020-01-06 15:01:25 · 186 阅读 · 0 评论