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

js-cookie使用 js深度克隆(判断引用类型是数组还是对象的方法)

cookie和深度拷贝的使用

    • 1、js-cookie使用
    • 2、js深度克隆

1、js-cookie使用

前端的本地存储分为 localstorage、sesstionstorage、cookie
但是咱们有时候需要做7天免登录的需求时,选择 cookie 作为前端的本地存储是在合适不过的了

直接操作 cookie 可以, document.cookie = xxx, 赋值就可以了, 但是我在这给大家介绍一个很小的操作 cookie 的工具  js-cookie
js-cookie 现在主流的框架  vue、react 都可以使用
  1. 安装js-cookie
// yarn
yarn add js-cookie 
// npm
npm i js-cookie
  1. 组件中引入,vue2 用到的地方比较多,也可以挂载在vue实例上 vue.prototype.$xxx = xxx
// 在使用的组件中
import Cookie from "js-cookie"
  1. js-cookie 存取值
// js-cookie 存值
Cookie.set('key', "存进cookie的值")// js-cookie 取值
Cookie.get('key')// js-cookie 删值
Cookie.remove("key")

注意:cookie 和 local、sesion 一样,存字符串

  1. js-cookie 设置过期时间
// js-cookie 默认 expires 的值 为 天
Cookie.set('key', 'value', { expires: 7 })  // 表示 7 天过期// 想要 3个小时过期,可以使用时间戳
const time = new Date( new Date() + 1000 * 60 * 60 * 3 )  // 表示 3 个小时过期(时间戳表示)
Cookie.set('key', 'value', { expires: time })

时间转换关系

在这里插入图片描述

  1. 查看 cookie 值 和过期时间

在这里插入图片描述
东八区:往前推了 8 个小时,上图显示的时间加上 8 个小时和当前的时间做对比就可以得到 cookie 的过期时间多长

2、js深度克隆

js做一些引用类型的数据的时候需要用到深拷贝


export function deepClone(value) {// 非原始值有两种//  1、数组的克隆if(Object.prototype.toString.call(value) === '[object Array]') {let clone = [];for(let i=0;i<value.length;i++) {clone[i] = deepClone(value[i]);}return clone}// 2、对象的克隆if(Object.prototype.toString.call(value) === '[object Object]') {let clone = {}for(let key in value) {clone[key] = deepClone(value[key])}return clone}return value;  // 返回原始值
}

相关文章:

js-cookie使用 js深度克隆(判断引用类型是数组还是对象的方法)

cookie和深度拷贝的使用 1、js-cookie使用2、js深度克隆 1、js-cookie使用 前端的本地存储分为 localstorage、sesstionstorage、cookie 但是咱们有时候需要做7天免登录的需求时&#xff0c;选择 cookie 作为前端的本地存储是在合适不过的了 直接操作 cookie 可以&#xff0c; …...

[Pytorch]语义分割任务分类的实现

文章目录 [Pytorch]语义分割任务分类的实现 [Pytorch]语义分割任务分类的实现 假如我们定义了一个网络用于语义分割任务&#xff0c;这个网络简称为model() 语义分割任务要做的是&#xff1a; 对于一个图片输入input&#xff0c;大小为&#xff08;B&#xff0c;C&#xff0c…...

测试网页调用本地可执行程序(续:带参数调用)

前篇文章介绍了网页调用本地可执行程序的方式&#xff0c;通过在注册表中注册命令&#xff0c;然后在网页中调用命令启动本地程序。如果需要传递参数&#xff0c;则需要在注册表命令中的command项中设置如下形式的值。 "XXXXXX\XXXXXXX.exe" "%1"&emsp…...

Carla自动驾驶模拟器安装和使用

Carla自动驾驶模拟器安装和使用 1 安装 ubuntu20.04安装carla0.9.11版本 步骤1&#xff1a;打开下面链接&#xff0c;点击第一个[Ubuntu] CARLA_0.9.11.tar.gz carla-0.9.11源码下载 步骤2&#xff1a;下载完解压到/opt目录下 我的话是先在下载目录上提取解压&#xff0c;然…...

【每日一题】1539. 第 k 个缺失的正整数

1539. 第 k 个缺失的正整数 - 力扣&#xff08;LeetCode&#xff09; 给你一个 严格升序排列 的正整数数组 arr 和一个整数 k 。 请你找到这个数组里第 k 个缺失的正整数。 示例 1&#xff1a; 输入&#xff1a;arr [2,3,4,7,11], k 5 输出&#xff1a;9 解释&#xff1a;缺失…...

AI-Chat,一款集全网ai功能的应用(附下载链接)

AI-Chat是一款综合性的聊天机器人&#xff0c;集成了多种先进的模型和功能。它采用了GPT4.0、联网版GPT和清华模型等多种模型&#xff0c;使得其具备更强大的语言处理能力。同时&#xff0c;AI-Chat还融合了AI绘画模型&#xff0c;例如Stable Diffusion绘画、文生图、图生图、艺…...

3、靶场——Pinkys-Place v3(3)

文章目录 一、获取flag41.1 关于SUID提权1.2 通过端口转发获取setuid文件1.3 运行pinksecd文件1.4 利用nm对文件进行分析1.5 构建payload1.6 Fire 二、获取flag52.1 生成ssh公钥2.2 免密登录ssh2.3 以pinksecmanagement的身份进行信息收集2.4 测试程序/usr/local/bin/PSMCCLI2.…...

什么是 AirServer?Mac专用投屏工具AirServer 7 .27 for Mac中文破解版百度网盘下载

AirServer 7 .27 for Mac中文免费激活版是一款Mac专用投屏工具&#xff0c;能够通过本地网络将音频、照片、视频以及支持AirPlay功能的第三方App&#xff0c;从 iOS 设备无线传送到 Mac 电脑的屏幕上&#xff0c;把Mac变成一个AirPlay终端的实用工具。 目前最新的AirServer 7.2…...

MapStruct介绍以及VO、DTO、PO、DO的区别

文章目录 一.基本概念1.1VO**&#xff08;Value Object&#xff09;值对象**1.2DTO**&#xff08;Data Transfer Object&#xff09;数据传输对象**1.3 PO**&#xff08;Persistant Object&#xff09;持久对象**等同于Entity&#xff0c;这俩概念是一致的 或DO1.4 **BO&#x…...

记一次hyperf框架封装swoole自定义进程

背景 公司准备引入swoole和rabbitmq来处理公司业务。因此&#xff0c;我引入hyperf框架&#xff0c;想用swoole的多进程来实现。 自定义启动服务封装 <?php /*** 进程启动服务【manager】*/ declare(strict_types1);namespace App\Command;use Swoole; use Swoole\Proce…...

多输入多输出 | MATLAB实现GA-BP遗传算法优化BP神经网络多输入多输出

多输入多输出 | MATLAB实现GA-BP遗传算法优化BP神经网络多输入多输出 目录 多输入多输出 | MATLAB实现GA-BP遗传算法优化BP神经网络多输入多输出预测效果基本介绍程序设计往期精彩参考资料 预测效果 基本介绍 多输入多输出 | MATLAB实现GA-BP遗传算法优化BP神经网络多输入多输出…...

李宏毅机器学习笔记-transformer

transformer是什么呢&#xff1f;是一个seq2seq的model。具体应用如上图所示&#xff0c;输入和输出的序列长度不固定&#xff0c;由model自己决定。 语音翻译指的是&#xff0c;直接输入一段语音信号&#xff0c;例如英文&#xff0c;输出的直接是翻译之后的中文。 seq2seq如…...

基于Java的酒店管理系统

博主主页&#xff1a;猫头鹰源码 博主简介&#xff1a;Java领域优质创作者、CSDN博客专家、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战 主要内容&#xff1a;毕业设计(Javaweb项目|小程序等)、简历模板、学习资料、面试题库、技术咨询 文末联系获取 项目介绍…...

Go语言的单元测试与基准测试详解

文章目录 单元测试基准测试 单元测试 以一个加法函数为例&#xff0c;对其进行单元测试。 首先编写add.go文件&#xff1a; //add.go package mainfunc add(a, b int) int {return a b }其次编写add_test.go文件&#xff0c;在go语言中&#xff0c;测试文件均已_test结尾&a…...

【多态】为什么析构函数的名称统一处理为destructor?

析构函数的名称统一处理为destructor的目的是为了解决析构函数的重写。 而这又引出了一个问题&#xff1a;为什么要进行析构函数的重写&#xff1f; 是为了下面这种情况&#xff1a; class Person { public:~Person() { cout << "~Person" << endl; } }…...

6.4 Case Studies - A Simple Logging Archive Class

下面这段内容介绍了一个示例&#xff0c;目的是帮助澄清"归档概念&#xff08;Archive Concept&#xff09;"的用法&#xff0c;以便用户可以实现自己的归档类。simple_log_archive.hpp 实现了一个简单但实用的归档类&#xff0c;用于将任何可序列化类型以可读的格式…...

【深度学习实验】前馈神经网络(九):整合训练、评估、预测过程(Runner)

目录 一、实验介绍 二、实验环境 1. 配置虚拟环境 2. 库版本介绍 三、实验内容 0. 导入必要的工具包 1. __init__(初始化) 2. train(训练) 3. evaluate(评估) 4. predict(预测) 5. save_model 6. load_model 7. 代码整合 一、实验介绍 二、实验环境 本系列实验使用…...

002-第一代硬件系统架构确立及产品选型

第一代硬件系统架构确立及产品选型 文章目录 第一代硬件系统架构确立及产品选型项目介绍摘要硬件架构硬件结构选型及设计单片机选型上位机选型扯点别的 关键字&#xff1a; Qt、 Qml、 信号采集机、 数据处理、 上位机 项目介绍 欢迎来到我们的 QML & C 项目&#xff…...

Go基础语法:指针和make和new

8 指针、make、new 8.1 指针&#xff08;pointer&#xff09; Go 语言中没有指针操作&#xff0c;只需要记住两个符号即可&#xff1a; & 取内存地址* 根据地址取值 package mainimport "fmt"func main() {a : 18// 获取 a 的地址值并复制给 pp : &a// …...

039_小驰私房菜_Camera perfermance debug

全网最具价值的Android Camera开发学习系列资料~ 作者:8年Android Camera开发,从Camera app一直做到Hal和驱动~ 欢迎订阅,相信能扩展你的知识面,提升个人能力~ 一、抓取trace 1. adb shell "echo vendor.debug.trace.perf=1 >> /system/build.prop" 2. …...

保姆级教程:用CH34xSerCfg修改USB转串口芯片的VID/PID,解决驱动冲突和串口号固定问题

嵌入式开发实战&#xff1a;用CH34xSerCfg定制USB转串口设备标识与驱动管理 当你的工作台上同时连接着五个相同型号的USB转TTL模块&#xff0c;Windows设备管理器里COM端口像走马灯一样随机变换编号时&#xff1b;当团队协作开发中&#xff0c;每个成员需要固定识别自己的调试设…...

All in Token,三个运营商建Token工厂,中国移动跟进Token经营 三大运营商争夺AI阵地

随着Token&#xff08;词元&#xff09;经营战略的密集落地&#xff0c;三大运营商在AI领域的竞争愈发激烈。在日前举行的2026移动云大会上&#xff0c;中国移动正式发布了Token运营生态体系与移动模型服务平台MoMA&#xff0c;宣布接入超300款模型&#xff0c;并通过Token集约…...

构建轻量级LLM工具集:模块化设计、多模型集成与本地化部署实践

1. 项目概述&#xff1a;一个面向日常的轻量级LLM工具集最近在GitHub上闲逛&#xff0c;发现了一个挺有意思的项目&#xff0c;叫“Daily-LLM”。光看名字&#xff0c;你可能会觉得这又是一个庞大的、需要海量算力才能跑起来的“大模型”项目。但点进去仔细研究后&#xff0c;我…...

AI驱动代码审查:Cursor与Git工作流融合实践

1. 项目概述&#xff1a;当AI代码助手遇上代码审查最近在GitHub上看到一个挺有意思的项目&#xff0c;叫guinacio/cursor-review。光看名字&#xff0c;你可能会觉得这又是一个普通的代码审查工具&#xff0c;但点进去仔细研究&#xff0c;你会发现它的核心思路非常巧妙&#x…...

基于 Next.js 的无头电商架构实战:从 Vercel Commerce 看现代全栈开发

1. 项目概述&#xff1a;一个面向未来的全栈电商起点如果你最近在琢磨着用 Next.js 搞一个电商网站&#xff0c;或者想找一个现代、开箱即用的全栈电商模板来启动项目&#xff0c;那你大概率已经听说过vercel/commerce这个仓库了。它不是某个具体的电商平台&#xff0c;而是一个…...

碳排放混合时间窗集装箱运输调度【附算法】

✨ 长期致力于集装箱运输VRP、混合时间窗、碳排放、多目标优化、NSGA-Ⅱ、蚁群算法研究工作&#xff0c;擅长数据搜集与处理、建模仿真、程序编写、仿真设计。 ✅ 专业定制毕设、代码 ✅ 如需沟通交流&#xff0c;点击《获取方式》 &#xff08;1&#xff09;经济性与紧急性双目…...

基于Arduino与加速度传感器的可穿戴智能徽章制作全解析

1. 项目概述&#xff1a;一个会“走路”的智能徽章几年前&#xff0c;当《Pokemon Go》风靡全球时&#xff0c;我注意到一个有趣的现象&#xff1a;深夜的公园里&#xff0c;总有一群玩家低头盯着手机屏幕&#xff0c;在昏暗的光线下穿梭。这固然是游戏的乐趣&#xff0c;但也带…...

安卓客户端架构解析:从MVVM到网络通信的完整实践

1. 项目概述&#xff1a;一个面向安卓设备的智能客户端最近在整理手头的开源项目时&#xff0c;发现了一个挺有意思的仓库&#xff0c;名字叫TOM88812/xiaozhi-android-client。光看这个标题&#xff0c;你可能会有点摸不着头脑&#xff0c;这“小智”到底是个啥&#xff1f;是…...

Bun用Rust重写核心代码,百万行新增代码直接把GitHub干爆了!

Bun 项目刚刚完成了一次惊人的技术跨越。5月14日&#xff0c;Bun 正式宣布其核心运行时已从 Zig 重写为 Rust——这个版本包含 6755 个 commit&#xff0c;二进制文件体积缩小 3-8 MB&#xff0c;性能测试在各个平台上均达到或超越原有水平。Jarred Sumner&#xff08;Bun 的创…...

Docker里CentOS镜像yum报错?别慌,教你两步搞定‘appstream’仓库元数据下载失败

Docker中CentOS镜像yum报错&#xff1f;三步根治‘appstream’仓库元数据下载失败 当你兴致勃勃地在Docker中启动一个CentOS容器准备大展拳脚时&#xff0c;突然遭遇Failed to download metadata for repo appstream的红色报错&#xff0c;这种挫败感我深有体会。不同于物理机或…...