思源笔记 0 篇文章

js 深拷贝

js 深拷贝在 JavaScript 中,深拷贝(deepcopy)是指创建一个对象的副本,使得副本中的所有属性和嵌套对象都是独立于原始对象的新实例。这意味着修改副本不会影响原始对象,反之亦然。由于 JavaScript 中的对象是引用类型,默认情况下赋值或浅拷贝只会复制引用而不是实际的数据结构,因此我们需要特别处理以实现深拷贝。以下是几种常见的实现深拷贝的方法:1.使用 JSON.parse 和 JSON.str

requestIdleCallback 实现闲时定时器

requestIdleCallback 实现闲时定时器如果你需要实现一个类似 idleTimeout(()=>{},100)的闲时定时器,即在浏览器空闲时执行任务,并且任务的执行时间间隔为 100ms,可以使用 requestIdleCallback 结合时间控制来实现。实现思路使用 requestIdleCallback:在浏览器空闲时执行任务。控制时间间隔:使用一个变量记录上一次执行的时间,确保任务的执行间

动态加载 js

动态加载 jsfunctionloadScript(src,callback){constscript=document.createElement('script');script.src=src;script.type='text/javascript';//加载成功后的回调 script.onload=()=>{console.log(` 脚本加载成功:${src}`);if(callback)ca

动态加载 vConsole

动态加载 vConsole//动态加载 vConsole(functionloadVConsole(){constscript=document.createElement('script');script.src='https://unpkg.com/vconsole@latest/dist/vconsole.min.js';//script.src='file://../vconsole.js';s

动态添加 js 标签

动态添加 js 标签在 JavaScript 中,你可以动态地创建一个 <script>​标签并将其添加到文档中,以便在页面加载后动态加载外部 JavaScript 文件或执行内联 JavaScript 代码。以下是如何实现这一操作的示例:1.动态加载外部 JavaScript 文件//创建一个新的 script 元素 varscript=document.createElement('script');//设置 script 的

复制到剪切板

复制到剪切板//复制文本到剪切板 functioncopyTextToClipboard(text){//创建一个隐藏的 textarea 元素 consttextarea=document.createElement("textarea");textarea.value=text;document.body.appendChild(textarea);//隐藏此输入框 textarea.style.posi

如何实现一个网页版的剪映(上)本文研究了网页版剪映是如何实现的,并写了简易的 demo,WebCodes 进行编解码,web - 掘金

如何实现一个网页版的剪映(上)本文研究了网页版剪映是如何实现的,并写了简易的 demo,WebCodes 进行编解码,web - 掘金
如何实现一个网页版的剪映(上)本文研究了网页版剪映是如何实现的,并写了简易的 demo,WebCodes 进行编解码,web-掘金如何实现一个网页版的剪映(上)本文研究了网页版剪映是如何实现的,并写了简易的 demo,WebCodes 进行编解码,web-掘金 https://juejin.cn/post/7444840280850808851 本文研究了网页版剪映是如何实现的,并写了简易的 demo,WebCo

常用立即函数写法

常用立即函数写法立即执行函数表达式(IIFE,ImmediatelyInvokedFunctionExpression)是一种在定义时立即执行的 JavaScript 函数。除了你提到的写法,还有以下几种常见的写法:1.经典写法(最常用)(function(){console.log("IIFE 执行了");})();2.将函数包裹在括号中(function(){console.log("IIFE 执行了"

懒加载代码

懒加载代码我们可以创建一个函数 createLazyLoader​,该函数接受一个标识符(例如 VConsoleLoader​),以及一个回调函数(即实际要执行的代码)。这个函数将返回一个懒加载的占位符函数,可以用于任何需要懒加载的场景。以下是你的代码的完整示例:functioncreateLazyLoader(identifier,callback){//使用闭包来保存状态 letisLoaded=fa

手机端调试方案

手机端调试方案
手机端调试方案 seehttps://ld246.com/article/1734937500032 手机开启伺服模式,在电脑上用 devtools 移动端模拟器调试(推荐)https://github.com/Tencent/vConsole 或国内访问 https://gitee.com/Tencent/vConsole 如果是 webview 本身的问题,可以用自带浏览器调试,可参考 https://juejin

检测实际使用的字体

检测实际使用的字体在 CSS 中,font-family​属性通常包含多个字体作为后备选项。浏览器会从左到右依次尝试使用这些字体,直到找到一个可用的字体为止。因此,实际使用的字体通常是列表中第一个在用户系统上可用的字体。要确定浏览器实际使用的是哪个字体,你可以使用 JavaScript 来检测。以下是一个简单的方法来确定当前元素使用的实际字体:functiongetActualFontFamily(elem

版本号比较

版本号比较 functioncompareVersions(version1,version2){//将版本号按.分割为数组 constv1=version1.split('.').map(Number);constv2=version2.split('.').map(Number);//逐位比较 for(leti=0;i<Math.max(v1.length,v2.length);i++){//如果当前

等待元素渲染完毕执行和 sleep

等待元素渲染完毕执行和 sleep//延迟执行 functionsleep(ms){returnnewPromise(resolve=>setTimeout(resolve,ms));}//等待元素渲染完成后执行 functionwhenElementExist(selector){returnnewPromise(resolve=>{constcheckForElement=()=>{letelemen

纯 JavaScript 实现 AES 加密

纯 JavaScript 实现 AES 加密如果你既不想使用 crypto.subtle​也不愿意使用第三方库,那么你需要自己编写加密和解密的逻辑。这通常涉及使用纯 JavaScript 实现加密算法。虽然这种方法不如使用标准库或第三方库安全和高效,但对于简单的场景可能足够使用。使用纯 JavaScript 实现 AES 加密 AES 加密算法相对复杂,但我们可以尝试使用一些纯 JavaScript 的方法来实现一个简单的加密和

统计工作时长

统计工作时长方案 1 是的,你可以利用 requestIdleCallback 实现一个工作时长统计功能,记录用户在页面上的活动时间。requestIdleCallback 可以在浏览器空闲时执行任务,因此非常适合用于记录用户在页面上的活动时间。实现思路记录开始时间:当用户进入页面时,记录当前时间作为开始时间。使用 requestIdleCallback:在浏览器空闲时更新工作时长。计算工作时长:每次更新时,计

选择器 scope

选择器:scope 在 CSS 选择器中,:scope​是一个伪类(pseudo-class),用于表示当前元素的作用域。它的作用是限制选择器的范围,使其相对于某个特定的上下文(通常是某个 DOM 元素)进行匹配。什么是​:scope​​?​:scope​表示当前上下文中的“根元素”。在 querySelector​或 querySelectorAll​中使用时,:scope​通常指代调用方法的那个 DOM 元素本身

防抖和节流

防抖和节流在 JavaScript 中,防抖(debounce)和节流(throttle)是两种常见的函数执行优化策略,通常用于处理高频触发的事件,如窗口的 resize 或 scroll 事件等,以提高性能和用户体验。防抖(Debounce)防抖是指将一段时间内多次触发的事件合并为一次执行。当最后一次触发事件后的一段时间内没有再次触发,则执行该事件处理函数。如果在这段时间内又有新的触发,则重新计算延迟时间。即