donggua_123的博客

“js是一门单线程的语言”。这是初级前端都知道的一个最基本的知识点，虽然看起来平淡无奇的一个知识点，但以此为入口就会学到更多的知识点首先解释一下为什么js会被设计成单线程：这主要还是由于js是运行的环境和功能所决定的。js是运行在浏览器环境下，给前端用户提供操作页面元素，也就是DOM的一门语言。如果两段js代码同时运行在两个不同的线程上，对DOM做完全相反的操作，那浏览器就不知道该听谁的了，就会让用户很疑惑。为了避免复杂性，就设计成单线程的了。一个线程可以理解为完成一个逻辑功能的运行实例，把哪一块逻

前端项目中很多时候会遇到这样的业务需求：所有的客户都有共同的一些业务需求，即基础需求 基础需求需要根据业务发展进行升级 在共同需求的基础上，每个客户又有不同的需求（客制化）如果只是一两个客户还好，在基础版本上分两份前端文件，分别维护。但是客户达到一定数量级后，比如5个、8个甚至更多，这时候这种机械的本办法就费时耗力了，如果再考虑到基础功能的版本升级需求，那这种方法就完全不行了（升级一个基础功能就要分别复制到每个客户的项目中，同步代码）。以上情况就是我司的实际情况，下面介绍一下我司用的方法，不一

这还要从一道面试题说起，请问下面两种情况分别打印什么：let arr = [1,2,3,4,5]for(let i in arr) { console.log(i) // 0,1,2,3,4} for(let i of arr) { console.log(i) // 1,2,3,4,5}可以看到，for in遍历的是数组索引，也是数组的键，for of遍历的...

先看一个案例：console.log(1)setTimeout(() => { console.log(2) new Promise((resolve) => { console.log(3) resolve(4) }).then(res => { console.log(res) })},...

1、条件判断Array.includes()这是业务中最常见的情景之一看代码：function isOk(color) { if(color=== 'red' || color === 'yellow') { return true; }else { return false; }}一个简单的条件判断，如果判断条件较少时，...

前段时间遇到一个需求，需要在H5页面中增加下载文件按钮，下载一个压缩文件，第一个想到的当然是最普遍和常用的方法：动态生成a标签，把链接地址给到href属性，触发一个click事件，完美下载。于是撸起袖子就开干。由于文件数据是通过接口请求回来的数据流,application/octet-stream类型，需要转换一下来使用： download() { ...

最近遇到一个需求：前端定制化生成合同模板，生成时可以在指定位置拖放指定的控件，可动态编辑指定控件的属性和位置，最后将控件的位置等属性传给后台，后续使用模板签署合同时，乙方可在模板上指定位置签署。点击左边控件列表=》添加控件到文件上=》点击文件上的控件激活该控件=》编辑该控件的相关字段=》提交数据控件类型有多种，支持多个控件同时添加，文本类型支持长宽拉伸设置刚好有一个很好用的v...

前端工作中对于权限的需求是难免的，最近项目中就有这样的需求了。后台管理员可以新增前台成员，不通的成员具有不同的权限，有权限的人员可以看到一些操作按钮或者数据列表，反之则看不到。那么也就是说，前端需要根据登录用户的权限来渲染指定的dom。1、components文件下新建authorized文件夹，文件夹下新建auth.js校验权限const checkAuth = (authNa...

extend()是一个全局构造器，生成的是一个还没挂载到页面元素上的组件实例。在全局挂载插件的形式全局注册，就需要用到vue.use（）方法，官方文档：所以插件必须是一个对象，并且提供install方法，注册的时候自动调用该方法。所以组件的写作步骤就清晰了一些了，实践出真知，现在就来练习一下写一个简约版的全局alert弹框1、在components文件夹下新建alert文件夹，...

工作当中时常会遇到对文件的一些处理，比如下载表格、下载图片、下载文件等，这里说一种下载压缩包的方法。其实也很简单，需要用到一款插件jszip，官方用法都是有的：https://www.npmjs.com/package/jszip可以直接引入脚本：<script src='./jszip.js'></script>也可以在vue项目中直接安装，运行：...

项目中难免会遇到预览文件或者下载文件的场景，如果后台返回的是base64或者图片格式还好说，文件信息直接放在返回body里，作为对象属性给到前端，很直观，也方便取用。但后台给到的是文件流就要麻烦一些了，一般来说文件流会直接凡在res.data里处理这种特殊返回值时需要设置axios的responseType为blob，防止axios内部默认处理返回值，导致无法解析：axios.g...

最近做一个移动端项目的时候，有一个页面的需求是在同一个页面里，通过导航栏切换出不同的滚动组件，导航栏也要跟着滚动组件一起上下滚动，当导航栏到达顶部时悬浮在顶部，不再随滚动组件一起滚动了，组件则继续向上滚动。如图所示：进入页面状态：  向上滚动：              到达顶部：导航栏悬浮 刚开始结构上导航栏、顶部展示区和底部主体区域是一个滚动整体，判断滚动距离，当距离大于顶部展示区时，将导航栏...

TweenMax是一款前端动画插件，可以做出很多效果，灵活性很高，最近闲暇之余学了一下，顺便做点记录。插件的安装很简单，直接用script引入即可使用：&lt;script src="./js/TweenMax.min.js"&gt;&lt;/script&gt;开始的时候需要初始化一个对象：var t = new TimelineMax();to：单个元素，运动到某一点t.to('.box', ...

实际开发过程中遇到这样的需求，页面加载后会请求多个数据模块，每个模块都进行进度条展示，从零到目标值给一个增长效果。于是给每个子元素绑定一个定时器setInterval，像这样：效果确是这样的：完全错乱了，这可不是我想要的效果呀！查阅资料后才知道，当我们在for循环里面调用定时器时，定时器时异步执行的，没循环一次，i加1，生成一个timer，放到进程队列里面去，等到for循环完成后，i已经加到最大值...

es6语言现如今已经是前端的必备更高级的语法了，其实它只是新的js规范，可以说是es5的升级版，作为前端人员不得不学的，这也是未来的趋势。但是可惜的是，现在大部分浏览器还不能兼容es6语法，为了保险，需要用转换工具转义成es5,用于发布环境当中。希望全面支持es6的那一天早点到来。首先需要说明的是，编译的环境实在node下的，需要确保本地安装了node.js；第一步：进入文件根目录，初始化环境：n...

小组刚完成一个小程序项目，第一版正式发布了，过程中也遇到了很多问题，这里记录一下我负责的模块中的购物车功能的实现过程。后期再把其他小伙伴的模块也一并贴上来分析一下，自己也学习一下他们的独门技能！效果图如下：在这里，计数器、购物篮做成组件用于复用，由于左右联动的功能在另一个模块也有用到，所以就把这个功能也做成了一个组件，传入不通的数据即可，左右联动的实现方法在之前一片博客有写到htt...

在面向对象的编程中，最常用到的就是this关键词。this是在执行函数时绑定的，而不是在声明的时候绑定的，他的上下文取决于函数调用时的各种条件，和声明的位置没有关系，只和调用的位置有关。this有四种绑定方式：第一种：默认绑定var a = 9;function abc() { console.log(this.a)}abc() // 9在这段代码中，this....

在pc端，页面超过可视区高度后便会有滚动条，那么回到顶部的功能就必不可少了。现在我面临的情况：1、点击回到顶部，默认隐藏，滚动超过一定距离才显示回到顶部icon2、部分页面不需要回到顶部功能，比如登录、修改密码等模块；3、滚动效果的实现使用的是element-ui的scrollbar组件，看了下源码，并没有向外派发任何事件，仅仅实现了滚动效果，不提供诸如下拉刷新、回到顶部、返回滚动...

一说到javascript里的闭包，大部分人都好像有所耳闻，但又说不太清楚到底是个什么东西。那么闭包到底是何方神圣呢？闭包是javascript中非常常见，但是又非常神秘的一个概念，有多少人像我一样，看了好多关于闭包的技术文章，却始终没能彻底搞懂闭包的深层次原理，经常是面试前突击一下闭包相关的文章，似懂非懂，过段时间后又几乎全忘了，只留下些残破的似是而非的记忆。今天我尝试着来总结一下我自己...

javascript的原始变量类型总共有以下几种：BooleanStringNumberNullUndefindSymbol（es6）Object属于非原始类型，其中包含Array,Function等判断方法：typeof xxx:其结果为string、number、boolean、undefind、function、object,需要注意的是typeof null 是object，typeod ...