![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
文章平均质量分 80
南极一块修炼千年的大冰块
一名不断成长中的前端开发工程师,希望在这里能多多学习,同时也能将知识分享给更多的人。
展开
-
《看完就懂系列》谈谈数据埋点的原理与实现
这是大冰块2021年第7篇原创文章,和大冰块一起在前端领域努力吧!!!????写在前面之前公司接了个做广告的业务,甲方财大气粗,沟通也特别顺利。刚开始的时候,大家都摩拳擦掌兴致满满,觉得这个项目奖金一定会翻一番。于是第一版赶得很急,上线之后,点击率与转化率却一直不温不火。眼瞅着到嘴的项目奖金要飞走,leader说如果运维的小伙伴能根据具体原因快速定位,还怕点击率和转化率不“噌噌噌”的上涨吗?所以第二版先做个数据埋点吧~那么什么是数据埋点呢?数据的原理是什么?数据埋点又该如何实现呢?什么是数据埋点原创 2021-01-14 15:42:34 · 1451 阅读 · 0 评论 -
《看完就懂系列》Ajax是不是凭一己之力造就了整个前端的生态圈?
这是大冰块2021年第6篇原创文章,和大冰块一起在前端领域努力吧!!!????写在前面前几天,有小伙伴面试的时候被面试官问:谈谈Ajax的原理~ 他说回答得不太好。我想,Ajax有什么原理?不就是发请求拿数据渲染页面吗?抱着怀疑即是寻求真理的想法,我重新梳理了一遍Ajax的发展过程。发现Ajax简直是凭一己之力造就了整个前端生态圈啊,如果没有Ajax技术,今天的我可能就是一个java程序员了,然后写着jsp的页面~这么说吧:没有Ajax,就没有前端处理渲染数据的可能,没有局部刷新,没有动态渲染,没原创 2021-01-13 14:59:28 · 187 阅读 · 0 评论 -
《看完就懂系列》项目中的权限管理复杂吗?
这是大冰块2021年第5篇原创文章,和大冰块一起在前端领域努力吧!!!????写在前面还记得在我入门没多久的时候,第一次接触公司中大型项目的时候,项目权限这块把我搞的很懵。大概是我的逻辑思维不够强大,猛然接触新的思维方式老是转不过弯来。不过功夫不负有心人,靠着前辈的指导和自己一点点摸索,总算对权限的整体流程(前端方面)有了一个基本的掌握。如今回首再看,前端方面的权限管理其实没什么难度,就像一把钥匙开一把锁,只要把一一对应的逻辑关系做好就可以了。因为思路是相似的,所以实现的代码都是大同小异,因此本原创 2021-01-12 16:07:05 · 214 阅读 · 2 评论 -
《看完就懂系列》天哪!搞懂节流与防抖竟简单如斯~
这是大冰块2021年第4篇原创文章,和大冰块一起在前端领域努力吧!!!????写在前面今天来谈一谈节流与防抖,这是一个老生常谈的概念,实际应用也特别多,面试中经常会问到。可还是有很多初学者不明白,搞不懂两者之间的区别,或者两者的概念与实际应用中的差别(比如我刚接触的时候就是搞不明白这两个绕来绕去的概念)。其实明白之后就豁然开朗,觉得很简单了。所以今天我们来谈一下这个节流与防抖,争取给它重新谈出花样来????。防抖篇★防抖小故事小熊早上去找小虎玩,到了小虎家门口,小熊准备一直摁门铃吵醒小虎,所以小原创 2021-01-11 14:43:18 · 125 阅读 · 0 评论 -
《JS玩算法系列》海王的鱼塘
这是大冰块2021年第3篇原创文章,和大冰块一起在前端领域努力吧!!!写在前面不知为什么,感觉2020年面试过程中算法题突然流行了起来,不论你是前端后端还是架构师,面试前都得先来两道算法题热热身。如果你很干脆的回答不会,hr小姐姐就会吃惊地问你:什么?身为一个前端程序员竟然不会算法??? 语气口吻就好比你的亲戚问你:不会吧不会吧!身为一个程序员不会修电脑??? 让你心跳加速脸红娇喘羞愧难当…为了避免这种尴尬的情况出现,今天趁着*领导不在*阳光正好,我们一起来摸一条某大厂中等算法题的大鱼试试看,想.原创 2021-01-07 16:30:06 · 403 阅读 · 1 评论 -
《看完就懂系列》15个方法教你玩转字符串
这是大冰块2021年第2篇原创文章,和大冰块一起在前端领域努力吧!!!作为JavaScript基础数据类型,字符串具有一些很强大的方法,在平时的工作中用到的地方也特别的多,很多时候因为不熟悉某个字符串的方法,往往走了很多弯路,所以大冰块整理了15个常用又高效的字符串方法,来一起看看这15个提升工作效率的方法吧!1.字符串去除首尾空格 —— trim()说明: 去除字符串两边的空白。需求场景: 用户搜索前去除输入的首尾空格。用法: string.trim()例子:let str = " .原创 2021-01-06 16:26:53 · 218 阅读 · 2 评论 -
《看完就懂系列》字符串截取方法substr() 、 slice() 和 substring()之间的区别和用法
字符串截取和拼接是字符串最我们最常用也是最易错的方法。主要原因是 substr() 和 slice() 和 substring()的区别看起来很乱,有很多小伙伴还不太明白。所以今天大冰块牺牲了摸鱼 时间,重新整理了一遍关于这三个截取字符串方法之间的区别。首先来归纳总结一下三个方法的传参:substr():参数一(必须):一个整数,要开始截取字符的下标,如为负则代表从尾部开始截取。参数二(可选):一个整数,要截取字符的数量。如果省略该参数,则默认为string.length,即当前字符串的长度。原创 2021-01-05 17:39:55 · 967 阅读 · 0 评论 -
void 0 有什么意义?undefined竟然是可变的?
1,void 后需要跟表达式,表达式中的语句会全部执行。例如:void console.log("哈哈哈") // 控制台打印“哈哈哈”void alert("嘻嘻嘻") // 浏览器弹出“嘻嘻嘻”void 1+2 // 返回值是NAN,为什么呢???// 这是因为1+2外面没有加(),默认从左到右执行,void 1为undefined,undefined+2为NANvoid (1+2) // 返回值是undefined2,void返回值永远是undefined。例如:let a = v原创 2021-01-04 17:30:04 · 204 阅读 · 0 评论 -
vue自定义全局过滤器filter
原理步骤如下:将filter方法暴露出来挂载在vue实例上直接使用对应的操作为:在公共方法文件夹utils内新建filters.js文件在main.js中对filters中暴露的方法进行挂在vue中在项目任意页面直接使用以时间过滤为例,代码如下:filters.js// 此文件为公共的全局过滤器// 时间戳格式化过滤器,传参如下:// value:时间戳,string,number均可// num:返回样式,默认1(1:2020/12/16)(2:2020-12-16 1原创 2020-12-16 16:12:56 · 386 阅读 · 2 评论 -
JavaScript中为什么“null==0“为false?? “null>=0“为true???
JavaScript中为什么"null==0"为false而"null>=0"为truenull > 0 // null 尝试抄转型为number , 则为0 . 所以结果为 false,null >= 0 // null 尝试转为number ,则为0 , 结果为 true.null == 0 // null在设计上,在此处不尝试转型. 所以 结果为false.关系运算符知 和 相等运算符 并不是一个类别的.关系运算符,在设计上总是需要运算元道尝试转为一个numbe原创 2020-11-23 16:40:50 · 2213 阅读 · 2 评论 -
axios发送post请求500
const params = new URLSearchParams();params.append('couponNo', couponNo);axios.post('/order/addThirdAnniversaryCoupon.action',params).then((res) => { console.log(res)}).catch((error) => { console.log(error)});原创 2020-11-22 23:00:38 · 2706 阅读 · 0 评论 -
vue 在css 引入背景图background: url(艾特assets/img/bg.png) 报错
vue 在css 引入背景图background: url(@assets/img/bg.png) 报错 Cannot find module ‘./@assets/img/bg.png’把background: url(@assets/img/bg.png) 改为background: url(~@assets/img/bg.png)原创 2020-11-22 22:48:18 · 11300 阅读 · 6 评论 -
vue中跳转刷新页面或路由,浏览器提示当前页面未保存
mounted() { // 地址跳转前拦截 window.onbeforeunload = function (e) { e = e || window.event; // 兼容IE8和Firefox 4之前的版本 if (e) { e.returnValue = '关闭提示'; } .原创 2020-08-03 19:52:11 · 1323 阅读 · 0 评论 -
HTML提供的5种空格实体
HTML提供了5种空格实体(space entity),它们拥有不同的宽度,非断行空格( )是常规空格的宽度,可运行于所有主流浏览器。其他几种空格( )在不同浏览器中宽度各异。 它叫不换行空格,全称No-Break Space,它是最常见和我们使用最多的空格,大多数的人可能只接触了 ,它是按下space键产生的空格。在HTML中,如果你用空格键产生此空格,空格是不会累加的(只算1个)。要使用html实体表示才可累加,该空格占据宽度受字体影响明显而强烈。 它原创 2020-07-23 09:41:41 · 363 阅读 · 0 评论 -
JavaScript最常用又简单粗暴的15个数组方法
在JavaScript中,数组是一个特殊的变量,用于存储不同的元素。它具有一些内置属性和方法,可用于根据需要进行增删改查的基本操作及复杂操作。并且了解JavaScript数组方法可以提升你的开发技能。在本文中,我们将介绍15种关于JavaScript的数组方法,这些方法可以帮助你正确地处理数据。1.some()2. reduce()3. Every()4. map()5. flat()6. filter()7. forEach()8. findIndex()9. find()10. s原创 2020-07-23 09:32:05 · 241 阅读 · 0 评论 -
懒加载情况下,更改某一页某一条数据后,如何做到页面位置不变实时更新的4种方法
例如:我向后台请求数据,,共12条数据,每页是5条数据,一共3页,即请求3次,用懒加载实现。第一次我请求第1页,把拿到的5页数据存在dataList中,然后渲染出来。 当用户拉到底部,我请求第2页数据,通过concat()方法存在dataList中,再次渲染5条数据。 当用户再次拉到底部,我请求第3页数据,第3页只有2条数据,通过concat()方法存在dataList中,然后渲染在列表中。...原创 2020-04-30 11:54:59 · 1118 阅读 · 1 评论 -
节流和防抖的说明和实现
在各个平台搜索“节流和防抖”,各种教程已经说的很多了,但是我之前刚接触节流和防抖的时候,还是很不理解,因为有的教程是互相引用直接复制粘贴的,看完不仅不知所以然,而且更迷茫了。其实理解之后,我们会发现节流和防抖的概念和用法是很简单的。为了避免新手小白继续踩坑,我来一个浅显的说明和简单的实现。说明节流:第一次点击立刻触发事件,此后点击时间与上次触发事件的时间大于3s才会触发就像纸条经过打孔机...原创 2020-01-16 12:01:08 · 164 阅读 · 0 评论 -
在vue+element-ui中,select选项值动态从后台获取,同时将选中值的id传给后台的方法
**问题:** 选项动态从后台获取,同时要实时获取到用户选中值的id 如select框有红,黄,蓝三个值,id分别为1,2,3 用户点击红,我要获取到红的id为1 用户点击黄,我要获取到红的id为2 用户点击蓝,我要获取到红的id为3 **首先问题步骤分为三步:** 1,点击select框,发送请求到后台取到值data,动态渲染到页...原创 2019-07-12 19:14:11 · 40140 阅读 · 20 评论 -
获取当前元素到页面底部的距离及其他获取距离问题
在我们进行懒加载的逻辑时,经常会遇到各种获取距离问题,比如获取当前元素到页面底部的距离,获取文档网页底部到可视区窗口距离,获取…大脑想象图形化比较困难的同学就会感觉很绕很麻烦,其实我们只需要获取到这五个值,就可以当前页面中存在的各种距离了我特意做了一张图:例如:文档底部与可视区窗口底部的距离 = 文档总高度 - 文档滚动高度 - 可视区窗口高度当前元素与底部的距离 = 文档总高度 - ...原创 2019-11-20 11:24:38 · 11439 阅读 · 5 评论 -
在局域网下通过ip地址访问vue本地项目
一找到:build>>webpack.dev.conf.js把const HOST = process.env.HOST修改为:const HOST = ‘192.168.1.139’(192.168.1.139是本地电脑的ip地址)二找到:package.json把"dev": “webpack-dev-server --inline --progress --con...原创 2019-10-29 14:11:38 · 411 阅读 · 0 评论 -
在el-table中判断三种情况,显示不同的数据
后端传来的数据是数据0,1,2。0代表未支付,1代表支付宝支付,2代表微信支付,要求动态显示在表格中 <el-table-column align="center" prop="pay_method" label="支付方式" width="150"> <template slot-scope="{row: {pay_method}}"> ...原创 2019-07-12 21:25:06 · 9151 阅读 · 0 评论 -
关于Error in callback for watcher “data“: “TypeError: data.indexOf is not a function“的错误
关于Error in callback for watcher “data”: "TypeError: data.indexOf is not a function"的错误说明原因:表格显示需要数组包含对象的形式,每个对象是一行数据,拿到的数据格式不对。错误例子:从后台获取数据res.data,显示在表格中。只有一条数据,六个内容,应该是一行六列,但是出现了六行六列,且都为空。报三个...原创 2019-07-16 11:59:02 · 29122 阅读 · 3 评论 -
element-ui编辑表单中的el-radio无法选择的情况
困扰了半上午的bug,表单样式及代码如下。问题是回显数据之后,当我点击其他的radio想要选择的时候,勾选不了。在网上找到了一样的bug,有解决方案,同样没有找到原因。解决方案是:原本是把从后台得到的数据res.data直接赋值给editPowerForm,现在需要先把res.data赋值给let obj,然后再由let obj赋值给editPowerForm,就可以了。还有需要注意的...原创 2019-08-09 11:11:32 · 14029 阅读 · 3 评论 -
在main.js的axios中配置响应拦截器,当token值不合法直接跳转到登录页
先上代码:// 给axios配置响应拦截器axios.interceptors.response.use( function(response) { // 通过响应拦截器,直接返回 res.data console.log(response.data.code) if (response.data.code === 4002) { Vue.prototy...原创 2019-09-29 17:32:09 · 826 阅读 · 0 评论 -
关于this的指向问题
关于this的指向一般是这几类:普通函数中: this—&amp;amp;gt;window定时器中: this—&amp;amp;gt;window构造函数中 : this—&amp;amp;gt;当前实例化的对象事件处理函数中: this—&amp;amp;gt;事件触发对象js中一般理解为: 谁调用,就指向谁如下代码:&amp;amp;lt;script type=&amp;原创 2018-12-05 22:36:45 · 164 阅读 · 0 评论