![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Javascript
文章平均质量分 92
进无止进
无尽之刃,无坚不摧。
展开
-
老生常谈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 · 614 阅读 · 0 评论 -
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 · 7382 阅读 · 2 评论 -
关于async和await
JavaScript中的async/await是AsyncFunction特性中的关键字。(读者可自行查阅改链接中内容)async定义的异步函数,通过使用 await,让异步函数的表现更像是同步函数。不用再层层回调。它是Generator函数的语法糖。其中async来声明该函数里有异步操作。await表示紧跟在后面的表达式需要等待结果与Generator函数比优点:内置执行器。Generator函数的执行必须依靠执行器,而 Aysnc函数自带执行器,调用方式跟普通函数的调用一样‘更好的语义。a原创 2020-07-01 12:19:30 · 666 阅读 · 0 评论 -
非常实用的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 · 268 阅读 · 0 评论 -
观察者模式和发布订阅模式(续)
两年前写过一篇关于消息发布订阅的文章,当时是结合了实际的应用场景。看起来不够抽象,概括。今天试图抽象话的再去写一下自己的理解。上篇文章:发布 订阅 消息系统(1),可点击查看。此文续上篇文章,取名改为观察者和发布订阅模式。什么是观察者模式?观察者模式(Observer Pattern)定义了一种当对象之间存在一对多的关系时的一种行为模式。比如当一个对象被修改时,则会通知它的依赖对象并自动...原创 2020-01-16 14:23:43 · 311 阅读 · 0 评论 -
发布 订阅 消息系统(一)
1.从监听与发布说起我们写js代码的时候都知道有这样的事件:我们注册一个click方法 ,此时我们就为这个按钮添加了“监听”,基于“点击”事件的监听。以此来实现点击按钮提交表单数据的目的,在这里,我们通过点(发)击(布)这个动作,让系统知道:哦,我要提交这些表单。 这里的click方法,就是我们所要说的 “发布”。2.发布消息之后发生了什么当我发布登录消息的时候,就有很多模块...原创 2017-03-02 17:01:21 · 2432 阅读 · 0 评论 -
JS多页面间通讯
需求:项目中做了一个音乐播放器,后面Boss说用户同时打开了多个页面播放音乐,这个时候每个页面都在播放音乐,能不能只让当前用户操作的页面播放音乐。接到这个需求的时候,先去某云音乐看了一下,用的应该是WebSocket。给领导反馈一下后,领导说后端腾不出资源配合。那只能先排除这种方案了。当时的思路是这样的:具体是:给每一个打开的要播放的网页链接加一个唯一标识参数(uuid),点击播放的时...原创 2020-01-09 17:36:20 · 1386 阅读 · 0 评论 -
js中的this,arguments, callee, caller
一张图,先捋一捋逻辑arguments在函数内部,有两个特殊的对象:arguments 和 this。arguments是一个类数组对象,包含着传入函数中的所有参数。在函数体内可以通过arguments对象来访问这个参数数组,从而获取传递给函数的每一个参数。arguments对象只是与数组类似(它不是Array的实例)。可以使用方括号语法访问它的每个元素。arguments[0]没有...原创 2019-12-27 14:41:17 · 237 阅读 · 0 评论 -
js的break,continue,return及流控制语句
横向对比js的流控制语句,从此不再迷茫。哈哈,给此博文插图:当前端发现全公司只有一个人手机显示的界面有问题的时候…break: 终止循环,使当前循环不再继续执行。用于跳出循环或switch语句。当是嵌套循环的时候,只能跳出一层循环。continue: 跳过当前循环,继续往下判断循环执行语句,相当于开始循环的一次新迭代。只能结束循环中的一次过程,无法阻止循环继续进行。return: ...原创 2019-12-27 11:26:52 · 381 阅读 · 0 评论 -
深入理解JavaScript中的执行环境(execution context)
-------------------------------------华丽的分割线-------------------------------------执行环境(execution context,也称作‘环境’)定义了变量或函数有权访问的其他数据,决定了他们各自的行为。每个执行环境都有一个与之关联的变量对象,,环境中定义的所有变量和函数都保存在这个对象中。代码执行时,可以划分为以...原创 2019-12-26 16:09:24 · 719 阅读 · 2 评论 -
jQuery的onclick事件导致点击事件累计触发的问题
问题场景维护公司老项目的时候,发现以下问题。在使用jQuery中的click事件对页面中某个元素对象进行绑定时,如果不采用防抖/节流的写法会出现事件被多次绑定的情况。如果发生这种问题,会导致一次触发请求多次的情况,直接导致服务器的压力飙升。严重的话,服务器会直接挂掉。接下来具体说一下这个问题是如何形成的。<div onclick="handleClick()">点我<...原创 2019-08-12 09:40:33 · 1427 阅读 · 0 评论 -
JS中的parseInt,parseFloat,Number等数值转换函数
JS数值转换函数:Number()parseInt()parseFloat()Number()转换规则:如果是Boolean,分别转化为0 , 1如果是数字值,只是简单的传入和传出如果是null值,返回0如果是undefined, 返回NaN如果是字符串,遵循以下规则:- 如果字符串中只包含数字,(包括前面带正号或负号的情况),则将其转换为十进制数值,即"1"会变成 1,...原创 2019-08-14 10:27:07 · 3107 阅读 · 0 评论 -
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 · 173 阅读 · 0 评论 -
JS中的setTimeout
JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成。它们向任务队列添加定时任务。初始接触它的人都觉得好简单,实时上真的如此么?这里记载下,一路对其使用姿势变迁的历程。1.setTimeout()基础setTimeout函数用来指定某个函数或某段代码,在多少毫秒之后执行。它返回一个整数,表示定时器的...转载 2019-07-04 20:08:39 · 13222 阅读 · 0 评论 -
vue实现三级联动,多级联动
vue多级联动,三级联动原创 2019-04-25 10:34:54 · 32321 阅读 · 2 评论 -
JS类数组转化为数组
童鞋们在平时可能会遇到类数组Array-like,它和数组很像,但是就是没法用到数组的一些方法,真讨厌,所以我们通常要转换成数组才行。一、什么是类数组ArrayLike?兴趣先行,我们举一个比较经典的类数组(最经典的类数组是Arguments,这里暂且不说)。var nodeList=document.querySelectorAll(“div”);这个nodeList就是一个类数组。何以...原创 2019-04-09 11:25:47 · 1831 阅读 · 1 评论 -
JS中运算符i++与++i的详细分析
新手朋友容易混淆的概念,特提出自己的想法思路,仅供参考,错误之处,还望指出。原创 2016-12-01 18:30:53 · 9309 阅读 · 0 评论 -
JavaScript中闭包的理解
对于JavaScript中闭包的理解。只做个人总结学习之用。如有误,还望指出。原创 2016-12-16 19:43:03 · 527 阅读 · 2 评论 -
新手注意不到的display和visibility属性差别
由于一直自学,对display仅仅停留在会用的阶段。学习过程中发现了visibility属性和display属性效果似乎一致。于是便查阅一些资料,写一些小总结。方便新手朋友已经我自己查阅,并深入理解属性。一、Display的属性值block:表现为一个块级元素(一般情况下独占一行当display被设置为block(块)时,容器中所有的元素将会被当作一个单独的块,原创 2016-11-29 18:02:05 · 2247 阅读 · 0 评论 -
火狐浏览器 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 · 1715 阅读 · 0 评论 -
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 · 703 阅读 · 0 评论 -
JS里的事件委托
1. 什么是事件委托2.实现事件委托原创 2017-07-31 20:01:29 · 2002 阅读 · 0 评论 -
JS获取昨天,前天,明天,后天的日期
最近在做一个项目,我这里要把昨天/前天/大前天的日期传给后台,后台根据传过去的值而返回数据,用于展示一些内容。于是便封装了如下用js获取日期的方法。原创 2017-08-09 14:33:42 · 19149 阅读 · 2 评论 -
JS基于正则实现数字千分位用逗号分割
由于业务中经常出现要实现数字千分位用逗号分割的需求,因此封装一个函数,方便复用原创 2017-09-14 17:14:15 · 24363 阅读 · 2 评论 -
Sublime Text3 自定义快速生成代码
对于工作中,需要经常敲的代码。我们可以自定义代码段,来快速生成,避免重复无意义的工作。原创 2017-09-07 16:19:32 · 9203 阅读 · 1 评论 -
Vue中axios POST传参问题
最近做了一个后台的管理系统,为了实现回调,不得不进行层层的嵌套(callback hell)。第二版本的时候决定使用es6的新特性Promise对代码进行优化,为了兼容各浏览器环境,引入了一个兼容的promise.js。网上关于Promise的用法很多,就不做过多介绍。为了一次搞清这一新特性,决定研究一下这个promise.js的源码。( promise.js的下载地址)。原创 2018-04-10 20:02:18 · 18405 阅读 · 2 评论 -
shim和polyfill的区别
在JavaScript的世界里,有两个词经常被提到,shim和polyfill.它们指的都是什么?一个shim是一个库,它将一个新的API引入到一个旧的环境中,而且仅靠旧环境中已有的手段实现一个polyfill就是一个用在浏览器API上的shim.我们通常的做法是先检查当前浏览器是否支持某个API,如果不支持的话就加载对应的polyfill.然后新旧浏览器就都可以使用这个API了.牢记:...原创 2018-06-14 11:49:57 · 563 阅读 · 0 评论 -
fixed定位 input在IOS设备上光标位置异常问题
页面是个长页面,点击页面不同部分,会弹出弹窗,如果用absolute定位,那么弹窗的位置就难以定位,因而决定采用fixed定位,此时在IOS 11.2.x 系统中就 会出现点击input光标位置异常的问题。异常如图所示:原因分析fixed定位的元素,在该IOS系统存在bug,键盘会将fixed定位的元素上推,但是光标留在了原地,造成错位的现象。解决方案采用fixed定位,当点击激活...原创 2018-10-26 10:25:32 · 2309 阅读 · 0 评论 -
前端输入Emoji表情导致的错误
用户输入了emoji表情,提交的时候因为后端没有存储相应的emoji字符编码,导致报错异常。原因: unicode定义的emoji是四个字符,对于一些之前没有考虑过emoji表情的系统来说,其获取或者展示简直就是灾难。公司用的MySQL,其utf8字符集最多支持三个字符。解决方案改变MySQL编码集设置,比如将其编码从utf8转换成utf8mb4前端直接过滤掉emoji,可以用正则实...原创 2019-04-02 10:26:42 · 2059 阅读 · 0 评论 -
JS中单引号和双引号之我见
JS中单双引号之自我见解,若以后理解更深入,再补充在js不断的敲代码过程中,个人习惯问题经常将双引号打为单引号,因此出了不少次错误。所以写出这些东西以加深印象,同时给像我一样的人一点小提示。 常规情况下两者并没有区别,但是涉及到嵌套的时候,请看一下代码:点击 此时双引号是不对的,就算用了如下的转义字符:\"双引号是不对的\")">点击 他也原创 2016-11-29 21:14:23 · 1103 阅读 · 0 评论