龙哥哥前端笔记
文章平均质量分 63
545龙哥哥
天天学习,好好向上。
展开
-
基于elementui input完成的输入控件
input输入框组件原创 2022-11-12 16:32:56 · 2867 阅读 · 0 评论 -
解锁了一个scss的新技能(@each)
在公司做的一个需求,有一个页面的内容需要一行一行展现出来,如下效果:从上面的图片到底部的按钮,一个一个的出来(这是最开始的动效,后来觉得有点慢,中间的文字改成了两行两行出现),这个时候css代码是这样子的:.fade-enter-active { transition-property: opacity; // 规定设置过渡效果的css属性的名称 transition-duration: 1s; // 规定过渡效果需要多少秒或毫秒 transition-timing-functi原创 2021-05-19 19:01:07 · 501 阅读 · 0 评论 -
一行npm命令打包两个node版本不同的项目
背景:公司后台管理系统的代码是angularjs项目和vue项目在一起混搭,vue项目其实是属于angularjs的子项目。如图:问题:之前在用svn发布上线时,都是手动通过nvm执行两次node版本切换,再执行两次打包命令。迁移git要自动发布,就要考虑将四条命令合并成一一条命令。解决方案: 1. 老后台使用的gulp打包,node版本v6.9.2。如下,老后台gulp在打包时会执行一条clean的task,这条任务会将dist目录下面的所有资源全部清除掉。...原创 2021-05-19 18:17:56 · 1729 阅读 · 2 评论 -
JavaScript数据结构之栈的认识
栈数据结构栈是一种遵从后进先出(LIFO)原则的有序集合。新添加或待删除的元素都保存在栈的同一端,称作栈顶,另一端就叫栈底。在栈里,新元素都靠近栈顶,旧元素都接近栈底。接下来,我们创建一个类来表示栈。新建一个 stack-array.js 文件const Stack { constructor() { this.items = []; } // 下面是为栈声明一些方法 push(element) { // 添加新元素到栈顶 this.items.push原创 2020-10-15 18:05:24 · 140 阅读 · 1 评论 -
基于渲染流程的CSS优化建议
CSS 选择符是从右到左进行匹配的,比如 #myList li {}实际开销相当高。 避免使用通配符,只对需要用到的元素进行选择。 关注可以通过继承实现的属性,避免重复匹配重复定义。 少用标签选择器。如果可以,用类选择器替代。错误:#dataList li{} 正确:.dataList{} 不要画蛇添足,id 和 class 选择器不应该被多余的标签选择器拖后腿...原创 2019-08-22 10:54:20 · 129 阅读 · 0 评论 -
js实现数组去重简洁代码(filter,Set,reduce)
1、通过filter实现数组去重filter中传入的函数有三个参数。第一个item表示当前元素的值,第二个index表示当前元素的索引值,第三个self表示当前元素属于的数组对象。var arr = [2,4,3,3,4,2,3,254,234,4];function unique(arr) { return arr.filter((item, index, self) =&g...原创 2019-08-01 22:05:22 · 1058 阅读 · 0 评论 -
一篇文章搞懂this指向问题
先上结论:1.元素绑定事件,方法中的this是当前操作的元素2.方法名前面是否有点,有点,点前面是谁this就是谁,没有this是window(严格模式会有问题)3.构造函数执行,方法体中的this是当前类的一个实例再来举例: 第一种元素绑定事件的情况大家应该都比较好理解,就不举例了。事例1:var fullName = 'language';var obj =...原创 2019-07-09 07:50:58 · 128 阅读 · 0 评论 -
npm-cli.js报错
安装node的新版本,之后npm -v 报错,找不到npm-cli.js文件。然后在网上各种查,发现都没实现:1、卸载重装(失败)2、使用gnvm升级npm(失败--直接就没升级成功)3、把朋友好着的node解压包拿过来用(失败--我的和他的没什么区别)后来我就觉得肯定是之前的node 版本有什么缓存没清理干净,想到了环境变量,然后我就把和npm相关的环境变量全部删掉,然后重新...原创 2019-01-31 22:39:04 · 1473 阅读 · 0 评论 -
setTimeout的骚操作
先回顾一下定时器的一些重要知识:1、Javascript引擎是单线程执行,异步事件必须要排队等待才能执行。2、如果无法立即执行定时器,该定时器会被推迟到下一个可用的执行时间点上(可能更长,但不会比指定的延迟时间更少)。3、如果一直被延迟,到最后,Interval间隔定时器可能会无延迟执行,并且同一个interval处理程序的多个实例不能同时进行排队。4、setTimeout()和s...原创 2018-12-10 21:16:59 · 257 阅读 · 0 评论 -
你所不知道的javascript函数重载
本文内容基本来自于JavaScript Ninja一书(79页),讲道理,我看懂那个方法都费了好大劲,也不知道理解的对不对,有大佬有好的想法可以供我参考参考会不胜感激~javascript函数重载不同于其他语言的函数重载,它其实没有真正意义上的重载,只是通过传入的参数进行判断来模拟函数重载。基本上有以下三种方法:1、通用方法,根据传入参数的类型执行不同的操作。2、通过某些特定参...原创 2018-11-21 22:07:21 · 161 阅读 · 0 评论 -
遍历对象:编写一段js代码实现对对象obj={x:1,y:{a:2,b:{c:3,d:4}}}所有值的遍历
var obj = { x: 1, y: { a: 2, b: { c: 3, d: 4 } }};//获取对象所有的key值function getKeys(obj) { //es6新语法 Object.prototype.toString()方法精准判断参数...原创 2018-10-31 23:23:39 · 5072 阅读 · 2 评论 -
前端面试题总结(持续更新中···)
目录1、什么是响应式设计?响应式设计的基本原理是什么?2、Javascript的基本数据类型有哪些?3、什么是闭包(closure),为什么要用它?4、Jquery一个对象可以同时绑定多个事件,这是如何实现的?5、如何实现浏览器内多个标签页之间的通信(页面间数据传输)?6、null和undefined的区别?7、MVVM与MVC的区别?8、常用的块级元素、行内元素、...原创 2018-10-19 00:14:15 · 201 阅读 · 0 评论 -
css实现一个页面loading的动画
有点笨,不会生成gif图,效果就是那两张图片中的黑点点,会按顺序从无到有,形成一种loading的感觉。完整代码如下,可直接复制看效果~<!DOCTYPE html><html><head> <title></title></head><style...原创 2018-09-10 00:12:13 · 504 阅读 · 0 评论 -
cookie的domain属性
欢迎大家光临我的个人博客,详戳 https://545longgege.top/最近在改一个bug单时,有个问题涉及到了cookie的domain属性,大致场景是由于不同的服务页面出现了同名的cookie但是domain域不同,导致出现了不可思议的bug。于是查询与cookie的domain属性相关的资料并记录之。1、什么是Cookie? Cookie是由W3C组织提出,最...原创 2018-07-31 00:57:44 · 89502 阅读 · 14 评论 -
浅谈Object.assign(对象合并、浅复制)
object.assign()方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象,它将返回目标对象。var person1 = { name: "xiaoming", age: 18, job: "programmer"}var person2 = { age: 21, stature: "181cm"}var person = Ob...原创 2018-07-23 00:36:45 · 4733 阅读 · 0 评论