自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

进无止进

code make me happy

  • 博客(44)
  • 收藏
  • 关注

原创 Vue中axios POST传参问题

最近做了一个后台的管理系统,为了实现回调,不得不进行层层的嵌套(callback hell)。第二版本的时候决定使用es6的新特性Promise对代码进行优化,为了兼容各浏览器环境,引入了一个兼容的promise.js。网上关于Promise的用法很多,就不做过多介绍。为了一次搞清这一新特性,决定研究一下这个promise.js的源码。( promise.js的下载地址)。

2018-04-10 20:02:18 11364 2

原创 老生常谈JS数组去重

数组去重,历史悠久的话题了,不过今天只记录个人比较喜欢的方法1、数组去重需求项目需要对类似这种数组去重:let lists = [{ id: 1, name: '法外狂徒', age: 20},{ id: 3, name: '张三', age: 20},{ id: 1, name: '法外狂徒', age: 20},{ id: 4, name: '李四', age: 20}]该数据以id作为唯一标识,去重时只需去除重复id的那一项即.

2020-09-09 17:41:05 146

原创 Vue Axios之生产/开发环境跨域问题解决

Vue Axios开发环境、生产环境跨域问题解决一、前置知识首先要了解几个Vue-cli的几个配置参数。另:从 Vue CLI 3.3 起baseUrl已弃用,请使用publicPath1. publicPath它是部署你的应用包时的基本URL。默认为 '/'。Vue Cli默认项目是被部署在域名的根路径下。比如你要把打包生成的文件部署在https://www.lhch.com下,那么采用默认设置就行。那如果我们是部署在https://www.lhch.com/test/路径下呢?那么此时可以

2020-09-07 16:01:21 3930 1

原创 关于async和await

JavaScript中的async/await是AsyncFunction特性中的关键字。(读者可自行查阅改链接中内容)async定义的异步函数,通过使用 await,让异步函数的表现更像是同步函数。不用再层层回调。它是Generator函数的语法糖。其中async来声明该函数里有异步操作。await表示紧跟在后面的表达式需要等待结果与Generator函数比优点:内置执行器。Generator函数的执行必须依靠执行器,而 Aysnc函数自带执行器,调用方式跟普通函数的调用一样‘更好的语义。a

2020-07-01 12:19:30 328

原创 非常实用的ES6特性

1、展开操作符顾名思义,用于对象或数组之前的展开操作符(…),将一个结构展开为列表。如下:let firstHalf = [ one , two ];let secondHalf = [ three , four , ...firstHalf];这样写比较简洁、优雅,如果不用展开操作符,我们需要这样做:let firstHalf = [ one , two ];let secondHalf = [ three , four ];for(var i=0, i <firstH

2020-07-01 10:29:50 151

原创 观察者模式和发布订阅模式(续)

两年前写过一篇关于消息发布订阅的文章,当时是结合了实际的应用场景。看起来不够抽象,概括。今天试图抽象话的再去写一下自己的理解。上篇文章:发布 订阅 消息系统(1),可点击查看。此文续上篇文章,取名改为观察者和发布订阅模式。什么是观察者模式?观察者模式(Observer Pattern)定义了一种当对象之间存在一对多的关系时的一种行为模式。比如当一个对象被修改时,则会通知它的依赖对象并自动...

2020-01-16 14:23:43 208

原创 JS多页面间通讯

需求:项目中做了一个音乐播放器,后面Boss说用户同时打开了多个页面播放音乐,这个时候每个页面都在播放音乐,能不能只让当前用户操作的页面播放音乐。接到这个需求的时候,先去某云音乐看了一下,用的应该是WebSocket。给领导反馈一下后,领导说后端腾不出资源配合。那只能先排除这种方案了。当时的思路是这样的:具体是:给每一个打开的要播放的网页链接加一个唯一标识参数(uuid),点击播放的时...

2020-01-09 17:36:20 765

原创 safari浏览器在使用videojs-contrib-quality-levels.js 播放视频时 清晰度失效, 报错Unhandled Promise Rejection: AbortError

最近在开发一个类似腾讯视频这样的电影播放网站,遇到了不少问题,记录一下使用videojs插件时,在safari浏览器下引入插件后,清晰度失效的问题因为电影、电视剧播放器这块是我负责的模块,项目中使用的是videojs,因为要实现播倍速切换、清晰度切换等功能,所以又引入了videojs-contrib-quality-levels.js 插件。并且项目要求兼容IE11及以上,chrome,fi...

2020-01-03 18:01:16 2498

原创 js中的this,arguments, callee, caller

一张图,先捋一捋逻辑arguments在函数内部,有两个特殊的对象:arguments 和 this。arguments是一个类数组对象,包含着传入函数中的所有参数。在函数体内可以通过arguments对象来访问这个参数数组,从而获取传递给函数的每一个参数。arguments对象只是与数组类似(它不是Array的实例)。可以使用方括号语法访问它的每个元素。arguments[0]没有...

2019-12-27 14:41:17 131

原创 js的break,continue,return及流控制语句

横向对比js的流控制语句,从此不再迷茫。哈哈,给此博文插图:当前端发现全公司只有一个人手机显示的界面有问题的时候…break: 终止循环,使当前循环不再继续执行。用于跳出循环或switch语句。当是嵌套循环的时候,只能跳出一层循环。continue: 跳过当前循环,继续往下判断循环执行语句,相当于开始循环的一次新迭代。只能结束循环中的一次过程,无法阻止循环继续进行。return: ...

2019-12-27 11:26:52 98

原创 深入理解JavaScript中的执行环境(execution context)

-------------------------------------华丽的分割线-------------------------------------执行环境(execution context,也称作‘环境’)定义了变量或函数有权访问的其他数据,决定了他们各自的行为。每个执行环境都有一个与之关联的变量对象,,环境中定义的所有变量和函数都保存在这个对象中。代码执行时,可以划分为以...

2019-12-26 16:09:24 382 2

原创 Git常用命令总结

对分支进行操作查看当前分支:git status查看某个项目的所有分支:git branch切换到指定的分支:git checkout branchName合并某分支到当前分支:git merge branchName删除某个分支:git branch -d branchName创建某个分支并切换到该分支上:git checkout -b branchName添加文件到git仓库...

2019-12-26 14:43:00 82

原创 JS中的parseInt,parseFloat,Number等数值转换函数

JS数值转换函数:Number()parseInt()parseFloat()Number()转换规则:如果是Boolean,分别转化为0 , 1如果是数字值,只是简单的传入和传出如果是null值,返回0如果是undefined, 返回NaN如果是字符串,遵循以下规则:- 如果字符串中只包含数字,(包括前面带正号或负号的情况),则将其转换为十进制数值,即"1"会变成 1,...

2019-08-14 10:27:07 2271

原创 JS中的call,apply和bind

梳理一下call,apply和bind,并尽量将其应用到实际开发环境中。​/*apply()方法*/function.apply(thisObj[, argArray])/*call()方法*/function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);/*bind()方法*/function.bind(thisArg[, arg...

2019-08-13 15:15:51 87

原创 jQuery的onclick事件导致点击事件累计触发的问题

问题场景维护公司老项目的时候,发现以下问题。在使用jQuery中的click事件对页面中某个元素对象进行绑定时,如果不采用防抖/节流的写法会出现事件被多次绑定的情况。如果发生这种问题,会导致一次触发请求多次的情况,直接导致服务器的压力飙升。严重的话,服务器会直接挂掉。接下来具体说一下这个问题是如何形成的。​<div onclick="handleClick()">点我&lt...

2019-08-12 09:40:33 863

转载 JS中的setTimeout

JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成。它们向任务队列添加定时任务。初始接触它的人都觉得好简单,实时上真的如此么?这里记载下,一路对其使用姿势变迁的历程。1.setTimeout()基础setTimeout函数用来指定某个函数或某段代码,在多少毫秒之后执行。它返回一个整数,表示定时器的...

2019-07-04 20:08:39 2963

原创 vue实现三级联动,多级联动

vue多级联动,三级联动

2019-04-25 10:34:54 24357

原创 JS类数组转化为数组

童鞋们在平时可能会遇到类数组Array-like,它和数组很像,但是就是没法用到数组的一些方法,真讨厌,所以我们通常要转换成数组才行。一、什么是类数组ArrayLike?兴趣先行,我们举一个比较经典的类数组(最经典的类数组是Arguments,这里暂且不说)。var nodeList=document.querySelectorAll(“div”);这个nodeList就是一个类数组。何以...

2019-04-09 11:25:47 1559 1

原创 前端输入Emoji表情导致的错误

用户输入了emoji表情,提交的时候因为后端没有存储相应的emoji字符编码,导致报错异常。原因: unicode定义的emoji是四个字符,对于一些之前没有考虑过emoji表情的系统来说,其获取或者展示简直就是灾难。公司用的MySQL,其utf8字符集最多支持三个字符。解决方案改变MySQL编码集设置,比如将其编码从utf8转换成utf8mb4前端直接过滤掉emoji,可以用正则实...

2019-04-02 10:26:42 1304

原创 fixed定位 input在IOS设备上光标位置异常问题

页面是个长页面,点击页面不同部分,会弹出弹窗,如果用absolute定位,那么弹窗的位置就难以定位,因而决定采用fixed定位,此时在IOS 11.2.x 系统中就 会出现点击input光标位置异常的问题。异常如图所示:原因分析fixed定位的元素,在该IOS系统存在bug,键盘会将fixed定位的元素上推,但是光标留在了原地,造成错位的现象。解决方案采用fixed定位,当点击激活...

2018-10-26 10:25:32 1725

原创 微信浏览器页面默认背景色的问题

在做一个微信扫描二维码的页面的时候,用同事的安卓手机扫码,发现页面的背景色差别非常大。 如下效果图,差别非常明显。结论:潜意识一直以为浏览器页面的默认背景色会一直是#ffffff(纯白色),但是查询一些资料之后发现一些浏览器的默认背景色并不是。所以最好的做法是 始终设置页面的背景色,避免出现这种情况。...

2018-08-01 16:37:47 9867

原创 IP地址,子网掩码计算子网地址,广播地址,子网划分。

已知某子网中的一个主机的IP地址为:203.123.1.135。子网掩码是: 255.255.255.192。求:该子网的子网地址是什么,广播地址是什么,该子网IP地址总数是多少,该子网可分配的IP地址数是多少,可分配的IP地址范围是多少。1. 子网地址IP地址与子网掩码进行按位与运算得到子网地址。(255转为十进制后为11111111,与任何八位二进制数A进行按位与运算结果都...

2018-07-26 19:56:01 23346 2

原创 二进制加法计算

读计算机原理这本书的的时候涉及到二进制数的加法,个人做个直观的纪律,防止遗忘。计算时,先把两个二进制数对齐(如果十进制一样)1+1为10,此时向上一位进1,0写在本位(如同十进制)不全为1的两个数,直接相加得到结果即可。比如数A 10111与数B01101相加从右向左计算, 结果如下:(图上数A和数B,上面的一位为进位)...

2018-07-21 15:24:58 24988

原创 shim和polyfill的区别

在JavaScript的世界里,有两个词经常被提到,shim和polyfill.它们指的都是什么?一个shim是一个库,它将一个新的API引入到一个旧的环境中,而且仅靠旧环境中已有的手段实现一个polyfill就是一个用在浏览器API上的shim.我们通常的做法是先检查当前浏览器是否支持某个API,如果不支持的话就加载对应的polyfill.然后新旧浏览器就都可以使用这个API了.牢记:...

2018-06-14 11:49:57 440

原创 zepto.js源码解读(三):zepto.Z函数

在了解zepto.Z函数之前,有必要了解一下原型链,继承等方面的知识。推荐阅读下以下博客:深入理解JavaScript原型和闭包

2017-09-29 16:05:17 653

原创 zepto.js源码解读(二):zepto.init函数

zepto.init函数

2017-09-26 18:23:46 314

原创 zepto.js源码解读(一):初窥全貌

因为公司是电商公司的缘故,主做H5页面,故使用了zepto.js这个库。因此就萌生解读一下源码的想法。以此记录下,方便自己归纳知识,以及督促自己。don’t talk, show me the code.

2017-09-26 15:57:39 483

原创 JS基于正则实现数字千分位用逗号分割

由于业务中经常出现要实现数字千分位用逗号分割的需求,因此封装一个函数,方便复用

2017-09-14 17:14:15 22379

原创 Sublime Text3 自定义快速生成代码

对于工作中,需要经常敲的代码。我们可以自定义代码段,来快速生成,避免重复无意义的工作。

2017-09-07 16:19:32 8738

原创 Vue2 vue-cli 中stylus 报错unexpected indent

用Vue-cli构建项目的时候,用stylus写样式,各种报错 unexpected indent 。浪费了两个小时的时间终于搞明白了问题。

2017-08-24 19:13:09 3687 3

原创 Vue 报错 listen EADDRINUSE :::8080

做Vue项目的时候出现 listen EADDRINUSE :::8080错误提示

2017-08-23 11:04:23 1015

原创 JS获取昨天,前天,明天,后天的日期

最近在做一个项目,我这里要把昨天/前天/大前天的日期传给后台,后台根据传过去的值而返回数据,用于展示一些内容。于是便封装了如下用js获取日期的方法。

2017-08-09 14:33:42 16799

原创 JS里的事件委托

1. 什么是事件委托2.实现事件委托

2017-07-31 20:01:29 1912

原创 font-size: 0;解决inline元素间的空白间隙

在公司写页面的时候,会引用公司的一个公共css,其中给主体部分设置了font-size:0 这个属性。起初觉得有些不方便,因为有文字的部分都要去设置font-size。后来发现这个属性真的很好用!~

2017-07-07 12:37:31 6488

原创 使用Git 出现 Another git process seems to be running in this repository...

使用git 出现Another git process seems to be running in this repository… fatal: Unable to create ‘D:/LearnGit/.git/index.lock’: File exists.

2017-07-04 18:45:25 6259 1

原创 Javascript 实现数组去重,快速排序

1.数组去重只讨论两种,当然方法很多。A: 最简单实现思路:定义一个新的空数组 n,利用 indexOf 判断, 遍历数组 arr ,如果 arr[i] 已经存在于 n 数组内,不添加;否则就将 arr[i] 添加到数组 n 中, 最后返回数组 nfunction unique(arr) { var n = []; for (var i = 0; i < arr.lengt

2017-06-07 18:19:25 528

原创 火狐浏览器 window.getComputedStyle()返回值的问题

html中 它的css样式为:.box { width: 200px; height: 200px; background: rgb(23,321,44); }js中我们要得到box这个元素的css属性,通常会用类似下面这样的函数:function getStyle(obj, str) { if (obj.currentS

2017-06-06 18:28:08 1443

原创 元素的水平垂直居中

1.行内元素水平居中a.将行内元素包裹在块级元素中,然后设置:text-align:center.box1 { background: #2b2b2b; margin: 0 auto; width: 100px; color: white; text-align: center; }2.块级元素水平居中块级元素的宽度一定,这就是我们平常所用

2017-03-03 15:35:47 506

原创 发布 订阅 消息系统(一)

1.从监听与发布说起我们写js代码的时候都知道有这样的事件:我们注册一个click方法 ,此时我们就为这个按钮添加了“监听”,基于“点击”事件的监听。以此来实现点击按钮提交表单数据的目的,在这里,我们通过点(发)击(布)这个动作,让系统知道:哦,我要提交这些表单。 这里的click方法,就是我们所要说的 “发布”。2.发布消息之后发生了什么当我发布登录消息的时候,就有很多模块...

2017-03-02 17:01:21 2189

原创 JavaScript中闭包的理解

对于JavaScript中闭包的理解。只做个人总结学习之用。如有误,还望指出。

2016-12-16 19:43:03 458 2

空空如也

空空如也

空空如也

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

TA关注的人 TA的粉丝

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