why404

前端开发中，我们经常需要同时请求接口，当某个接口发生故障时，传统的处理方式可能会导致整个流程中断。下面介绍三种实用的并发请求处理方案，并附赠两个高级技巧。

Typed.js 是一个轻量级的 JavaScript 库，可以在网页上创建打字动画。

在前端开发中，我们经常需要判断一个元素是否包含另一个元素，尤其是在处理 DOM 操作时。这时，`Node.contains()` 方法是一个非常实用的工具。

在 JavaScript 开发中，模块化是一个重要的概念，它可以帮助我们将代码组织得更加清晰、可维护。模块化允许我们将复杂的应用拆分成多个小的、独立的部分，每个部分可以被单独开发、测试和调试。ESM（ECMAScript Modules） 和 CommonJS 是当前 JavaScript 中最流行的两种模块化方式，理解它们的差异，对于前端和后端开发者来说都至关重要。

在编程中，我们常常需要处理数字的显示和转换，尤其是在需要将阿拉伯数字转换为中文数字的场景下，Nzh 是一个非常实用的工具。它不仅支持简单的数字转换，还包括科学记数法、金额格式化和自定义单位等多种功能。本文将详细介绍 Nzh 的安装、使用方法和 API。

在 JavaScript 中处理异步操作时，通常需要灵活的控制机制来中止任务。AbortController API 提供了一个强大且通用的方式来终止异步操作，不仅可以中断 HTTP 请求，还可以应用于多种异步任务，如事件监听、流操作等。在本文中，我们将详细探讨 AbortController 的使用场景、AbortSignal 的静态方法、事件处理中的中止机制，以及在实际开发中的一些最佳实践。

使用class关键字可以提供更简洁和现代的语法，而传统的构造函数和原型链方式则提供了更多的控制和灵活性。

在现代的 JavaScript 编程中，异步操作非常普遍。我们常常需要进行诸如网络请求、读取文件或处理定时器等任务，而这些任务的完成时间是不确定的。为了解决这个问题，JavaScript 引入了 `Promise`，一种处理异步操作的机制。本文将详细介绍 `Promise`，并展示其主要 API。

在JavaScript中，迭代和递归是两种常见的控制流程，用于处理重复任务和数据结构的遍历。理解并掌握这两种技术，不仅可以帮助我们编写高效的代码，还能让我们更好地解决复杂的问题。

Vue.observable，让一个对象变成响应式数据。Vue 内部会用它来处理 data 函数返回的对象

- `Promise.all()` 会在所有 Promise 实例成功完成时才成功，一旦有一个失败就会立即失败。- `Promise.race()` 会在任何一个 Promise 实例率先成功或失败时返回结果。- `Promise.allSettled()` 则会等待所有 Promise 实例结束后返回结果，无论是成功还是失败。

Threejs粒子水波纹效果

JavaScript 中有很多简写技巧，可以缩短代码长度、减少冗余，并且提高代码的可读性和可维护性。本文将介绍 20 个提升效率的 JS 简写技巧，助你告别屎山，轻松编写优雅的代码！

前端项目nginx部署主要的配置基本上就是上面提到的这些。首先是location路由的四种写法；接着就是分清楚root和alias的区别；当项目较多时需要使用二级路由时，需要注意重定向的配置；如果你的项目文件较大，可以开启gzip压缩提升传输效率。

js中?.、??、??=的用法及使用场景

默认情况下，Sanitizer 实例仅用于防止 XSS 攻击。但是，在某些情况下，可能需要自定义配置的清理器。接下来，下面来看看如何自定义 Sanitizer API。如果想创建自定义的清理器配置，只需要创建一个配置对象，并在初始化 Sanitizer API 时将其传递给构造函数即可。// 清理结果由配置定制以下配置参数定义了清理器应如何处理给定元素的净化结果。：指定清理器应保留在输入中的元素。：指定清理器应从输入中删除但保留其子元素的元素。：指定清理器应从输入中删除，包括其子元素在内的元素。

请注意，此API目前处于。CSS伪元素是一项强大的功能，它允许您在不需要额外的JavaScript代码的情况下对所选元素的特定部分进行样式设置。在本文中，我们将探讨9个鲜为人知的CSS伪元素，它们可以增强您的样式设置能力。伪元素以列表项的标记为目标，例如无序列表中的项目符号或有序列表中的数字。在上面的代码片段中，每个段落的第一个字母将以较大的字体大小显示，并且呈现红色。在上面的代码中，输入字段中的占位文本将以红色显示，并带有斜体字体样式。在上面的代码中，视频元素中的提示文本将具有白色文本颜色和黑色背景。

Lodash 是一个流行的 JavaScript 实用工具库，提供了许多常用的函数和工具，能够方便地处理集合、字符串、数值、函数等多种数据类型，减少编写重复代码的时间和精力。Lodash 的 API 设计与 ES6 的新特性相似，同时兼容了更早的浏览器版本。Lodash 支持模块化加载，可以通过 npm 或在浏览器中直接引入来使用。Lodash 有多达 300 多个函数，每个函数都有详细的文档和示例，能够快速地满足各种编程需求。

展开运算符和方法都可以用于合并对象，但它们有不同的优缺点。展开运算符的优点是简洁性和创建新对象，适用于简单的对象合并。然而，它只进行浅拷贝，不支持深拷贝。方法的优点是灵活性和支持合并多个对象，适用于需要合并多个对象的情况。然而，它会修改目标对象，不支持嵌套对象的合并。根据具体的需求和个人偏好，选择合适的方法来合并对象。

URL对于我们开发人员来讲，应该是非常熟悉了。在对URL进行参数拼接时，我们一般都会直接进行字符串拼接或使用模版字符串，因为这样非常方便，但是我们这样其实会在不知不觉中以不安全的方式编写 URL。?${??${??${??这样确实写起来非常方便，但你可能会在不知不觉中会你的程序带来一些问题。（如上代码就是一段有问题的代码）

筛选出连个数组相同项、筛选出书特定的key、多重条件判断优化

灭霸颗粒消失效果。

关于浏览器缓存的处理。

相信大家或多或少都接触过拥有庞大if else的项目代码吧，多重嵌套的if else在维护的时候真的让人很恼火😡，有时候一个 bug 排查下来，严重感觉身体被掏空😿。本文并未有消灭或歧视if else的意思，if else的好用都知道，这里只是在某些特定场景为大家额外提供一种思路，增加我们代码的可读性🐳。

react预览pdf

使用CSS3的三行代码实现粘性置顶

一、场景当用户将同一个网站地址，打开多个Tab页面如:a、b、c、d，这四个页面中的token决定着登录用户的信息，当用户在d页面退出当前账号后到a、b、c页面时发现信息并没有同步，账号并没有同步，这时候请求数据还会异常，这种情况下就需要跨页面通信，保证信息的跨页面同步。二、onstorage该WindowEventHandlers.onstorage属性包含一个在storage事件触发时运行的事件处理程序。当更改存储区域时会发生这种情况（例如，存储新项目）。不能作用于sessionSto.

防抖和节流严格算起来应该属于性能优化的知识，但实际上遇到的频率相当高，处理不当或者放任不管就容易引起浏览器卡死。所以还是很有必要掌握的。从滚动条监听的例子说起先说一个常见的功能，很多网站会提供这么一个按钮：用于返回顶部。这个按钮只会在滚动到距离顶部一定位置之后才出现，那么我们现在抽象出这个功能需求：监听浏览器滚动事件，返回当前滚条与顶部的距离这个需求很简单，直接写:function showTop () { var scrollTop = document.body..

一、概述图片懒加载其实就是延迟加载，我们知道浏览器的可视范围是有限的，现在网页的内容越来越丰富了，一般网页的内容都是需要进行滚动才能完成浏览，如果网页有很多图片，然而图片是非常吃流量的，如果用户还没有看到网页下面的内容，在某种程度上我们就没必要这么快加载这些看不到的图片。二、监听scroll事件方案既然要滚动到网页下面才能预览到看不见的图片，因此一个要介绍的方法就是事件监听，监听scroll这个事件，鼠标滚动就触发，那么这里我们需要知道两个高度:第一个高度是窗口显示区的高度，可以用wind.

之前安装过优快云的浏览器插件，右下角有一个DARK模式切换功能出于好奇，今天就想了解一下它的原理，结果发现了一个神奇的css属性：mix-blend-mode切换前切换后解析发现在body标签下多了几个标签：最后锁定在第二个div标签原理其实也很简单，在打开模式后，会在标签上多加几个class其中的.darkmode-layer这个class是这样的： position: fixed; pointer-events: none; background: #fff;..

URLSearchParams使用这个方法获取URL参数const urlSearchParams = new URLSearchParams(window.location.search)const params = Object.fromEntries(urlstr.entries())console.log(params)

一、问题有一个小需求：让点击一个按钮弹出桌面的企业微信应用程序，如果没有，就跳转到下载页面。二、解决需要下载一个插件：protocolcheck.js 或者直接复制文章后面的代码。将该文件引入index.html中<script src="./protocolCheck.js"></script>点击事件定义为：const ___ = () => { window.protocolCheck("wxwork://", function (.

JS实现截图保存pdf

一个简单的可移动窗口React组件

好玩的consoleconsole有很多有趣的方法，有兴趣的可以在网上找找看看，我这里罗列的是一些比较常用的方法。一、console.log%c 占位符是最常用的。使用 %c 占位符时，对应的后面的参数必须是 CSS 语句，用来对输出内容进行 CSS 渲染。常见的输出方式有两种：文字样式、图片输出。console.log("%c好玩的console！","color: red; font-size: 20px"); 二、console.tablevar obj= { .

一、需求上传大型文件时候，接口请求等待时间很长，给用户进度展示。二、通过Axios库处理export async function uploadApi(values) { try { let config = { headers: { "Content-Type": "multipart/form-data", }, transformRequest: [ function (data) { r.

获取上传视频时长window.URL = window.URL || window.webkitURL;// file 为上传的视频二进制文件let file = ele.target.file;let video = document.createElement("video");video.preload = "metadata";video.src = URL.createObjectURL(file);video.onloadedmetadata = function () {.

获取input上传视频流时长const changeFile = (ele) => { let file = ele.target.files[0]; let video = document.createElement("video"); window.URL = window.URL || window.webkitURL; video.src = URL.createObjectURL(file); video.preload = "metadata"; vid.

js下载文件遇到的麻烦事有没有在做下载文件功能的时候，出现跨域问题，比如无法批量下载文件，图片文件无法下载等，网上找了很久没有找到很好的解决方法，这里记录一下呗~依赖库file-saveraxios方法import FileSaver from 'file-saver'import Axios from 'axios'// 下载文件const hendleDownloadFile = (item: Record<string, string>) => {.

渐变背景动画代码<!DOCTYPE html><html lang="zh" dir="ltr"><head> <meta charset="utf-8"> <title>渐变背景动画</title> <link rel="stylesheet" href="style.css"></head><body> <div class="text"> .