![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
javaScript
꧁薇博꧂
这个作者很懒,什么都没留下…
展开
-
图片懒加载原理
什么是图片懒加载?当打开一个有很多图片的页面时,先只加载页面上可视区域的图片,等滚动到页面下面时,再加载所需的图片。这就是图片懒加载。图片懒加载的作用减少或延迟请求数,缓解浏览器的压力,增强用户体验。图片懒加载的基本原理1、设置图片src属性为同一张图片,同时自定义一个data-src属性来存储图片的真实地址2、 页面初始化显示的时候或者浏览器发生滚动的时候判断图片是否在视野中3、 当图片在视野中时,通过js自动改变该区域的图片的src属性为真实地址1.document.documentEl原创 2020-10-05 22:10:37 · 199 阅读 · 0 评论 -
js事件模型
概念JavaScript事件使得网页具备互动和交互性,我们应该对其深入了解以便开发工作,在各式各样的浏览器中,JavaScript事件模型主要分为3种:原始事件模型、DOM2事件模型、IE事件模型。1.原始事件模型(DOM0级) 这是一种被所有浏览器都支持的事件模型,对于原始事件而言,没有事件流,事件一旦发生将马上进行处理,有两种方式可以实现原始事件:(1)在html代码中直接指定属性值:(2)在js代码中为 document.getElementsById(“demo”).onclick原创 2020-09-14 07:58:45 · 100 阅读 · 0 评论 -
js事件监听
概念概念:某些组件被执行了某些操作后,触发某些代码的执行。 * 事件:某些操作。如: 单击,双击,键盘按下了,鼠标移动了 * 事件源:组件。如: 按钮 文本输入框... * 监听器:代码。 * 注册监听:将事件,事件源,监听器结合在一起。 当事件源上发生了某个事件,则 触发执行某个监听器代码。 * 常见的事件: 1. 点击事件: 1. onclick:单击事件 2. ondblclick:双击事件 2. 焦点事件 1. onblur:失去焦点 2. onfocu原创 2020-09-14 07:52:54 · 371 阅读 · 0 评论 -
javascript设计模式
什么是设计模式“软件设计模式(Design pattern),又称设计模式,是一套被反复使用、多数人知晓的、经过分类编目的、代码设计经验的总结。使用设计模式是为了可重用代码、让代码更容易被他人理解、保证代码可靠性、程序的重用性。”二、什么是模式?模式是一种可以复用的解决方案。(解决某一类问题的方法论)模式是指从生产和生活经验中经过抽象和升华提炼出来的核心知识体系。设计模式三大好处模式是已经验证的解决方案模式很容易被复用模式富有表达力三、设计模式分类1.创建型设计模式创建型设计模式专原创 2020-09-13 21:56:46 · 76 阅读 · 0 评论 -
垃圾回收机制和内存泄露
一、什么是垃圾回收机制垃圾回收机制(简称GC)是python解释器自带的一种机制,专门用来回收不可用的变量值所占用的内存空间二、为什么要有垃圾回收机制程序运行过程中会申请大量的内存空间,而对于一些无用的内存空间,如果不及时清理的话,会导致内存使用完(内存溢出),导致程序崩溃,因此,内存管理是一件重要且繁杂的事情,而python解释器自带的垃圾回收机制把程序员从繁杂的内存管理中解放出来三、垃圾回收机制的方式标记清除:定义和用法:当变量进入环境时,将变量标记"进入环境",当变量离开环境时,标记为:“原创 2020-09-13 20:03:00 · 118 阅读 · 0 评论 -
事件委托原理使用场景,如何实现以及实现原理
原理:事件委托就是基于js的事件流产生的,事件委托是利用事件冒泡,将事件加在父元素或者祖先元素上,触发该事件。<body> <div id="myDiv"> <input type="button" value="按钮1" id="btn1"> <input type="button" value="按钮2" id="btn2"> <input type="button" value="按钮3" id="btn3">原创 2020-09-11 00:07:11 · 550 阅读 · 0 评论 -
数组扁平化
什么是数组扁平化?数组扁平化就是将一个多维数组转换为一个一维数组实现思想1、对数组的每一项进行遍历。2、判断该项是否是数组。3、如果该项不是数组则将其直接放进新数组。4、是数组则回到1,继续迭代。5、当数组遍历完成,返回这个新数组。5组方法可以实现数组扁平化1. reduce遍历数组每一项,若值为数组则递归遍历,否则concatfunction flatten(arr) { return arr.reduce((result, item)=> { re原创 2020-09-10 23:46:20 · 87 阅读 · 0 评论 -
ES6常用数组方法
1、Array.from()用于类似数组的对象(即有length属性的对象)和可遍历对象转为真正的数组。let json ={ '0':'11', '1':'22', '2':'33', length:3 } let arr = Array.from(json); console.log(arr); // ["11", "22", "33"] 2、Array.of()将一组值转变为数组,参数不分类型,只分数量,数量为0返回空数组。let arr1 =原创 2020-09-09 08:17:54 · 75 阅读 · 0 评论 -
ES5常用的数组方法
数组概念用[]包起来的,一组有序的、任意数据类型的数据集合数组的长度:array.lengthJS 中的数组与其他语言的数组,有很大的区别创建数组的方式1. 通过构造函数// 创建空数组var array=new Array(); // 创建数组,并填充三个元素10,20,30var array=new Array(10,20,30); // 创建数组,里面存储7个值var array=new Array(7); 2.通过字面量var arr = [];ES5数组方法ECM原创 2020-09-09 08:11:26 · 1039 阅读 · 0 评论 -
promise generator aysnc/await
1.三者都是异步编程的解决方案,不同的是,promise为较早出来的,其次generator,最后为async/await,三者象征了前端进行解决异步编程的进化路程。promise: promise比较简单,也是最常用的,主要就是将原来用 回调函数异步编程的方法 转成 relsove和reject触发事件; 对象内含有四个方法,then()异步请求成功后 catch()异步请求错误的回调方法 fin原创 2020-09-06 20:27:44 · 91 阅读 · 0 评论 -
generator(特点,项目应用)
Generator的定义:对于Generator函数(也可以叫做生成器函数)的理解,可以从四个方面:形式上:Generator函数是一个普通的函数,不过相对于普通函数多出了两个特征。一是在function关键字和函数明之间多了’*'号;二是函数内部使用了yield表达式,用于定义Generator函数中的每个状态。语法上:Generator函数封装了多个内部状态(通过yield表达式定义内部状态)。执行Generator函数时会返回一个遍历器对象(Iterator对象)。也就是说,Genera原创 2020-09-06 20:23:48 · 262 阅读 · 0 评论 -
async,await(特点,项目中应用)
async的特点:asayc的用法,它作为一个关键字放到函数前面,这样普通函数就变为了异步函数异步async函数调用,跟普通函数的使用方式一样异步async函数返回一个promise对象async函数配合await关键字使用(阻塞代码往下执行) 是异步方法,但是阻塞式的一个函数如果加上async,那么该函数及就会返回一个promiseasync function test() { return "1"}console.log(test()) // -> Promise {<原创 2020-09-06 19:57:07 · 248 阅读 · 0 评论 -
promise的特点
promise是什么?Promise 是异步编程的一种解决方案,比传统的解决方案,例如回调函数、事件等更合理和更强大。Promise简单说就是一个容器,里面保存着一个异步操作的结果。特点:对象的状态不受外界影响。一旦状态改变,就不会再变,任何时候都可以得到这个结果缺点:无法取消Promise,一旦新建它就会立即执行,无法中途取消。如果不设置回调函数,Promise内部抛出的错误,不会反应到外部。当处于Pending状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。Pro原创 2020-09-06 19:31:57 · 185 阅读 · 0 评论 -
var let 和const的区别
目录 1.是否存在变量提升? 2.是否存在暂时性死区? 3.是否允许重复声明变量? 4.是否存在块级作用域? 5. 是否能修改声明的变量?在ES5中,声明变量只有var和function两种形式。但是因为var声明的变量会有一定的缺点(内层变量可能覆盖外层变量的问题以及用来计数的循环变量泄露为全局变量,下面会有详细的介绍),ES6提出了使用let和const声明变量,下面就来看看他们之间的区别。1.是否存在变量提升?var声明的变量存在变量提升(将变原创 2020-09-06 14:59:48 · 147 阅读 · 0 评论 -
原型与原型链
原型的概念JavaScript的所有对象中都包含了一个 [proto] 内部属性,这个属性所对应的就是自身的原型JavaScript的函数对象,除了原型 [proto] 之外,还有 prototype 属性,当函数对象作为构造函数创建实例时,该 prototype 属性值将被作为实例对象的原型 [proto]原型链的概念当一个对象调用自身不存在的属性/方法时,就会去自己 [proto] 关联的前辈 prototype 对象上去找,如果没找到,就会去该 prototype 原型 [proto] 关联的原创 2020-09-02 22:49:38 · 56 阅读 · 0 评论 -
JS继承的那些事
什么是继承在编程语言中:继承是面向对象语言的重要特性,继承是针对类,子类继承父类中的属性和方法,但他们都用自己独特的属性1 原型链继承父类的实例作为子类的原型function Woman(){ }Woman.prototype= new People();Woman.prototype.name = 'haixia';let womanObj = new Woman();优点:简单易于实现,父类的新增的实例与属性子类都能访问缺点:可以在子类中增加实例属性,如果要新增加原型属性和方法需要原创 2020-09-02 20:03:49 · 65 阅读 · 0 评论 -
this,call,apply,bind之间的关系
this的概念this指的是函数执行时所在的作用域,就是谁调用this,this就指向谁this的具体指向一般有四种:1、在全局调用this的时候,this就指向window<script> console.log(this)</script>2、当一个函数被当成一个对象的方法调用时,this指向这个对象 var a = { name:"a", fun:function(){原创 2020-09-01 20:40:05 · 178 阅读 · 0 评论 -
JavaScript判断数据类型有几种方法,以及区别
有五种数据判断类型方法typeof 、instanceof、constructor、Object.prototype.toString.call()、jquery.type()一、typeof方法typeof是个操作符,可以判断基本数据类型(返回的结果只能是number,string,boolean,null,symbol,function,object)返回值分以下几种对于基本类型。除了null值返回object以外,其他均返回正确的结果对于引用值来说,除了function返回function原创 2020-08-31 20:55:08 · 466 阅读 · 0 评论 -
JavaScript数据类型有哪些
JS数据类型有哪些JS数据中一共有8种ES5中有6种:Number、String、Boolean、Undefined、Null、ObjectES6新增了Symbol:这种类型的对象永不相等,即始创建的时候传入相同的值,可以解决属性名冲突的问题,做为标记谷歌6版本bigInt:是指安全存储、操作大整数JS中基本数据类型和引用数据类型有哪些?基本数据类型(值类型):Number、String、Boolean、Undefined、Null引用数据类型:Object。里面包含function、 Dat原创 2020-08-31 17:12:45 · 553 阅读 · 2 评论 -
时间戳转化成当地时间简版
mounted:{ this.axios.get("/路径").then(res=>{ this.evaluate = res.data.result.rate.list; this.evaluate.forEach((ele) => { var date = new Date(parseInt(ele.created) * 1000); ele.created = `${date.getFullYear()}/${date.getMonth(原创 2020-08-28 19:41:38 · 168 阅读 · 0 评论 -
数组实现去重的方法
数组去重的方法方法一、 filter()和indexOf()实现去重let orArray = [1,2,3,4,1,2,3,4]let unArray = orArray.filter((item,index,array)=>{ return array.indexOf(item) === index})console.log(unArray)//结果[1,2,3,4]因为indexOf返回它为给定值找到的第一个索引,如果它不是重复值,那么该项的索引必须相同!方法二、 2原创 2020-08-12 20:02:14 · 457 阅读 · 0 评论