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

JavaScript 里三个点 ... 的用法

 // table表头数据let tableHeadData = deepClone(data);let tableCacheData = [];//表格缓存对比if (!parent && isCacheHeadData) {// 缓存数据keylet tableCacheKey = `${window.location.pathname}-${$self.attr('id')}`if (localStorage.getItem(tableCacheKey)) {//根据缓存数据更新列表数据let cacheData = JSON.parse(localStorage.getItem(tableCacheKey))let datas = []cacheData.map(e => {let index = tableHeadData.findIndex(v => e.id === v.name)if (index !== -1) {datas.push({ ...tableHeadData[index], ...{ ishide: !e.checked, width: e.width } })tableHeadData.splice(index, 1)}})tableHeadData = [...datas, ...tableHeadData]}//设置更新缓存数据tableHeadData.map(e => {tableCacheData.push({ id: e.name, pId: "", width: e.width, name: e.label, checked: e.ishide === true ? false : true })})localStorage.setItem(tableCacheKey, JSON.stringify(tableCacheData))}

示例一

function myFunc(a, b, ...args) {console.log(a); // 22console.log(b); // 98console.log(args); // [43, 3, 26]
};
myFunc(22, 98, 43, 3, 26);

示例二

function myFunc(...[x, y, z]) {return x * y* z;
}myFunc(1)          // NaN
myFunc(1, 2, 3)    // 6
myFunc(1, 2, 3, 4) // 6 (fourth parameter is not destructured)

示例三

function myFunc(x, y, ...params) { // used rest operator hereconsole.log(x);console.log(y);console.log(params);
}var inputs = ["a", "b", "c", "d", "e", "f"];
myFunc(...inputs); // used spread operator here
// "a"
// "b"
// ["c", "d", "e", "f"]

示例四

const featured = ['Deep Dish', 'Pepperoni', 'Hawaiian'];
const specialty = ['Meatzza', 'Spicy Mama', 'Margherita'];const pizzas = [...featured, 'veg pizza', ...specialty];console.log(pizzas); // 'Deep Dish', 'Pepperoni', 'Hawaiian', 'veg pizza', 'Meatzza', 'Spicy Mama', 'Margherita'

示例五

var obj1 = { foo: 'bar', x: 42 };
var obj2 = { foo: 'baz', y: 13 };var clonedObj = { ...obj1 };
// Object { foo: "bar", x: 42 }var mergedObj = { ...obj1, ...obj2 };
// Object { foo: "baz", x: 42, y: 13 }

JavaScript 里三个点 ... 的用法

合并数组或者对象

当我们在代码中看到三个点 (…) 时,它要么是 rest 参数,要么是展开运算符。

有一个简单的方法来区分它们:

当三个点 (…) 位于函数参数的末尾时,它是“rest 参数”并将参数列表的其余部分收集到一个数组中。

当三个点 (…) 出现在函数调用或类似函数中时,它被称为“扩展运算符”并将数组扩展为 list.

相关文章:

JavaScript 里三个点 ... 的用法

// table表头数据let tableHeadData deepClone(data);let tableCacheData [];//表格缓存对比if (!parent && isCacheHeadData) {// 缓存数据keylet tableCacheKey ${window.location.pathname}-${$self.attr(id)}if (localStorage.getItem(tableCacheKey)) {//根据缓…...

Linux修改系统语言

sudo dpkg-reconfigure locales 按pagedown键,移动红色光标到 zh_CN.UTF-8 UTF-8,空格标记*号(没标记下一页没有这一项),回车。 下一页选择 zh_CN.UTF-8。 如果找不到 dpkg-reconfigure whereis dpkg-reconfigure …...

Spring注解开发

目录 1、简介 2、原始注解 2.1、注解种类 2.2、组件扫描 2.3、具体使用 2.3.1、xml配置 2.3.2、注解配置 3、⭐新注解 3.1、新注解种类 3.2、实践 3.3、运行结果 3.4、警告信息 1、简介 Spring框架提供了许多注解,用于在Java类中进行配置和标记&#xf…...

图像处理库(Opencv, Matplotlib, PIL)以及三者之间的转换

文章目录 1. Opencv2. Matplotlib3. PIL4. 三者的区别和相互转换5. Torchvision 中的相关转换库5.1 ToPILImage([mode])5.2 ToTensor5.3 PILToTensor 1. Opencv opencv的基本图像类型可以和numpy数组相互转化,因此可以直接调用torch.from_numpy(img) 将图像转换成t…...

html+Vue+封装axios实现发送请求

在html中使用Vue和Axios时&#xff0c;可以在HTML中引入Vue库和Axios库&#xff0c;然后使用Vue的语法和指令来创建Vue组件和模板。在Vue组件中&#xff0c;你可以使用Axios发送HTTP请求来获取数据&#xff0c;并将数据绑定到Vue模板中进行展示。 <template><div>&…...

GoogLeNet卷积神经网络输出数据形参分析-笔记

GoogLeNet卷积神经网络输出数据形参分析-笔记 分析结果为&#xff1a; 输入数据形状:[10, 3, 224, 224] 最后输出结果&#xff1a;linear_0 [10, 1] [1024, 1] [1] 子空间执行逻辑 def forward_old(self, x):# 支路1只包含一个1x1卷积p1 F.relu(self.p1_1(x))# 支路2包含 1…...

【docker】dockerfile发布springboot项目

目录 一、实现步骤二、示例 一、实现步骤 1.定义父镜像&#xff1a;FROM java:8 2.定义作者信息&#xff1a;MAINTAINER&#xff1a;learn_docker<https://www.docker.com> 3.将jar包添加到容器&#xff1a;ADD jar包名称.jar app.jar 4.定义容器启动执行命令&#xff1a…...

利用docker run -v 命令实现使用宿主机中没有的命令

利用docker run -v 命令实现使用宿主机中没有的命令 使用容器中的jar命令解压jar包&#xff0c;并将解压内容输出到挂载在宿主机中的目录里 使用容器中的jar命令解压jar包&#xff0c;并将解压内容输出到挂载在宿主机中的目录里 docker run -it --name java -v /www/temp/java…...

【小沐学NLP】在线AI绘画网站(百度:文心一格)

文章目录 1、简介2、文心一格2.1 功能简介2.2 操作步骤2.3 使用费用2.4 若干示例2.4.1 女孩2.4.2 昙花2.4.3 山水画2.4.4 夜晚2.4.5 古诗2.4.6 二次元2.4.7 帅哥 结语 1、简介 当下&#xff0c;越来越多AI领域前沿技术争相落地&#xff0c;逐步释放出极大的产业价值&#xff0…...

react经验5:访问子组件内容

应用场景 父级需要调用子组件的某函数 实现步骤 案例&#xff1a;创建自定义按钮 button.tsx import { Ref, forwardRef, useImperativeHandle,ReactNode} from "react" declare type ButtonProps {/**按钮文字 */children?: ReactNode,onClick?: () > voi…...

【LeetCode】647. 回文子串

题目链接 文章目录 1. 思路讲解1.1 方法选择1.2 dp表的创建1.3 状态转移方程1.4 填表顺序 2. 代码实现 1. 思路讲解 1.1 方法选择 这道题我们采用动态规划的解法&#xff0c;倒不是动态规划的解法对于这道题有多好&#xff0c;它并不是最优解。但是&#xff0c;这道题的动态…...

Open3D(C++) 角度制与弧度制的相互转换

目录 一、弧度转角度1、计算公式2、主要函数3、示例代码4、结果展示二、角度转弧度1、计算公式2、主要函数3、示例代码4、结果展示三、归一化到(-PI,PI)1、主要函数<...

【小沐学NLP】在线AI绘画网站(网易云课堂:AI绘画工坊)

文章目录 1、简介1.1 参与方式1.2 模型简介 2、使用费用3、操作步骤3.1 选择模型3.2 输入提示词3.3 调整参数3.4 图片生成 4、测试例子4.1 小狗4.2 蜘蛛侠4.3 人物4.4 龙猫 结语 1、简介 Stable Diffusion是一种强大的图像生成AI&#xff0c;它可以根据输入的文字描述词&#…...

GNN code Tips

1. 重置label取值范围 problem: otherwise occurs IndexError: target out of bounds # reset labels value range, otherwise occurs IndexError: target out of bounds uni_set torch.unique(labels) to_set torch.tensor(list(range(len(uni_set)))) labels_reset label…...

物联网|按键实验---学习I/O的输入及中断的编程|函数说明的格式|如何使用CMSIS的延时|读取通过外部中断实现按键捕获代码的实现及分析-学习笔记(14)

文章目录 通过外部中断实现按键捕获代码的实现及分析Tip1:函数说明的格式Tip2:如何使用CMSIS的延时GetTick函数原型stm32f407_intr_handle.c解析中断处理函数&#xff1a;void EXTI4_IRQHandler 调试流程软件模拟调试 两种代码的比较课后作业: 通过外部中断实现按键捕获代码的实…...

Java对象的前世今生

文章目录 一、创建对象的步骤二、类加载机制三、内存分配指针碰撞 (内存连续)空闲列表 (内存不连续) 四、创建对象的5种方法五、浅拷贝与深拷贝 以下一行代码内部发生了什么&#xff1f; Person person new Person();一、创建对象的步骤 根据JLS中的规定&#xff0c;Java对象…...

Qt中JSON的使用

一.前言&#xff1a; JSON是一种轻量级数据交换格式&#xff0c;常用于客户端和服务端的数据交互&#xff0c;不依赖于编程语言&#xff0c;在很多编程语言中都可以使用JSON&#xff0c;比如C&#xff0c;C&#xff0c;Java&#xff0c;Android&#xff0c;Qt。除了JSON&#x…...

linux安装Tomcat部署jpress教程

yum在线安装&#xff1a; 查看tomcat相关的安装包&#xff1a; [rootRHCE ~]# yum list | grep -i tomcat tomcat.noarch 7.0.76-16.el7_9 updates tomcat-el-2.2-api.noarch 7.0.76-16.el7_9 updat…...

高并发负载均衡---LVS

目录 前言 一&#xff1a;负载均衡概述 二&#xff1a;为啥负载均衡服务器这么快呢&#xff1f; ​编辑 2.1 七层应用程序慢的原因 2.2 四层负载均衡器LVS快的原因 三&#xff1a;LVS负载均衡器的三种模式 3.1 NAT模式 3.1.1 什么是NAT模式 3.1.2 NAT模式实现LVS的缺点…...

微前端中的 CSS

本文为翻译 本文译者为 360 奇舞团前端开发工程师原文标题&#xff1a;CSS in Micro Frontends 原文作者&#xff1a;Florian Rappl 原文地址&#xff1a;https://dev.to/florianrappl/css-in-micro-frontends-4jai 我被问得最多的问题之一是如何在微前端中处理 CSS。毕竟&…...

RabbitMQ连接报错ACCESS_REFUSED?别慌,手把手教你排查用户权限与vhost配置

RabbitMQ连接报错ACCESS_REFUSED&#xff1f;三步精准定位权限与vhost问题 深夜的报警短信总是格外刺眼——"RabbitMQ连接失败&#xff1a;ACCESS_REFUSED"。这个看似简单的权限错误背后&#xff0c;往往隐藏着vhost配置、用户权限和客户端参数的三重陷阱。本文将带您…...

成都不良资产收包出包难?专业处置破局存量盘活困境

不仅如此&#xff0c;规范化的不良资产处置模式&#xff0c;还能助力区域化解债务风险&#xff0c;稳定地方金融环境&#xff0c;激活存量资产活力&#xff0c;对地方经济发展起到正向推动作用。不良资产收包出包&#xff0c;拼的从来不是蛮力与时间&#xff0c;而是专业、合规…...

三步法实战指南:用FanControl打造静音高效的Windows风扇控制系统

三步法实战指南&#xff1a;用FanControl打造静音高效的Windows风扇控制系统 【免费下载链接】FanControl.Releases This is the release repository for Fan Control, a highly customizable fan controlling software for Windows. 项目地址: https://gitcode.com/GitHub_T…...

使用coze为连锁服装品牌打造门店智能导购助手

### 业务背景&#xff1a;一线导购的“三座大山”客户是拥有 400 多家门店的快时尚品牌。一线导购每天面临的挑战很典型&#xff1a;- **信息记不住**&#xff1a;每周上百款新品上市&#xff0c;每款的成分、库存、搭配建议都要背&#xff0c;新员工培训周期长。 - **找货效率…...

Perplexity引用格式设置全链路解析(含BibTeX/CSL/DOI自动映射底层逻辑)

更多请点击&#xff1a; https://kaifayun.com 第一章&#xff1a;Perplexity引用格式设置全链路解析&#xff08;含BibTeX/CSL/DOI自动映射底层逻辑&#xff09; Perplexity 在学术写作支持中并非原生集成引文管理&#xff0c;但其底层可对接外部文献元数据服务&#xff0c;实…...

实用指南:3分钟在Windows中解锁iPhone HEIC照片缩略图预览

实用指南&#xff1a;3分钟在Windows中解锁iPhone HEIC照片缩略图预览 【免费下载链接】windows-heic-thumbnails Enable Windows Explorer to display thumbnails for HEIC/HEIF files 项目地址: https://gitcode.com/gh_mirrors/wi/windows-heic-thumbnails 还在为iPh…...

Claude code配置全流程(附带接入模型)

1.安装nodejs (Claudecode 本身是用TypeScript/JavaScript开发的命令行工具&#xff0c;需要通过Node.js运行时来执行&#xff0c;并且node.js天然集成npm,claudecode是作为npm包发布的)&#xff1a; 1.1网址&#xff1a;https://node.org.cn/ 进入后下载自己需要的系统类型就可…...

Kubernetes核心知识点

1.ca-certificates,gnupg,lsb-release三个包的解释. ca-certificates是系统内置的权威根整数数据包&#xff0c;可以让系统正常识别并信任各类网站&#xff0c;避免出现证书异常与访问失败问题。 gnupg是开源的加密与签名校验工具&#xff0c;可用于导入第三方软件源公钥&#…...

从CNN到ViT:混合网络架构的设计哲学与PyTorch实战

1. 项目概述&#xff1a;为什么我们需要混合网络&#xff1f;在计算机视觉领域待了十几年&#xff0c;我亲眼见证了模型架构的“风水轮流转”。从早期的LeNet、AlexNet&#xff0c;到后来统治多年的ResNet、DenseNet等纯卷积神经网络&#xff0c;再到这两年Transformer架构&…...

告别日志脱敏烦恼:手把手教你用sensitive注解优雅保护用户隐私数据

优雅实现日志脱敏&#xff1a;基于注解的隐私数据保护实战指南 在金融、电商等强合规领域&#xff0c;用户隐私数据保护早已从"可选"变为"必选"。每次看到同事在代码中手动拼接"手机号&#xff1a;"user.getPhone().substring(0,3)"****&qu…...