![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
subsistent
历经磨难
展开
-
JavaScript 的 canvas.toDataURL 详解
元素以及保存的图像质量要求,生成的数据 URL 可能会较长。在某些情况下,这可能会导致性能问题或网络传输的限制。在这种情况下,可以考虑使用其他方法,如将图像数据上传到服务器进行处理。元素的内容转换为数据 URL 的方法。它返回一个包含图像表示的字符串,可以作为图片的源值使用。返回一个字符串,其中包含了一个基于指定类型的图像表达的数据 URL。需要注意的是,由于数据 URL 包含了完整的图像数据,因此对于较大的。的字符串,表示一个 PNG 格式的图片数据 URL。是 JavaScript 中用于将。原创 2023-09-23 11:59:15 · 4801 阅读 · 0 评论 -
JavaScript 设计模式详解
JavaScript 设计模式是一组在编写JavaScript代码时经常使用的可重用解决方案。它们是根据问题的不同场景和需求而产生的。常见的JavaScript设计模式有:单例模式(Singleton Pattern): 保证一个类只有一个实例,并提供一个全局访问点。工厂模式(Factory Pattern): 通过工厂方法创建对象,隐藏了具体实现细节。观察者模式(Observer Pattern): 定义对象之间的一对多依赖关系,当一个对象状态发生变化时,其依赖对象会自动收到通知。原创 2023-02-15 22:15:47 · 237 阅读 · 0 评论 -
windows中使用nvm将已安装的nodejs高版本降级为低版本
(3) 安装成功后,记得先在命令行输入nvm use node版本号(例如:nvm use 12.17.0),即可选择你本地所使用的Node.js版本(选择Node.js版本后自动配置环境变量,不用自己去配置),然后分别输入命令行node -v和npm -v,检验node.js以及对应npm是否安装成功,并且只有先这样才能看到node版本,不然你输入命令行node -v和npm -v会出现(提示’node’ 或’npm‘不是内部或外部命令,也不是可运行的程序或批处理文件)。原创 2023-04-05 23:00:18 · 1016 阅读 · 0 评论 -
Javascript 选取元素的兄弟节点、父节点、子节点
来获取前一个兄弟节点。需要注意的是,这些属性返回的节点可能是文本节点或注释节点,而不仅仅是元素节点。这些方法可以在 JavaScript 中使用,通过操作 DOM 来选择元素的兄弟节点。属性来访问元素的下一个兄弟节点和前一个兄弟节点。例如,如果有一个元素节点。这两个属性只返回元素节点,而不包括文本节点或注释节点。如果只想选择元素节点作为兄弟节点,可以使用。来获取下一个元素节点作为兄弟节点,使用。如果元素没有父节点(比如根节点),那么。来获取前一个元素节点作为兄弟节点。来获取下一个兄弟节点,使用。原创 2023-09-09 22:41:11 · 2103 阅读 · 0 评论 -
前端面试题之手写代码篇
前端面试题之手写代码篇原创 2023-09-07 08:12:52 · 151 阅读 · 0 评论 -
ES6 中的 Generator 和 yiled
通过使用 yield 关键字,我们可以在函数内部暂停和恢复执行,而不需要使用回调函数或者 Promise 对象来处理异步操作。它可以通过使用 yield 关键字来暂停函数的执行,并返回一个可迭代的对象,称为迭代器。通过调用迭代器的 next() 方法,我们可以恢复函数的执行并返回下一个值。Generator 函数可以在每次调用 next() 方法时产生一个新的值,并且可以在需要的时候无限次调用。执行 Generator 函数会返回一个遍历器对象,可以依次遍历 Generator 函数内部的每一个状态。原创 2023-03-27 10:21:43 · 104 阅读 · 0 评论 -
Express,基于 Node.js 平台,快速、开放、极简的 Web 开发框架
利用use方法和router的配合,我们可以将某一部分的请求单独封装到一个文件中,例如,所有有关用户的请求,都会是/user开头的请求路径,将所有有关用户请求的路由处理,单独封装在一个文件中。当用户发起了一个服务器并没有处理的请求,此时会在页面中输出404,会给用户造成不好的体验感,为了能避免这个问题发生,我们可以在当访问到没有处理的请求的时候,给用户响应自定义内容。如果后面的请求路径,希望在被use方法处理后,可以继续被后面的处理方法处理,可以给use方法的回调函数中,调用next方法。原创 2023-01-26 21:31:04 · 596 阅读 · 0 评论 -
forEach 中的 async await
这样可以生效的原因是 async 函数肯定会返回一个 Promise 对象,调用 map 以后返回值就是一个存放了 Promise 的数组了,这样我们把数组传入 Promise.all 中就可以解决问题了。但是这种方式其实并不能达成我们要的效果,如果你希望内部的 fetch 是顺序完成的,可以选择第二种方式。原因很明显,在上面的模拟中,while 循环只是简单执行了 callback,所以尽管 callback 内使用了 await ,也只是影响到 callback 内部。of 是通过迭代器的方式去遍历。原创 2023-02-16 12:46:48 · 695 阅读 · 0 评论 -
setTimeout实现setInterval
这个mySetInterval函数有一个叫做interval的内部函数,它通过setTimeout来自动被调用,在interval中有一个闭包,调用了回调函数并通过setTimeout再次调用了interval。setInterval() :按照指定的周期(以毫秒计)来调用函数或计算表达式。思路是使用递归函数,不断地去执行setTimeout从而达到setInterval的效果,看代码。setTimeout() :在指定的毫秒数后调用函数或计算表达式,只执行一次。原创 2023-02-16 12:38:35 · 627 阅读 · 0 评论 -
JavaScript 之 eval 详解
其实即便带有变量,JavaScript也是可以直接计算的,但是如果你现在只想声明一个带有变量的表达式,但是想稍后进行运算(你有可能在声明这个带有变量的运算式之后还有可能对里面的变量进行修改),就可以使用eval。比如,假如你有一个变量 x ,你可以通过一个字符串表达式来对涉及x的表达式延迟求值,将 “3 * x + 2”,存储为变量,然后在你的脚本后面的一个地方调用eval()。eval()的运行效率也普遍的比其他的替代方案慢,因为他会调用js解析器,即便现代的JS引擎中已经对此做了优化。原创 2023-02-16 12:43:03 · 1823 阅读 · 0 评论 -
JavaScript之proxy详解
proxy在目标对象的外层搭建了一层拦截,外界对目标对象的某些操作,必须通过这层拦截proxy对象是obj对象的原型,obj对象本身并没有time属性,所以根据原型链,会在proxy对象上读取该属性,导致被拦截。原创 2023-02-16 12:42:48 · 726 阅读 · 0 评论 -
JavaScript最新面试题合集(2023年)
闭包:就是能够读取外层函数内部变量的函数。闭包需要满足三个条件:访问所在作用域;函数嵌套;在所在作用域外被调用。优点: 可以重复使用变量,并且不会造成变量污染。缺点: 会引起内存泄漏使用闭包的注意点:由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象。原创 2023-01-16 20:51:25 · 9591 阅读 · 1 评论 -
JavaScript事件代理(委托)
在很多时候,我们需要通过 AJAX 或者用户操作动态的增加或者去除列表项元素,那么在每一次改变的时候都需要重新给新增的元素绑定事件,给即将删去的元素解绑事件;如果用了事件委托就没有这种麻烦了,因为事件是绑定在父层的,和目标元素的增减是没有关系的,执行到目标元素是在真正响应执行事件函数的过程中去匹配的;不是直接给标签添加事件 是给标签的父级添加事件 通过 事件对象 判断触发事件的标签对象是谁 执行不同的函数程序的语法形式。所以使用事件在动态绑定事件的情况下是可以减少很多重复工作的。原创 2023-02-16 12:43:49 · 52 阅读 · 0 评论 -
JavaScript中的instanceof
JavaScript中变量的类型判断常常使用typeof运算符,但使用typeof时存在一个缺陷,就是判断引用类型存储值时,无论引用的是什么类型的对象,它都返回 object。instanceof 运算符与 typeof 运算符相似,用于识别正在处理的对象的类型。尽管不像 typeof 方法那样灵活,但是在 typeof 方法返回 “object” 的情况下,instanceof 方法就很有用。该代码中是判断了一层继承关系中的父类,在多层继承关系中,instanceof 运算符同样适用。原创 2023-02-16 12:46:14 · 845 阅读 · 0 评论 -
JavaScript中事件绑定的方法
在JavaScript的学习中,我们经常会遇到JavaScript的事件机制,例如,事件绑定、事件监听、事件委托(事件代理)等。这些名词是什么意思呢,有什么作用呢?原创 2023-02-16 12:48:12 · 907 阅读 · 0 评论 -
JavaScript伪数组
对象是没有索引的,是数组的基本特征。obj[2]输出’a’,是因为对象就是普通的键值对存取数据,而arr[2]输出’a’ 则不同,数组是通过索引来存取数据,arr[2]之所以输出’a’,是因为数组arr索引2的位置已经存储了数据。而对于数组来说,length是数组的一个内置属性,数组会根据索引长度来更改length的值。在给数组添加元素时,并没有按照连续的索引添加,所以导致数组的索引不连续,那么就导致索引长度。伪数组是一个对象(Object),而真实的数组是一个数组(Array)可以通过for in遍历。原创 2023-02-16 12:48:48 · 337 阅读 · 0 评论 -
JavaScript获取第二大的数字
定义两个变量max min循环遍历分别存储当前最大和第二大的数然后输出第二大的数min;当然在JS中有sort()方法可以进行数组排序。将数组从大到小排序然后找第二个。原创 2023-02-16 12:54:00 · 297 阅读 · 0 评论 -
JavaScript的Map()构造函数详解
如果提供了iterable参数,则Map()构造函数会使用这些键值对来初始化Map对象。Map()构造函数是JavaScript中的一种数据结构,用于存储键值对。总之,Map()构造函数是JavaScript中一种非常有用的数据结构,可以方便地存储和操作键值对。Map()构造函数创建一个空的Map对象,如果没有提供iterable参数。Map对象中的键可以是任何类型,包括基本类型和对象类型。5. clear():清空Map对象中的所有键值对。Map对象中的键值对是有序的,按照插入顺序排列。原创 2023-03-22 13:19:04 · 842 阅读 · 0 评论 -
性能优化:JavaScript 的循环机制
总之,优化循环性能需要根据具体情况采取不同的优化策略,综合考虑减少每次迭代的运算量和减少循环迭代次数以提高循环性能。1. 提前计算出循环中固定不变的值,如常数或循环变量初始值等,避免重复计算;6. 调整循环的迭代范围,如避免特定情况的无意义迭代,检查循环条件的正确性;8. 将循环外部的语句移入循环内部,以避免每次迭代之前进行一些不必要的操作;改善循环性能的最佳方式是减少每次迭代的运算量和减少循环迭代次数;3. 合理使用循环变量,如使用自增或自减运算符代替加或减运算;原创 2023-03-25 12:19:15 · 200 阅读 · 0 评论 -
JavaScript类型转换
1,2,3] == '1,2,3' // true [1,2,3]转化为'1,2,3',然后和'1,2,3', so结果为true;/*-------------------隐式转换(逻辑表达式)---------------------*//*-------------------隐式转换(+-)---------------------*//*-------------------显式转换---------------------*/对象和字符串进行比较时,对象转换为字符串,然后两者进行比较。原创 2023-03-27 00:21:49 · 33 阅读 · 0 评论 -
JavaScript闭包详解
2.不能实现value加1(每个函数在被调用时都会自动取得两个特殊变量,this和arguments,内部函数在搜索这两个对象时,只会搜索到其活动对象为止,所以不能实现访问外部函数的this对象);闭包就是在函数中定义且成为该函数内部返回的函数的自由变量,该变量不会随着外部函数调用结束而销毁。当函数可以记住并访问所在的词法作用域,即使函数是在当前词法作用域之外执行,这时就产生了闭包。全局变量生存周期是永久,局部变量生存周期随着函数的调用结束而销毁。(注:不光是变量,函数内声明的函数也可以形成闭包)原创 2023-03-27 00:35:46 · 61 阅读 · 0 评论 -
JavaScript异步解决方案
当一个任务执行完成后,会发布一个事件,当这个事件有一个或多个‘订阅者’的时候,会接收到这个事件的发布,执行相应的任务,这种模式叫发布订阅模式。promise的状态只能从pending变成fulfilled,和pending变成rejected,状态一旦改变,就不会再改变,且只有异步操作的结果才能改变promise的状态。async是es2017引入的异步操作解决方案,可以理解为Generator的语法糖,async等同于Generator和co模块的封装,async 函数返回一个 Promise。原创 2023-03-27 00:41:12 · 42 阅读 · 0 评论 -
JavaScript如何自定义事件
事件是与DOM交互的最常见的方式。通过实现自定义事件,可以让事件用于非DOM代码中。思想:创建一个管理事件的对象,让其他对象监听那些事件。原创 2023-03-27 00:49:49 · 97 阅读 · 0 评论 -
JavaScript 实现观察者模式
【代码】JavaScript 实现观察者模式。原创 2023-03-27 00:50:37 · 30 阅读 · 0 评论 -
JavaScript同步和异步的区别
这样用户在线等待的时间太长,给用户一种卡死了的感觉(就是系统迁移中,点击了迁移,界面就不动了,但是程序还在执行,卡死了的感觉)。但是用户没有卡死的感觉,会告诉你,你的请求系统已经响应了。同步就相当于是 当客户端发送请求给服务端,在等待服务端响应的请求时,客户端不做其他的事情。存在就有其道理 异步虽然好 但是有些问题是要用同步用来解决,比如有些东西我们需要的是拿到返回的数据在进行操作的。异步就是,当客户端发送给服务端请求时,在等待服务端响应的时候,客户端可以做其他的事情,这样节约了时间,提高了效率。原创 2023-03-27 00:51:37 · 71 阅读 · 0 评论 -
JavaScript判断一个对象是否为数组,函数
console.log(arr instanceof Array) //返回true。方法三: Array.isArray()原创 2023-03-27 00:54:06 · 67 阅读 · 0 评论 -
JavaScript模板引擎原理
函数只能接收一个name变量作为参数,功能太单一了,一般会通过对象来传参,with来减少变量访问。字符串是通过new Function执行的。将模板转换为字符串并通过函数执行返回。模板引擎是通过字符串拼接得到的。原创 2023-03-27 10:07:03 · 37 阅读 · 0 评论 -
为什么 JavaScript 是单线程
举一个栗子,如果js同时有两个线程,同时对同一个dom进行操作,这时浏览器应该听哪个线程的,如何判断优先级?js作为主要运行在浏览器的脚本语言,js主要用途之一是操作DOM。为了避免这种问题,js必须是一门单线程语言。原创 2023-03-27 10:22:59 · 56 阅读 · 0 评论 -
html,css,javascript实现滚动字幕
【代码】html,css,javascript实现滚动字幕。原创 2023-07-19 16:54:04 · 475 阅读 · 0 评论 -
JavaScript笔记
JavaScript是一种运行在浏览器中的脚本语言。它可以在网页中实现动态效果、交互功能和数据处理等。除了浏览器,JavaScript也可以在服务器端运行,例如Node.js。原创 2023-01-04 21:17:04 · 555 阅读 · 0 评论 -
原生JS实现俄罗斯方块
【代码】原生JS实现俄罗斯方块。原创 2022-10-15 16:15:48 · 327 阅读 · 0 评论 -
原生JS实现带动画效果的购物车案例
【代码】原生JS实现带动画效果的购物车案例。原创 2022-11-17 22:37:53 · 677 阅读 · 0 评论 -
原生JS实现两种爱心
【代码】原生JS实现两种爱心。原创 2022-11-19 23:43:42 · 402 阅读 · 0 评论 -
原生js实现贪吃蛇案例
【代码】原生js实现贪吃蛇案例。原创 2022-12-08 21:55:35 · 112 阅读 · 0 评论 -
原生js实现歌词滚动
【代码】原生js实现歌词滚动。原创 2022-12-08 22:43:04 · 197 阅读 · 0 评论 -
原生js实现立体图片翻转特效
【代码】原生js实现立体图片翻转特效。原创 2022-12-09 14:32:05 · 737 阅读 · 0 评论 -
JS引起内存泄漏的情况
也就是说,定时器的生命周期并不挂靠在页面上,所以当在当前页面的 js 里通过定时器注册了某个回调函数,而该回调函数内又持有当前页面某个变量或某些 DOM 元素时,就会导致即使页面销毁了,由于定时器持有该页面部分引用而造成页面无法正常被回收,从而导致内存泄漏了。某些场景中,在某个页面发起网络请求,并注册一个回调,且回调函数内持有该页面某些内容,那么,当该页面销毁时,应该注销网络的回调,否则,因为网络持有页面部分内容,也会导致页面部分内容无法被回收。而且这种场景很容易出现,因为使用定时器的人很容易遗忘清除。原创 2023-01-13 21:57:54 · 647 阅读 · 0 评论 -
JS的重绘(repaints)和重排(reflows)
例如,容器节点的渲染树改变时,会触发子节点的重新计算,也会触发其后续兄弟节点的重排,祖先节点需要重新计算子节点的尺寸也会产生重排。可见,重排一定会引起浏览器的重绘,一个元素的重排通常会带来一系列的反应,甚至触发整个文档的重排和重绘,性能代价是高昂的。查询某些属性或调用某些计算方法:offsetWidth、offsetHeight等,除此之外,当我们调用 getComputedStyle方法,或者IE里的 currentStyle 时,也会触发重排,原理是一样的,都为求一个“即时性”和“准确性”。原创 2023-01-13 22:41:55 · 1034 阅读 · 0 评论 -
js已知正弦余弦正切值求角度弧度
Math.asin(value)Math.acos(value)Math.atan(value)Math.asin(value) / Math.PI * 180Math.acos(value) / Math.PI * 180Math.atan(value) / Math.PI * 180原创 2023-02-10 18:05:28 · 483 阅读 · 0 评论 -
JS 如何实现多线程
像setTimeout、ajax的异步请求,或者是dom元素的一些事件,都是在JS主线程执行的,这些操作并没有在浏览器中开辟新的线程去执行,而是当这些异步操作被操作时或者是被触发时才进入事件队列,然后在JS主线程中开始运行。如果说一个脚本语言在执行时,其中某一块的功能在执行时耗费了大量的时间,那么就会造成阻塞。这样的项目,用户体验是非常差的,所以这种现象在项目的开发过程中是不允许存在的。首先说一下浏览器的线程,浏览器中主要的线程包括,UI渲染线程,JS主线程,GUI事件触发线程,http请求线程。原创 2023-02-16 12:12:31 · 761 阅读 · 0 评论