当前位置: 首页 > news >正文

JavaScript系列(31)--装饰器详解

JavaScript装饰器详解 🎨

今天,让我们深入探讨JavaScript的装饰器(Decorators)。装饰器是一种用于修改类和类成员的强大语言特性,它让我们能够以声明式的方式增强类的功能。

装饰器基础概念 🌟

💡 小知识:装饰器是一种特殊的声明,可以被附加到类声明、方法、访问器、属性或参数上。装饰器使用 @expression 的形式,其中 expression 必须是一个函数,它会在运行时被调用。

基本装饰器实现 📊

// 1. 类装饰器
function classDecorator(target) {// 修改类的原型target.prototype.newMethod = function() {return 'Added by decorator';};// 添加静态属性target.staticProperty = 'Static Property';return target;
}@classDecorator
class Example {constructor() {this.property = 'Original Property';}
}// 2. 方法装饰器
function methodDecorator(target, propertyKey, descriptor) {// 保存原始方法const originalMethod = descriptor.value;// 修改方法descriptor.value = function(...args) {console.log(`Calling method ${propertyKey}`);const result = originalMethod.apply(this, args);console.log(`Method ${propertyKey} returned ${result}`);return result;};return descriptor;
}class Calculator {@methodDecoratoradd(a, b) {return a + b;}
}// 3. 属性装饰器
function propertyDecorator(target, propertyKey) {// 属性定义let value;// 定义getter和setterconst getter = function() {console.log(`Getting ${propertyKey}`);return value;};const setter = function(newValue) {console.log(`Setting ${propertyKey} = ${newValue}`);value = newValue;};// 替换属性定义Object.defineProperty(target, propertyKey, {get: getter,set: setter,enumerable: true,configurable: true});
}class User {@propertyDecoratorname = 'Default Name';
}

高级装饰器模式 🚀

// 1. 参数验证装饰器
function validate(validator) {return function(target, propertyKey, descriptor) {const originalMethod = descriptor.value;descriptor.value = function(...args) {// 验证所有参数args.forEach((arg, index) => {if (!validator(arg)) {throw new Error(`Invalid argument ${index} for ${propertyKey}`);}});return originalMethod.apply(this, args);};return descriptor;};
}class UserService {@validate(value => typeof value === 'string' && value.length > 0)setUsername(name) {this.username = name;}
}// 2. 缓存装饰器
function memoize(target, propertyKey, descriptor) {const originalMethod = descriptor.value;const cache = new Map();descriptor.value = function(...args) {const key = JSON.stringify(args);if (cache.has(key)) {return cache.get(key);}const result = originalMethod.apply(this, args);cache.set(key, result);return result;};return descriptor;
}class MathOperations {@memoizefibonacci(n) {if (n <= 1) return n;return this.fibonacci(n - 1) + this.fibonacci(n - 2);}
}// 3. 依赖注入装饰器
const Container = new Map();function Injectable(key) {return function(target) {Container.set(key, target);};
}function Inject(key) {return function(target, propertyKey) {Object.defineProperty(target, propertyKey, {get: () => Container.get(key),enumerable: true,configurable: true});};
}@Injectable('userService')
class UserService {getUsers() {return ['User1', 'User2'];}
}class UserController {@Inject('userService')userService;getUsers() {return this.userService.getUsers();}
}

装饰器应用场景 💼

// 1. 日志记录装饰器
function log(target, propertyKey, descriptor) {const originalMethod = descriptor.value;descriptor.value = async function(...args) {console.log(`[${new Date().toISOString()}] Calling ${propertyKey}`);try {const result = await originalMethod.apply(this, args);console.log(`[${new Date().toISOString()}] ${propertyKey} completed`);return result;} catch (error) {console.error(`[${new Date().toISOString()}] ${propertyKey} failed:`,error);throw error;}};return descriptor;
}// 2. 权限控制装饰器
function authorize(roles = []) {return function(target, propertyKey, descriptor) {const originalMethod = descriptor.value;descriptor.value = function(...args) {const user = getCurrentUser(); // 假设这个函数存在if (!roles.includes(user.role)) {throw new Error('Unauthorized access');}return originalMethod.apply(this, args);};return descriptor;};
}class AdminPanel {@authorize(['admin'])deleteUser(userId) {// 删除用户的逻辑}
}// 3. 性能监控装饰器
function measure(target, propertyKey, descriptor) {const originalMethod = descriptor.value;descriptor.value = async function(...args) {const start = performance.now();try {const result = await originalMethod.apply(this, args);const end = performance.now();console.log(`${propertyKey} took ${end - start}ms`);return result;} catch (error) {const end = performance.now();console.error(`${propertyKey} failed after ${end - start}ms:`,error);throw error;}};return descriptor;
}

装饰器性能优化 ⚡

// 1. 装饰器工厂优化
class DecoratorFactory {static memoize(options = {}) {const { maxSize = 100, ttl = 3600000 } = options;return function(target, propertyKey, descriptor) {const cache = new Map();const originalMethod = descriptor.value;descriptor.value = function(...args) {const key = JSON.stringify(args);const now = Date.now();// 检查缓存是否过期if (cache.has(key)) {const { value, timestamp } = cache.get(key);if (now - timestamp < ttl) {return value;}cache.delete(key);}// 控制缓存大小if (cache.size >= maxSize) {const oldestKey = cache.keys().next().value;cache.delete(oldestKey);}const result = originalMethod.apply(this, args);cache.set(key, { value: result, timestamp: now });return result;};return descriptor;};}
}// 2. 装饰器组合优化
function composeDecorators(...decorators) {return function(target, propertyKey, descriptor) {return decorators.reduceRight((desc, decorator) => {return decorator(target, propertyKey, desc);}, descriptor);};
}// 3. 异步装饰器优化
function asyncDecorator(target, propertyKey, descriptor) {const originalMethod = descriptor.value;const promiseCache = new WeakMap();descriptor.value = async function(...args) {if (!promiseCache.has(this)) {promiseCache.set(this, new Map());}const cache = promiseCache.get(this);const key = JSON.stringify(args);if (cache.has(key)) {return cache.get(key);}const promise = originalMethod.apply(this, args);cache.set(key, promise);try {const result = await promise;return result;} finally {cache.delete(key);}};return descriptor;
}

最佳实践建议 💡

  1. 装饰器设计模式
// 1. 单一职责原则
function singleResponsibility(target, propertyKey, descriptor) {// 每个装饰器只做一件事const originalMethod = descriptor.value;descriptor.value = function(...args) {// 只负责日志记录console.log(`Calling ${propertyKey}`);return originalMethod.apply(this, args);};return descriptor;
}// 2. 可组合装饰器
function composable(middleware) {return function(target, propertyKey, descriptor) {const originalMethod = descriptor.value;descriptor.value = function(...args) {return middleware(originalMethod.bind(this))(...args);};return descriptor;};
}// 3. 可配置装饰器
function configurable(options = {}) {return function(target, propertyKey, descriptor) {return {...descriptor,configurable: options.configurable ?? true,enumerable: options.enumerable ?? true,writable: options.writable ?? true};};
}

结语 📝

装饰器是JavaScript中一个强大的特性,它让我们能够以声明式的方式扩展和修改类的行为。我们学习了:

  1. 装饰器的基本概念和实现
  2. 高级装饰器模式和应用
  3. 实际应用场景
  4. 性能优化技巧
  5. 最佳实践和设计模式

💡 学习建议:在使用装饰器时,要注意保持装饰器的单一职责,避免过度使用。同时,要考虑装饰器对性能的影响,合理使用缓存和优化策略。


如果你觉得这篇文章有帮助,欢迎点赞收藏,也期待在评论区看到你的想法和建议!👇

终身学习,共同成长。

咱们下一期见

💻

相关文章:

JavaScript系列(31)--装饰器详解

JavaScript装饰器详解 &#x1f3a8; 今天&#xff0c;让我们深入探讨JavaScript的装饰器&#xff08;Decorators&#xff09;。装饰器是一种用于修改类和类成员的强大语言特性&#xff0c;它让我们能够以声明式的方式增强类的功能。 装饰器基础概念 &#x1f31f; &#x1f…...

培养未来:2024年少儿编程教育的实践与思考

目录 引言 &#xff1a; 正文&#xff1a; 一、Scratch教学的深化 二、代码编程的多样化 三、赛教融合驱动 四、社区互动与共同成长 结语 &#xff1a; 引言 &#xff1a; 在快速发展的科技时代&#xff0c;编程教育作为培养未来技术人才的重要环节&#xff0c;不断经历…...

ComfyUI-PromptOptimizer:文生图提示优化节点

ComfyUI-PromptOptimizer 是 ComfyUI 的一个自定义节点&#xff0c;旨在优化文本转图像模型的提示。它将用户输入的提示转换为更详细、更多样化、更生动的描述&#xff0c;使其更适合生成高质量的图像。无需本地模型。 1、功能 提示优化&#xff1a;优化用户输入的提示以生成…...

用户中心项目教程(三)---再谈nvm,nodejs和神器Geek

目录 1.昨日回顾 2.nodejs&&nvm使用 2.1问题抛出 2.2解决方案 3.geek的使用 3.1页面展示 3.2下载链接 3.3如何使用 4.按照官方文档操作 4.1官方文档 4.2我的演示 4.3可能出现的问题 1.昨日回顾 我依稀记得昨天的时候关于这个umi3相关的兼容性问题导致的这个…...

CSS布局新视角:BFC(块级格式化上下文)的作用与优势

在CSS布局的世界中&#xff0c;BFC&#xff08;Block Formatting Context&#xff0c;块级格式化上下文&#xff09;是一个既重要又神秘的概念。它不仅是解决复杂布局问题的关键工具&#xff0c;也是提升页面性能和用户体验的重要手段。本文将从新视角出发&#xff0c;深入探讨…...

智能化植物病害检测:使用深度学习与图像识别技术的应用

植物病害一直是农业生产中亟待解决的问题&#xff0c;它不仅会影响作物的产量和质量&#xff0c;还可能威胁到生态环境的稳定。随着人工智能&#xff08;AI&#xff09;技术的快速发展&#xff0c;尤其是深度学习和图像识别技术的应用&#xff0c;智能化植物病害检测已经成为一…...

Spring Boot Actuator 详细介绍

Spring Boot Actuator 详细介绍 1. 简介 Spring Boot Actuator 是 Spring Boot 提供的一个用于监控和管理应用程序的强大功能模块。它可以帮助我们了解应用程序的运行状况、指标收集、环境信息、日志级别管理等。 2. 添加依赖 2.1 在 pom.xml 中添加以下依赖&#xff1a; …...

微软确认Win10停更不碍Microsoft 365使用!未来是否更新成谜

快科技1月17日消息&#xff0c;微软澄清了关于Windows 10停止支持后Microsoft 365办公套件使用情况的误解。 前两天微软更新支持文档&#xff0c;表示2025年10月14日Windows 10停止支持之后&#xff0c;Microsoft 365应用程序将不再支持Windows 10设备&#xff0c;引发用户担忧…...

uniapp 微信小程序 editor 富文本编辑器

<view class"inp boxsizing"><view class"contentBox"><!-- 富文本编辑器 --><view classwrapper><view classtoolbar tap"format"><view :class"formats.bold ? ql-active : " class"iconfon…...

数据结构学习笔记——排序

排序 1. 排序相关概念 稳定性&#xff1a;关键字相同的数据记录&#xff0c;排序后相对顺序仍保持不变 例如&#xff0c;两个25&#xff0c;在排序完后&#xff0c;有*的25仍在后方&#xff0c;说明该排序算法是稳定的 内部排序&#xff1a;数据元素全部放在内存中的排序 外…...

CSS 样式 margin:0 auto; 详细解读

一、基本语法 margin 属性是用于设置元素的外边距&#xff0c;它可以接受一个、两个、三个或四个值。 margin:0 auto 是一种简洁的写法&#xff0c;其中包含了两个值。 二、值的含义 第一个值 0 表示元素的上下外边距为 0。这意味着该元素的顶部和底部与相邻元素或父元素之间…...

leetcode24-两两交换链表中的节点

leetcode 24 思路 本题仍然引入虚拟头节点来实现会更加简单&#xff0c;因为不用单独考虑对于头节点进行交换的场景对于边界条件考虑更少&#xff0c;交换的步骤按照下图中的步骤来 首先将dummy->22->11->3 但是在第一步的时候&#xff0c;dummy->2&#xff0c…...

项目开发实践——基于SpringBoot+Vue3实现的在线考试系统(六)

文章目录 一、考试管理模块实现1、添加考试功能实现1.1 页面设计1.2 前端功能实现1.3 后端功能实现1.4 效果展示2、考试管理功能实现2.1 页面设计2.2 前端功能实现2.3 后端功能实现2.3.1 后端查询接口实现2.3.2 后端编辑接口实现2.3.3 后端删除接口实现2.4 效果展示二、代码下载…...

flutter的web页面

有几个服务器 有几个后台 直接通过web端进去虽然说很方便&#xff0c;但… 于是把web页面镶嵌到应用里面去&#xff0c; 这样就换了个方式打开web页面了 比如这里有有个列表 这里是写死了&#xff0c;活的列表可以通过io去获取 import package:flutter/material.dart; imp…...

YOLOv10改进,YOLOv10检测头融合RFAConv卷积,添加小目标检测层(四头检测)+CA注意机制,全网首发

摘要 空间注意力已广泛应用于提升卷积神经网络(CNN)的性能,但它存在一定的局限性。作者提出了一个新的视角,认为空间注意力机制本质上解决了卷积核参数共享的问题。然而,空间注意力生成的注意力图信息对于大尺寸卷积核来说是不足够的。因此,提出了一种新型的注意力机制—…...

使用vue-next-admin框架后台修改动态路由

vue-next-admin框架是一个基于 Vue 3 和 Vite 构建的后台管理系统框架。它采用了最新的前端技术栈&#xff0c;旨在提供一个高效、灵活、现代化的管理后台解决方案。该框架主要用于构建功能丰富且易于定制的管理后台应用&#xff0c;适合各种中大型项目。 其主要特点包括&am…...

Windows蓝牙驱动开发-经典蓝牙音频

本文介绍 Windows 中的蓝牙经典音频功能。 蓝牙经典音频支持通过高级音频分发配置文件(A2DP)和单声道播放和通过免手配置文件(HFP)进行立体声音频播放。 Windows 支持各种音频编解码器和采样率&#xff0c;具体取决于 Windows 版本、耳机的功能以及音频设备的播放或捕获功能的当…...

力扣动态规划-3【算法学习day.97】

前言 ###我做这类文章一个重要的目的还是给正在学习的大家提供方向&#xff08;例如想要掌握基础用法&#xff0c;该刷哪些题&#xff1f;建议灵神的题单和代码随想录&#xff09;和记录自己的学习过程&#xff0c;我的解析也不会做的非常详细&#xff0c;只会提供思路和一些关…...

如何将本地电脑上的文件夹设置为和服务器的共享文件夹

将本地电脑上的文件夹设为与服务器共享的文件夹&#xff0c;通常是在本地开启文件共享&#xff0c;并配置相应的权限&#xff0c;使服务器可以访问该文件夹。以下以 Windows 系统为例说明具体操作步骤&#xff1a; 一、在本地电脑上设置共享文件夹 选择文件夹 找到需要共享的文…...

自己搭建远程桌面服务器-RustDesk(小白版)

1.RustDesk简介 此软件主要功能为远程各种设备&#xff08;其中包括Windows、macOS、Linux、iOS、Android、Web等&#xff09; 支持文件传输&#xff08;可直接拷贝远程电脑的文件&#xff0c;类似向日葵的远程文件&#xff09; 支持内网穿透&#xff08;支持端口映射&#…...

一文读懂服务器的HBA卡

什么是 HBA 卡 HBA 卡&#xff0c;全称主机总线适配器&#xff08;Host Bus Adapter&#xff09; &#xff0c;是服务器与存储装置间的关键纽带&#xff0c;承担着输入 / 输出&#xff08;I/O&#xff09;处理及物理连接的重任。作为一种电路板或集成电路适配器&#xff0c;HBA…...

Android SystemUI——CarSystemBar车载状态栏(九)

上一篇文章我们介绍了车载开发中的 CarSystemUI,而车载开发中的状态栏也被 CarSystemBar 所取代,这里我们就来看看一下车载系统中的状态栏——CarSystemBar。 一、车载状态栏创建 1、CarSystemBar 源码位置:/packages/apps/Car/SystemUI/src/com/android/systemui/car/sy…...

干货答疑分享记录:as导入问题,LSP含义,分屏进入SplashScreen

背景&#xff1a; vip学员群经常会有学员遇到一些常见的android framework开发问题&#xff0c;近期收集整理一些疑问&#xff0c;主要有以下3个&#xff1a; 1、android studio对源码进行导入时候&#xff0c;老是无法跳转到系统source code 2、学员在群里询问dumpOtherPro…...

WPS数据分析000001

目录 一、表格的新建、保存、协作和分享 新建 保存 协作 二、认识WPS表格界面 三、认识WPS表格选项卡 开始选项卡 插入选项卡 页面布局选项卡 公式选项卡 数据选项卡 审阅选项卡 视图选项卡 会员专享选项卡 一、表格的新建、保存、协作和分享 新建 ctrlN------…...

单独编译QT子模块

单独编译QT子模块 系统 win qt-everywhere-src-5.12.12 下载源码&#xff1a; https://download.qt.io/archive/qt/5.12/5.12.12/single/ 参考&#xff1a; https://doc.qt.io/qt-5/windows-building.html 安装依赖 https://doc.qt.io/qt-5/windows-requirements.html Per…...

Ubuntu20.4和docker终端指令、安装Go环境、安装搜狗输入法、安装WPS2019:保姆级图文详解

目录 前言1、docker、node、curl版本查看终端命令1.1、查看docker版本1.2、查看node.js版本1.3、查看curl版本1.4、Ubuntu安装curl1.5、Ubuntu终端保存命令 2、安装docker-compose、Go语言2.1、安装docker-compose2.2、go语言安装步骤2.3、git版本查看 3、Ubuntu20.4安装搜狗输…...

HarmonyOS NEXT应用开发边学边玩系列:从零实现一影视APP (五、电影详情页的设计实现)

在上一篇文章中&#xff0c;完成了电影列表页的开发。接下来&#xff0c;将进入电影详情页的设计实现阶段。这个页面将展示电影的详细信息&#xff0c;包括电影海报、评分、简介以及相关影人等。将使用 HarmonyOS 提供的常用组件&#xff0c;并结合第三方库 nutpi/axios 来实现…...

电子杂志制作平台哪个好

​作为一个热爱分享的人&#xff0c;我试过了好几个平台&#xff0c;终于找到了几款比较好用得电子杂志制作平台&#xff0c;都是操作界面很简洁&#xff0c;上手非常快的工具。 FLBOOK:这是一款在线制作H5电子画册软件&#xff0c;提供了各种类型的模板&#xff0c;可支持添加…...

1.写在前面

按照惯例&#xff0c;第一篇文章是要先介绍下专栏的风格、思路&#xff0c;以免需求不一致的同学误入&#xff0c;耽误大家时间。 本教程将系统的讲解若依前、后端的全部功能点&#xff0c;适合有面试需求的小伙伴&#xff0c;或者想提升自己能力的同学。本教程是免费教程。对源…...

JavaWeb 前端基础 html + CSS 快速入门 | 018

今日推荐语 指望别人的救赎&#xff0c;势必走向毁灭——波伏娃 日期 学习内容 打卡编号2025年01月17日JavaWeb 前端基础 html CSS018 前言 哈喽&#xff0c;我是菜鸟阿康。 今天 正式进入JavaWeb 的学习&#xff0c;简单学习 html CSS 这2各前端基础部分&am…...

redis做为缓存,mysql的数据如何与redis进行同步呢?

Redis作为缓存与MySQL之间的数据同步问题&#xff0c;特别是涉及到双写一致性&#xff08;即缓存与数据库的写操作要保持一致&#xff09;时&#xff0c;通常有两种常见的解决方案。它们分别适用于不同的一致性要求和延迟容忍度。以下是两种常见的解决方案的详细解释&#xff1…...

TCP 重传演进:TCP RACK Timer 能替代 RTO 吗

本文的建议适用于想改变 TCP 行为的新协议设计&#xff0c;还是那句话&#xff0c;不要抄 TCP 做 yet another TCP。 RTO 一直是 TCP 传输过程所要尽量避免的&#xff0c;因为它会将状态带入 Loss 进而 Go-Back-N&#xff0c;这是一个昂贵的操作。But 在 Fast-Retransmit 被引…...

React Native的现状与未来:从发展到展望

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗&#xff1f;订阅我们的简报&#xff0c;深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同&#xff0c;从行业内部的深度分析和实用指南中受益。不要错过这个机会&#xff0c;成为AI领…...

替换数字

目录 题目 思路 代码 题目 给定一个字符串 s&#xff0c;它包含小写字母和数字字符&#xff0c;请编写一个函数&#xff0c;将字符串中的字母字符保持不变&#xff0c;而将每个数字字符替换为number。 例如&#xff0c;对于输入字符串 "a1b2c3"&#xff0c;函数应…...

[cg] UE5 调试技巧

UE 中 rhi命令的提交是在render 线程&#xff0c;而graphics api 真正的执行是在rhi 线程&#xff0c; 今天想看下rhi的底层调用&#xff0c;但由于是通过task执行的&#xff0c;无法获取到render thread传入的地方&#xff0c;调试起来不太方便。 可通过开启下面的命令来调试 …...

Git相关命令

一&#xff1a;基础认识 1.Git 三种状态 Working Directory &#xff1a;本地工作目录&#xff0c;工作区Staging Area&#xff1a;添加文件&#xff0c;用于commit前&#xff0c;暂存区.git directory(Repository)&#xff1a;本地仓库&#xff0c;存储commit数据&#xff0…...

uni-simple-router史上最全使用方法教程

在 uni-app 项目中&#xff0c;随着应用的复杂度增加&#xff0c;传统的路由管理方式可能无法满足需求&#xff0c;尤其是在多页面和权限控制等场景下。这时&#xff0c;使用像 uni-simple-router 这样的路由管理库可以简化开发流程&#x1f44d;&#xff0c;如权限控制、路由守…...

【ArcGIS微课1000例】0140:总览(鹰眼)、放大镜、查看器的用法

文章目录 一、总览工具二、放大镜工具三、查看器工具ArcGIS中提供了三种局部查看的工具: 总览(鹰眼)、放大镜、查看器,如下图所示,本文讲述这三种工具的使用方法。 一、总览工具 为了便于效果查看与比对,本实验采用全球影像数据(位于配套实验数据包中的0140.rar中),加…...

【Linux】【Vim】vim编辑器的用法

一、vim简介 Vim是一款功能强大且高度可定制的文本编辑器&#xff0c;广泛应用于Linux 和 Unix系统中。 它不仅继承了vi编辑器的所有特性&#xff0c;还增加了许多新的功能&#xff0c;如语法高亮、代码折叠、多级撤销等。 Vim有三种主要的工作模式&#xff1a; 命令模式&am…...

RabbitMQ实现延迟消息发送——实战篇

在项目中&#xff0c;我们经常需要使用消息队列来实现延迟任务&#xff0c;本篇文章就向各位介绍使用RabbitMQ如何实现延迟消息发送&#xff0c;由于是实战篇&#xff0c;所以不会讲太多理论的知识&#xff0c;还不太理解的可以先看看MQ的延迟消息的一个实现原理再来看这篇文章…...

《leetcode-runner》【图解】【源码】如何手搓一个debug调试器——架构

前文&#xff1a; 《leetcode-runner》如何手搓一个debug调试器——引言 文章目录 设计引入为什么这么设计存在难点1. 环境准备2. 调试程序 仓库地址&#xff1a;leetcode-runner 本文主要聚焦leetcode-runner对于debug功能的整体设计&#xff0c;并讲述设计原因以及存在的难点…...

G1原理—10.如何优化G1中的FGC

大纲 1.G1的FGC可以优化的点 2.一个bug导致的FGC(Kafka发送重试 subList导致List越来越大) 3.为什么G1的FGC比ParNew CMS要更严重 4.FGC的一些参数及优化思路 1.G1的FGC可以优化的点 (1)FGC的基本原理 (2)遇到FGC应该怎么处理 (3)应该如何操作来规避FGC (4)应该如何操…...

【专题一 递归】21. 合并两个有序链表

1.题目解析 2.讲解算法原理 解法:递归-> 重复的子问题 重复子问题 ->函数头的设计 合并两个有序链表--->Node dfs(l1&#xff0c;l2) 只关心某一个子问题在做什么事情 ->函数体的设计 比大小l1→next dfs( l1.next, l2)return l1 递归的出口 if(l1null)return l2…...

WebSocket——推送方案选型

一、前言&#xff1a;为何需要服务端主动推送&#xff1f; 在现代应用中&#xff0c;很多功能都依赖于“消息推送”。比如&#xff1a; 小红点提醒&#xff1a;我们经常在手机应用里看到的一个小红点提示&#xff0c;表示有新的消息或任务需要我们关注。新消息提醒&#xff1…...

Openresty 安装

1&#xff0e; 依赖包安装&#xff1a; # yum install readline-devel pcre-devel openssl-devel 2. 在系统中添加openresty的仓库&#xff1a; # sudo yum install yum-utils # sudo yum-config-manager --add-repo https://openresty.org/package/centos/openresty.repo …...

回归预测 | MATLAB实TCN时间卷积神经网络多输入单输出回归预测

效果一览 基本介绍 回归预测 | MATLAB实TCN时间卷积神经网络多输入单输出回归预测 …………训练集误差指标………… 1.均方差(MSE)&#xff1a;166116.6814 2.根均方差(RMSE)&#xff1a;407.5741 3.平均绝对误差&#xff08;MAE&#xff09;&#xff1a;302.5888 4.平均相对…...

TikTok专线服务器助力品牌营销新高度

在这个信息爆炸的时代&#xff0c;短视频平台如雨后春笋般涌现&#xff0c;TikTok便是其中的佼佼者。众多品牌纷纷涌入这个平台&#xff0c;试图借助其强大的用户基础和传播能力来提升知名度。而在这其中&#xff0c;IPIPGO直播专线的出现&#xff0c;为品牌在TikTok上的营销提…...

flutter VoidCallBack ValueChange<T> 的函数定义

在 Flutter 中,VoidCallback 和 ValueChanged<T> 是两种常用的回调函数类型,它们通常用于处理事件或传递数据。下面是它们的详细定义及使用方式。 1. VoidCallback 函数类型 VoidCallback 是一个没有参数也没有返回值的回调函数类型。它通常用于简单的事件处理,比如…...

pyspark连接clickhouse数据库的方式(其它数据库同样适用)

目录 一、背景简记二、pyspark连接clickhouse方式记录三、结语参考学习博文 一、背景简记 实际工作中&#xff0c;大部分所用的数据存储地址都是在数据库中&#xff0c;如我司现在常用的数据库是clickhouse&#xff0c;相关数据的统计分析都在此上操作。如果想用pyspark连接cl…...

当父级元素设置了flex 布局 ,两个子元素都设置了flex :1, 但是当子元素放不下的时候会溢出父元素怎么解决 (css 样式问题)

一、问题 遇到个样式问题&#xff0c;当父级元素设置了flex 布局 &#xff0c;两个子元素都设置了flex :1, 但是当子元素放不下的时候会溢出父元素怎么解决 &#xff08;拖拽浏览器 使页面变小&#xff09; 二、解决方法 .father{min-height: 600px;width: 100%;display: flex…...