JavaScript
小瑾沐晚风
keep learning
展开
-
多次请求只保持最后一次的结果
最近项目总结,如果一个输入框和一个搜索按钮,点击查询的时候,需要发起请求获取数据,因为请求是异步的,则无法获取哪一次的请求是最后一次的请求,则可以进行一下操作优化:思路一:请求外部存在一个变量,记录每次请求的标记值;可以将外部的标记值传入调用请求的内部,因为函数有作用域的概念,所以暂时目前传入的数据是会一直存在于该作用域内部的,但是外部的标记值会一直变化,当是最后一次请求的时候,外部的值和内部接收的值是相同的,可以在此处进行数据处理。vue代码如下:<template> <原创 2021-10-19 15:47:04 · 5397 阅读 · 5 评论 -
for-in和for-of
参考:https://www.cnblogs.com/qiqingfu/archive/2018/11/28/10035554.htmlfor in 和 for of 相对于大家肯定都不陌生,都是用来遍历属性的没错。那么先看下面的一个例子:例1:以上是遍历对象,下面再看一个遍历数组的例子。var arr = [1,3,5]//for-in循环for(let i in arr...原创 2019-10-17 16:41:26 · 273 阅读 · 0 评论 -
原生JS添加类名 删除类名
为 <div> 元素添加 class:document.getElementById("myDIV").classList.add("mystyle");为 <div> 元素添加多个类:document.getElementById("myDIV").classList.add("mystyle", "anotherClass", "thirdClass"...原创 2019-09-04 16:23:16 · 1765 阅读 · 0 评论 -
JavaScript数组去重,排序
一. 去重1. 使用ES6里面的SetSet类似于数组,但是其中成员的值唯一,没有重复的值。Array.from可将Set结构转换为数组。2.使用indexOf思路:因为indexOf()方法可以用来制定某个字符在字符串中首次出现的位置,如果用在数组中,indexOf() 方法可返回数组中某个指定的元素位置。如果在新数组temp中首次出现的位置为-1(即没有出现过)...原创 2018-10-31 19:06:10 · 513 阅读 · 0 评论 -
JavaScript中的原型和原型链
1.prototype我们创建的每一个函数都有一个prototype(原型)属性,这个属性是一个指针,指向了一个对象,而这个对象的用途就是包含可以由特定类型的所有实例共享的属性和方法。好处:使用原型的好处就是可以让所有的对象实例共享原型对象所包含的属性和方法。1. 无论什么时候,主要创建了一个新函数,就会根据一组特殊的规则为该函数创建一个prototype属性,这个属性指向函数的原...原创 2018-09-27 16:59:48 · 1122 阅读 · 0 评论 -
BOM
简介BOM(浏览器对象模型)提供了很多对象,用于访问浏览器的功能,这些功能与任何网页内容无关。1.window对象BOM的核心对象是window,它表示浏览器的一个实例。在浏览器中,window对象具有双层角色,它既是通过JavaScript访问浏览器窗口的一个接口,又是ECMAScript规定的Global对象。2.location对象location对象是最有用的BOM对象...原创 2019-03-20 00:13:52 · 209 阅读 · 0 评论 -
关于setTimeOut和Promise执行顺序的问题
前言promise为es6引进的语言标准,为异步编程的一种解决方案;阅读此文的前提是了解浏览器event loop的机制,还有promise的基本用法和特性,比如他自执行特性、状态不可逆特性等任务队列中的宏观任务和微观任务任务队列并不是只有一个,不同的任务对应着不同的任务队列。宏观任务放入宏观任务队列,微观任务放入微观任务队列,这些任务队列在栈空的时候被调入的优先级是微观任务队列优于...原创 2019-03-07 17:18:19 · 3325 阅读 · 0 评论 -
事件DOMContentLoaded和load的区别
参考:https://www.cnblogs.com/caizhenbo/p/6679478.htmlDOM文档加载的步骤为: 1.解析HTML结构。 2.加载外部脚本和样式表文件。 3.解析并执行脚本代码。 4.DOM树构建完成。//DOMContentLoaded 5.加载图片等外部文件。 ...原创 2019-03-07 15:30:15 · 243 阅读 · 0 评论 -
JavaScript简单实现节流和防抖
函数节流和函数防抖,两者都是优化高频率执行js代码的一种手段。在一定时间内,代码执行的次数不一定要非常多。达到一定频率就足够了。因为跑得越多,带来的效果也是一样。倒不如,把js代码的执行次数控制在合理的范围。既能节省浏览器CPU资源,又能让页面浏览更加顺畅,不会因为js的执行而发生卡顿。这就是函数节流和函数防抖要做的事。一.节流定义:触发函数事件后,短时间间隔内无法连续调用,只有上一次...原创 2019-03-08 16:48:08 · 518 阅读 · 0 评论 -
apply(),call()和bind()
1.apply(),call()和bind()的相同点三者都可以把一个函数应用到其他对象上;都是用来改变函数内部的this的指向的;2.call()和apply()相同点:都是调用一个对象的一个方法,用另一个对象替换当前对象(功能相同)例如: B.call(A, args1,args2);即A对象调用B对象的方法 ,且向调用的方法传入args1,args2......参数 ...原创 2019-02-13 23:22:39 · 205 阅读 · 0 评论 -
普通函数和箭头函数的this
普通函数的this1. this总是代表它的直接调用者, 例如 obj.func ,那么func中的this就是obj2. 调用的时候,没有任何前缀,则指向window,new的时候,指向new出来的对象。3.在默认情况(非严格模式下,未使用 'use strict'),没找到直接调用者,则this指的是 window4.在严格模式下,没有直接调用者的函数中的this是 unde...原创 2019-02-11 22:06:50 · 5160 阅读 · 0 评论 -
JavaScript数组方法总结
一.JavaScript中创建数组的方式1.使用Array构造函数var color=new Array(); 注意:括号里面参数可以有参数,若为一个数字,表示该数组的长度,如果为多个数字或者一个(多个)非数字表示的是传递数组中应该包含的值。2.使用数组字面量var color=[];二. 数组的长度三.数组的方法有数组原型方法,也有从object对象继承来的...原创 2018-09-25 18:48:29 · 36042 阅读 · 10 评论 -
回流(重排)和重绘
参考:https://segmentfault.com/a/1190000017329980https://www.cnblogs.com/dujingjie/p/5784890.html浏览器的渲染过程从上面这个图中,可以看出浏览器的渲染过程如下:解析HTML,生成DOM树 解析CSS,生成CSSOM树 将DOM树和CSSOM树结合,生成渲染树(Render Tree...原创 2019-01-18 19:00:56 · 1485 阅读 · 0 评论