- 博客(150)
- 收藏
- 关注
RSS订阅原创 compact()
_.compact(array)每天更新一个lodash方法源码解析compact翻译过来表示紧凑的、紧密的；在lodash中，它用于将数组中虚假值过滤掉，虚假值表示该值为空或者无意义，虚假值都包括：false、null、0、" "、undefined、NaN，与其对应的是真值，表示该值有意义，compact方法就是将上面所提到的虚假值过滤掉。example：_.compact([1,...
2019-06-18 09:14:33
1357
原创 chunk()
_.chunk(array, [size = 1])chunk()方法是将数组中的元素进行分块，每一块为一个数组，最终返回由每个块组成的数组。example：_.chunk([1, 3, 5, 7, 9], 2)// [[1, 3], [5, 7], [9]]_.chunk([1, 2, 3, 4, 5, 6], 3)// [[1, 2, 3], [4, 5, 6]]_.chunk(...
2019-06-16 12:33:04
8463
1
原创 每天一个lodash方法源码解析
lodash是一个非常实用的一个javascript工具库，为我们提供了一系列包括字符串、数值、数组、对象等的常用处理方法，了解这些方法的实现不仅可以让我们更好的掌握js的一些基础知识，还可以开拓我们思维，帮助我们在实际开发中解决一些类似问题。...
2019-06-16 12:31:05
6287
1
原创 npm install时cb() never called!错误解决方法
npm install时cb() never called!错误解决方法先交代一下背景：开发环境是在Mac下，今天不同于往日，在开发中需要使用supervisor这个包，于是命令行中敲sudo npm install -g supervisor安装，出现了cb() never called!的报错，如下图：在报错的时候给我们说明了错误原因，问题出在npm自身上，回想起前一段时间自己确实手动更...
2019-06-02 12:48:37
36559
2
原创 解决Mac下npm install时报权限错误
今天在使用npm时提示有新的npm版本需要执行npm install -g npm来升级npm，输入完命令后，却报错了，提示权限问题，通过上网查询和亲测，找到一种简单的解决方法就是npm install命令前面加上sudo即可，sudo npm install -g npm。...
2019-05-26 23:39:08
2172
原创 解决使用vue-cli3创建项目时在git下交互提示符没反应问题
解决使用vue-cli3创建项目时在git下交互提示符没反应问题vue-cli3下我们使用vue create命令来快速创建项目，在window下会遇到交互提示符不工作的问题，如图所示：vue-cli官网给出了两种解决方法：下面对它们具体实践一下：方法一：第一种比较简单，就是将vue create命令改为winpty vue.cmd create命令，如下图所示：方法二：第二种...
2019-05-06 20:19:41
2424
原创 webpack的clean-webpack-plugin插件
webpack的clean-webpack-plugin插件在使用webpack打包时，打包后的文件名如果一样，那么每次打包后，新生成的文件就会将之前打包的文件覆盖掉，但是如果给输出的文件名设置根据内容生成的hash值后，由于每次打包后生成的文件名的hash值会不一样，这样就不会因文件名相同而覆盖原来的文件，在文件目录中出现了一些多余的文件；如果每次都手动清除这些多余文件也是很麻烦的，webpa...
2019-04-26 14:03:45
2828
原创 webpack的copy-webpack-plugin插件
webpack的copy-webpack-plugin插件webpack的copy-webpack-plugin插件的作用是将项目中的某单个文件或整个文件夹在打包的时候复制一份到打包后的文件夹中（即复制一份到dist目录下）。效果如下图所示：使用方法：给项目中添加copy-webpack-plugin插件：npm install -D copy-webpack-plugin然后we...
2019-04-26 11:06:24
8311
原创 webpack消除项目中console语句
webpack消除项目中console语句项目开发调试时，写一些console语句将变量打印出来可以很方便调试代码，但是到正式环境，如果不去除console语句，一方面打开控制台会有很多数据打印出来，不规范，另一方面就是容易造成一些敏感数据泄露；对于项目比较大的，如果手动的去删除console语句，将会是一个不小的工作量，不过webpack的uglifyjs-webpack-plugin插件可以...
2019-04-25 21:34:08
2577
原创 安装chrome插件报"程序包无效: CRX_HEADER_INVALID"错误
安装chrome插件报"程序包无效: CRX_HEADER_INVALID"错误chrome浏览器的插件可以让我们的上网体验更加便利，受限于网络原因，一般无法直接在chrome浏览器的应用商店中进行直接搜索点击安装（翻墙的除外），这就需要我们先在第三方网站上搜索插件并下载（需要提醒的是：一般下载的插件的文件格式为crx格式），然后进行手动安装；安装方法网上教程很多，操作也很简单，简要概括就是：...
2019-04-21 16:29:21
17088
12
原创 node.js实现文件上传
用node.js写一个文件上传demo参考文献：[1] nodejs 实现简单的文件上传功能[2] node.js学习之post文件上传 （multer中间件）[3] node.js实现formdata上传文件[4] Nodejs express 文件上传...
2019-04-07 18:45:11
1939
2
原创 正则匹配中文
正则匹配中文正则表达式中\w不能匹配中文，\w等价于[A-Za-z0-9_]，当需要匹配中文时需要用到[\u4e00-\u9fa5]来进行匹配：/[\u4e00-\u9fa5]+/.test('我们')// true/[\u4e00-\u9fa5]+/.test('abc_123')// false/\w+/.test('我们')// false/\w+/.test('abc...
2019-03-26 16:35:44
1252
原创 圣杯布局和双飞翼布局
圣杯布局和双飞翼布局圣杯布局和双飞翼布局均是上中下结构，其中，中间部分又分为左中右三部分，左右两侧宽度固定，中间部分宽度自适应；上中下的结构比较简单，使用三个div就可以实现，中间部分的左右两侧内容宽度固定，中间内容宽度自适应，实现起来就比较有技巧性，具体如下：1、圣杯布局：圣杯布局的html结构：<div class="container"> <div clas...
2019-03-21 16:50:15
366
原创 input元素的oninput事件和onchange事件
input元素的oninput事件和onchange事件1、input元素上绑定事件的三种方式：第一种：直接在元素标签上添加oninput属性，属性值为处理事件函数的调用<input type="text" id="input" oninput="handleInput()"></input>function handleInput() { // 处理事件代码...
2019-03-20 23:43:47
21199
1
原创 el-table表格头部内容自定义
el-table表格头部内容自定义在使用element UI中的表格组件进行开发时，表格头部的内容是通过设置<el-table-column>组件的label属性进行赋值，使用label属性的话，表格头部只能展示一些静态内容；今天接到一个需求，要求表格头部的内容在鼠标hover上去的时候提示信息，通过label属性设置表格头部内容就无法满足我们的需求，这时候就需要对表格头部的内容进行...
2019-03-20 19:55:00
7196
1
原创 git合并分支
git合并分支关于git合并分支，最常用的是使用git merge &lt;branchName&gt;命令，不过今天学到了一个新技能那就是使用git rebase &lt;branchName&gt;进行分支合并，它有什么好处呢？它与git merge的区别又是啥呢？git rebase的优点：1、不同分支上的代码提交记录是不一样的，使用git rebase合并分支后，它可以生成一个更简洁...
2019-03-18 09:53:27
2046
1
原创 与函数柯里化相关的一道面试题
与函数柯里化相关的一道面试题曾经遇到过的一道面试题，写一个sum函数，满足以下条件：sum(1)(2)(3).valueOf() // 6sum(1, 2)(3)(4).valueOf() //10sum(1, 2, 3)(4, 5)(6, 7).valueOf() // 23sum(1)(2, 3, 4)(5).valueOf() // 15当时第一眼看上去这是函数柯里化的知识点，...
2019-03-16 10:11:29
852
原创 javascript中的函数柯里化
javascript中的函数柯里化函数柯里化是将接受多个参数的函数转换成可以接受一个参数的函数，且转换后的函数能够处理剩余参数并返回执行结果。参考文献：[1] 前端基础进阶（八）：深入详解函数的柯里化...
2019-03-16 00:09:55
405
原创 promise到底是在resolve时被推入微任务队列还是在then的时候呢？
promise到底是在resolve时被推入微任务队列还是在then的时候呢？今天在看async/await、promise等执行顺序时，一时被promise在什么时候被推出微任务队列搞得有点晕，是在执行resolve时还说执行then时？为了搞清楚这个问题，于是想了如下执行代码来验证：console.log('script start')Promise.resolve('resolve')...
2019-03-15 19:47:21
6841
1
原创 关于浏览器渲染机制的总结
关于浏览器渲染机制的总结1、浏览器渲染机制的过程是什么样的？解析HTML生成DOM树解析CSS生成样式树DOM树与样式树结合生成渲染树根据渲染树来布局，计算每个节点的位置调用GPU绘制，最后显示在屏幕上2、为什么将script标签引入的js代码放在body下方？浏览器在解析HTML代码时，遇到script标签，会暂停DOM树的构建。为了提高用户体验，浏览器在加载页面时，会先将已...
2019-03-09 23:23:01
301
原创 javascript实现快速排序
javascript实现快速排序快速排序一般是在数组中先找一个基准元素，将数组中剩余的元素依次与基准元素进行对比，比基本元素小的放一个新数组，同样地，比基准元素大的放一个新数组，然后分别对新数组重复进行上述操作，直到新数组的元素只剩一个，此时便完成了排序。实现代码：function quickSort(arr){ // 由于使用Math.floor()向下取整方法获取基准元素索引，会出现a...
2019-03-09 17:58:14
303
原创 javascript实现插入排序
javascript实现插入排序插入排序是将数组分成两部分，一部分是排好序的，另一部分是待排序的，依次将待排序的元素取出来与排好序的部分一一对比，直到找到适合该元素的位置并添加进去。一般默认数组左侧第一个元素是排好序的，然后从第二元素开始遍历，分别左侧排好序的部分对比进行插入。实现代码：function insertSort(arr){ // 数组长度为1，直接返回原数组 if(arr....
2019-03-09 17:30:11
812
原创 模拟bind方法实现过程
模拟bind方法实现过程bind方法的特点：必须是函数才能调用bind方法调用bind方法后返回一个可调用的函数调用bind方法时可以传入多个参数，一般第一个参数用于改变调用函数的this指向，剩余参数用于传给调用bind的函数调用bind方法时，第一个参数为空或者null时，调用函数中的this指向window调用bind方法后生成的函数在调用执行时可以传参，且参...
2019-03-09 17:01:04
395
原创 为什么[] instanceof Function为false ？
为什么[] instanceof Function为false ？instanceof是用来判断左边对象的原型链上是否存在右边对象的原型[]的原型链：[].__proto__ === Array.prototypeArray.prototype.__proto__ === Object.prototypeObject.prototype.__proto__ === null从上面原型...
2019-03-04 22:39:44
1168
原创 事件流和事件委托
事件流和事件委托事件委托就是利用了事件冒泡原理，通过将事件处理添加到父级上，来控制所有子级的同类事件事件委托的好处：1、不用为每个子类元素都手动添加同类事件，减少DOM元素访问，提高性能2、新添加的子级元素可以继承同类事件参考文献：[1] 事件冒泡、事件捕获和事件委托...
2019-02-22 16:12:14
309
原创 git分支管理
git分支管理1、分支创建git branch &amp;lt;branchName&amp;gt;2、分支查看// 查看分支git branch// 查看本地分支git branch -l// 查看远程分支git branch -r// 查看所有分支（本地和远程）git branch -a3、分支删除git branch -d &amp;lt;branchName&amp;gt;4、分支切换...
2019-02-22 14:37:11
229
原创 防抖&节流
防抖&amp;amp;amp;节流1、防抖：防抖：对于高频持续触发事件，通过设置定时器来延迟事件执行，在未达到设定的延迟时间时，如果再次触发该事件，则重新计时；只有在延迟时间内不触发该事件，那么当达到延迟时间后才会执行该事件。// 通过设置定时器实现关键词：重新计时2、节流：节流：对于高频持续触发事件，让其在一定时间内仅执行一次，可以通过设置时间戳或定时器的方法实现。// 方法一：设置时间戳/...
2019-02-20 19:26:04
370
原创 javascript中的继承
js继承1、原型链继承：function Parent() { this.familyName = 'Xu'}Parent.prototype.getFamilyName = function() { return this.familyName}function Children() { this.firstName = 'Ryan'}// 原型链继承...
2019-02-20 15:51:25
265
原创 解决IE浏览器下路由变化页面不更新问题
解决IE浏览器下路由变化页面不更新问题解决办法：watch: { '$route' (to, from) { window.location.reload() }},参考文献：[1] vue——路由变化页面数据不刷新问题...
2019-02-18 19:52:56
1834
3
原创 vue-cli创建项目配备element、less、vuex、axios等工具
vue-cli创建项目配备element、less、axios等工具
2019-02-18 19:18:50
520
原创 由npm仓库源引起的404
由npm仓库源引起的404今天新项目需要开工，像往常一样使用vue-cli构建，但在执行vue init webpack <project-name>命令时，出现了404 Not Found: vue@^2.5.2报错，很是奇怪，为什么找不到vue？之前使用vue-cli构建项目时可没有出现这样的报错。百度了一下并没有找到类似的报错描述和解决办法，所以就想着会不会是公司网络限制，无...
2019-02-18 17:07:26
4380
原创 解决IE低版本浏览器不支持location对象的origin属性
解决IE低版本浏览器不支持location对象的origin属性低版本的IE浏览器是不支持window.location.origin，但是支持window.location，因此可以通过window.location对象进行拼凑实现对window.location.origin的兼容，具体如下：...if (!window.location.origin) { window.loc...
2019-02-16 20:46:59
2678
原创 伪类和伪元素的区别
伪类和伪元素的区别伪类是配合常规css选择器来使用的，用来获取元素，通常有一个:；伪元素会在页面中产生容器，用于显示内容或某种效果，它不会出现在DOM中，即不能通过js来操作，仅仅为css层面的渲染注入，通常有两个::；常见的伪类有：:hover、:focus、:link、:active、:visited、:first-child、：nth-child()等；常见伪元素有：::before、...
2019-01-22 09:36:20
234
原创 将毫秒时间转换为自定义格式的时间
将毫秒时间转换为自定义格式的时间将毫秒时间转换为自定义格式的时间的方法：利用正则匹配并用毫秒时间替换自定义时间格式中对应的值来实现时间格式转换/* 用于将毫秒时间转换为自定义格式的时间 * @method formatDate * @param date 毫秒 * @param format 时间格式，类似于"yy-MM-dd hh:mm:ss" * @return 返回"yy-MM...
2019-01-04 09:57:23
1291
原创 解决Vue项目在IE浏览器中因默认版本显示问题而造成的页面显示空白
解决项目在IE中显示空白问题最近之前做的一个项目在IE浏览器下出现了一个奇怪的问题，用户用IE浏览器打开后，页面是空白的，打开F12查看IE浏览器的版本发现默认版本是IE8以下，如下图所示：但是当我将浏览器版本设置8以上，项目就可以正常显示，关闭IE后重新打开发现页面还是空白，后来通过上网查看...
2018-12-22 09:53:50
3810
原创 使用vue-cli离线创建项目
使用vue-cli离线创建项目1、手动下载vue模板2、将下载的模板压缩包解压，修改文件名为wepback并放入到C:\Users\自己电脑的用户名.vue-templates文件夹中3、执行命令：vue init &lt;template-name&gt; &lt;project-name&gt; --offline...
2018-12-21 15:03:53
7298
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人