![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
文章平均质量分 80
顾青菜
么么哒~~~
展开
-
图片懒加载&&防抖节流
为什么要懒加载对页面加载速度影响最大的就是图片,一张普通的图片可以达到几M的大小,而代码也许就只有几十KB。当页面图片很多时,页面的加载速度缓慢,几S钟内页面没有加载完成,也许会失去很多的用户。所以,对于图片过多的页面,为了加速页面加载速度,所以很多时候我们需要将页面内未出现在可视区域内的图片先不做加载, 等到滚动到可视区域后再去加载。这样子对于页面加载性能上会有很大的提升,也提高了用户体验。懒加载的原理当图片不在可视区域内时,统一设置img的src为指定图片src='default.png原创 2021-07-09 14:17:16 · 328 阅读 · 2 评论 -
一些JavaScript特性
JavaScript性能优化浅析工程化解决了什么问题1、es6+新特性兼容2、使用less/sass/postcss提高css编程性3、使用模块化方式提高项目可维护性4、上线前压缩代码资源文件、部署过程需要手动上传,重复机械式工作5、统一代码风格、保证代码质量...原创 2021-05-31 09:47:15 · 138 阅读 · 1 评论 -
浅析Object.prototype.toString方法
在JavaScript代码里,唯一可以访问该属性的方法就是通过 Object.prototype.toString ,通常方法如下:Object.prototype.toString.call(value)在ECMAScript 5中,Object.prototype.toString()被调用时,会进行如下步骤:1 如果 this是undefined ,返回 [object Undefined] ;2 如果 this是null , 返回 [object Null] ;3 令 O 为以 t原创 2020-11-19 11:07:06 · 761 阅读 · 0 评论 -
原生实现promise
一、准备工作要实现promise,先看看promise是什么、做了哪些。Promise对象用于表示一个异步操作的最终完成 (或失败), 及其结果值,有以下两个特点: 1、对象的状态不受外界影响。 Promise 对象代表一个异步操作,有三种状态: pending: 初始状态,不是成功或失败状态。 fulfilled: 意味着操作成功完成。 rejected: 意味着操作失败。 2、一旦状态改变,就不会再变,任何时...原创 2020-10-14 16:21:31 · 715 阅读 · 2 评论 -
js原型和原型链 js中this、call、apply、bind简介
今天封装map方法时,有两个疑问,1是为什么不能直接返回total.push()首先直接返回total.push()会报错,return只能返回一个值,不能返回一个操作。而且push方法返回的是新数组的长度Array.prototype._map=function(callback){letarrSelf=thisreturnarrSelf.reduce((total,item,index,arr)=>{total.push(c...原创 2020-11-17 17:59:40 · 456 阅读 · 0 评论 -
js设计模式(六)单一职责原则(SRP)、开放-封闭原则、代码重构
一、单一职责原则(SRP)的体现:一个对象(方法)只做一件事情。二、开放-封闭原则思想:当需要改变一个程序的功能或者给这个程序增加新功能的时候,可以使用增加代码的方式,但是不允许改动程序的源代码。三、代码重构1、提炼函数:①避免出现超大函数②独立出来的函数有助于代码复用③独立出来的函数更容易被覆写④独立出来的函数如果以一个良好的命名,本身就起到了注释的作用2、合...原创 2019-11-26 17:02:15 · 350 阅读 · 1 评论 -
js设计模式(五)发布订阅模式、组合模式、模板方法模、UI组件一般构建过程、职责链模式
一、发布订阅模式定义:又称观察者模式,他定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于他的对象都将都到统治 let event = { clientList:{}, listen:function(key,fn){ if(!this.clientList[key]){...原创 2019-11-24 23:18:24 · 138 阅读 · 0 评论 -
js设计模式(四)单例模式、策略模式、new function()和function()有什么区别、js中奇特的for循环写法、代理模式
一、单例模式定义:保证一个类只有一个实例,并提供一个访问它的全局访问点有一些对象我们往往只需要一个,比如登陆浮窗let createIframe = (function(){ let iframe return function(){ if(!iframe){ } return iframe }}...原创 2019-11-22 17:28:14 · 244 阅读 · 0 评论 -
js设计模式(三)高阶函数其他应用 、函数科里化、反科里化、函数节流防抖、分时函数、数字逢三加','
1、高阶函数其他应用①高阶函数实现AOP(面向切面编程)https://blog.csdn.net/qingbaicai/article/details/103149375②函数科里化curring又称部分求值。函数首先会接受一些参数,接受这些参数后,该函数不会立即求职,而是继续返回另一个函数,刚才传入的参数在闭包里保存起来,当函数真正需要求值的时候,之前所有的参数都会一次性用于求职...原创 2019-11-22 16:56:42 · 211 阅读 · 0 评论 -
js设计模式(二)高阶函数及其应用 、判断数据类型、 装饰者模式
1、高阶函数是指至少满足下列条件之一的函数函数可以作为参数被传递(应用场景:回调函数)函数可以作为返回值输出(应用场景 1、判断数据类型function idNumber(obj){return Object.prototypr.toString.call(obj) === '[objcet Number]'})可以批量注册isType函数let...原创 2019-11-19 20:05:44 · 161 阅读 · 0 评论 -
js设计模式(一)封装、多态、原型模式、闭包
1、编程语言按数据类型可分为静态类型、动态类型语言静态类型优点在编译时就能发现类型不匹配的错误,缺点迫使程序员依照强契约编写约定(代码良多,分散程序员在业务逻辑上的精力)动态优点是代码数量更少,可以将更多精力放在逻辑上,缺点是无法保证变量类型2、鸭子类型的思想例如:一个对象有pop和push方法并且这些方法被正确的实现,就可以被当作栈来使用;一个对象有length属性,也可以依...原创 2019-11-19 18:19:13 · 179 阅读 · 0 评论 -
前端面试总结(一年主vue)
先说不足之处,框架原理理解不够,蜻蜓点水一般,跨域几种方式的优缺点也没说出来,对于组件库的概念理解不深刻Vue了解下webpack,根据生产、开发环境配置参数了解下https://blog.csdn.net/lian772882/article/details/81364644前端面试https://github.com/gujianxiang95/Web/tree/master/...原创 2019-08-24 15:23:30 · 221 阅读 · 0 评论