学习前端第三十一天(JSON方法,toJSON;递归)

一、JSON方法

1.将对象转换为字符串

JavaScript 提供了如下方法:

  • JSON.stringify 将对象转换为 JSON,得到的json字符串是一个被称为 JSON 编码 或 字符串化(stringified) 的对象
  • JSON.parse 将 JSON 转换回对象。

字符串使用双引号。JSON 中没有单引号或反引号。

对象属性名称也是双引号的。这是强制性的。所以 age:20 被转换成 "age":20。

下面的会被json方法跳过:函数属性(方法)。Symbol 类型的键和值。存储 undefined 的属性。

        const obj = { name: "jack", age: 20, gender: "male", [Symbol("id")]: "xc", }
        console.log(JSON.stringify(obj));//{"name":"jack","age":20,"gender":"male"}
        console.log(typeof JSON.stringify(obj));//string
        const arr = [1, 2, 3, 4, 5, undefined, function xc() { }, [Symbol("id")],]
        console.log(JSON.stringify(arr));//[1,2,3,4,5,null,null,[null]]

        console.log(JSON.stringify(true));//true
        console.log(JSON.stringify(false));//false

2.排除和转换,replacer

JSON.stringify(value[, replacer, space])

传递一个属性数组给它,那么只有这些属性会被编码。

3.格式化,space

JSON.stringify(value[, replacer, space])

 告诉 JavaScript 在多行中显示嵌套的对象,对象内部缩进 n个空格

4.解码 JSON 字符串,JSON.parse

let value = JSON.parse(str, [reviver]);

// 字符串化数组
let numbers = "[0, 1, 2, 3]";

numbers = JSON.parse(numbers);

alert( numbers[1] ); // 1

str

要解析的 JSON 字符串。

reviver

可选的函数 function(key,value),该函数将为每个 (key, value) 对调用,并可以对值进行转换。

        const obj =
            `
            [
              {
            "name": "jack",
            "age": 20,
            "gender": "male",
            "birth": "2002-02-16"
             } ,
             {
            "name": "jack",
            "age": 20,
            "gender": "male",
            "birth": "2002-02-16"
             } ,
             {
            "name": "jack",
            "age": 20,
            "gender": "male",
            "birth": "2002-02-16"
             }
            ]
             `;

        const r = JSON.parse(
            obj,
            function (k, v) {
                switch (true) {
                    case k === "age":
                        return v + "岁";
                    case k === "birth":
                        return (new Date(v)).toLocaleString();
                    default:
                        return v;
                }
            }
        );

        console.log(r);// [{…}, {…}, {…}]

 

二、递归

当一个函数解决一个任务时,在解决的过程中它可以调用很多其它函数。在部分情况下,函数会调用 自身。这就是所谓的 递归

递归将函数调用简化为一个更简单的函数调用,然后再将其简化为一个更简单的函数,以此类推,直到结果变得显而易见。

        //  递进加回归,50以内奇数相加
        function sum(n) {
            if (n === 0) return 0; // 有个确切的返回值
            return n + sum(n - 2) - 1;
        }
        console.log(sum(50));

递归遍历:

        //  递归遍历
        const num = [1, 2, ["a", "b", 3, 4, [5, 6]], 7, 8, 9]
        function mapNum(arr) {
            arr.forEach(element => {
                if (Array.isArray(element) === false) {
                    console.log(element)
                } else {
                    mapNum(element);
                }
            }
            );
        };
        mapNum(num); //1 2 a b 3 4 5 6 7 8 9

递归通用写法:

        // 递归通用写法;90%
        const nums = [1, 2, [10, 20, [3, 4], 5, 6], 7, 8];

        function sum(arr, n = 0) {    // 定义一个函数中的中间变量,且不会被重置
            arr.forEach(element => {
                if (Array.isArray(element) === false) {
                    n += element;     // 加上第一次的数字类型
                } else {
                    n += sum(element, n);   // 遇到数组类型,用前面的和加上数组类型中的和,注意中间变量
                }
            });
            return n;
        }
        console.log(sum(nums));

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/600168.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

java:递归实现的案例

//求第20个月兔子的对数 //每个月兔子对数:1,1,2,3,5,8 public class Test {//求第20个月兔子的对数//每个月兔子对数:1,1,2,3,5,8pu…

《Python编程从入门到实践》day21

# 昨日知识点回顾 设置背景颜色 在屏幕中央绘制飞船 # 今日知识点学习 12.5 重构:方法_check_events()和_update_screen() 12.5.1 方法_check_events() import sys import pygame from Settings import Settings from Ship import Shipclass AlienInvasion:"…

[Maven]IDEA报错-xxx is referencing itself

在IDEA中,执行 mvn clean时报错xxx is referencing itself。 解决方案:https://stackoverflow.com/questions/64246267/maven-error-using-intellij-is-referencing-itself 具体做法:采用上图第二条,将父模块pom文件中的对子模块…

练习题(2024/5/7)

1验证二叉搜索树 给你一个二叉树的根节点 root ,判断其是否是一个有效的二叉搜索树。 有效 二叉搜索树定义如下: 节点的左 子树 只包含 小于 当前节点的数。节点的右子树只包含 大于 当前节点的数。所有左子树和右子树自身必须也是二叉搜索树。 示例 …

JSP企业快信系统的设计与实现参考论文(论文 + 源码)

【免费】JSP企业快信系统.zip资源-CSDN文库https://download.csdn.net/download/JW_559/89277688 JSP企业快信系统的设计与实现 摘 要 计算机网络的出现到现在已经经历了翻天覆地的重大改变。因特网也从最早的供科学家交流心得的简单的文本浏览器发展成为了商务和信息的中心…

深入理解Java虚拟机(JVM)

引言: Java虚拟机(JVM)是Java平台的核心组件,它负责将Java字节码转换成平台特定的机器指令,并在相应的硬件和操作系统上执行。JVM的引入使得Java语言具有“一次编写,到处运行”的跨平台特性。本文将深入探…

【练习2】

1.汽水瓶 ps:注意涉及多个输入&#xff0c;我就说怎么老不对&#xff0c;无语~ #include <cmath> #include <iostream> using namespace std;int main() {int n;int num,flag,kp,temp;while (cin>>n) {flag1;num0;temp0;kpn;while (flag1) {if(kp<2){if(…

初识C++ · 类和对象(下)

目录 1 再谈构造函数 2 类中的隐式类型转换 3 Static成员 4 友元和内部类 5 匿名对象 6 编译器的一些优化 1 再谈构造函数 先看一段代码&#xff1a; class Date { public :Date(int year, int month, int day){_year year;_month month;_day day;} private:int _ye…

Redis线程模型

文章目录 &#x1f496; Redis 单线程模型⭐ 单线程监听大量的客户端连接⭐ Redis 6.0 之前为什么不用多线程&#xff1f; &#x1f496; Redis多线程⭐ Redis 后台线程⭐ Redis 网络IO多线程 对于读写命令来说&#xff0c;Redis 一直是单线程模型。不过&#xff0c;在 Redis 4…

TinyXML-2介绍

1.简介 TinyXML-2 是一个简单、小巧的 C XML 解析库&#xff0c;它是 TinyXML 的一个改进版本&#xff0c;专注于易用性和性能。TinyXML-2 用于读取、修改和创建 XML 文档。它不依赖于外部库&#xff0c;并且可以很容易地集成到项目中。 tinyXML-2 的主要特点包括&#xff1a…

华为:三层交换机与路由器连通上网实验

三层交换机是一种网络交换机&#xff0c;可以实现基于IP地址的高效数据转发和路由功能&#xff0c;通常用于大型企业、数据中心和校园网络等场景。此外&#xff0c;三层交换机还支持多种路由协议&#xff08;如OSPF、BGP等&#xff09;&#xff0c;以实现更为复杂的网络拓扑结构…

automa警惕通过点击元素打开新的标签页,因为你可能会被他蒙蔽!

大家好&#xff0c;我是大胡子&#xff0c;专注于研究RPA实战与解决方案。 我们经常用到automa里面的【点击元素】组件&#xff0c;但要警惕通过点击元素打开新的标签页&#xff0c;例如下面这个场景&#xff0c;点击公众号的图文消息&#xff0c;之后&#xff0c;要自动输入标…

python环境下labelImg图片标注工具的使用

labelimg GitHub地址 python环境下labelImg图片标注工具的使用 1. 写在开头2. 如何使用2.1安装2.2 启动2.2.1 先启动后设置标注的目录2.2.2 指定标注的目录和预设置的标签 2.3 设置自动保存和显示类别。2.4 保存文件类型2.5 [快捷键](https://github.com/HumanSignal/labelImg…

【数据结构】C/C++ 带头双向循环链表保姆级教程(图例详解!!)

目录 一、前言 二、链表的分类 &#x1f95d;单链表 &#x1f95d;双链表 &#x1f95d;循环链表 &#x1f95d;带头双向循环链表 &#x1f34d;头节点&#xff08;哨兵位&#xff09;的作用 ✨定义&#xff1a; ✨作用&#xff1a; &#x1f347;总结 三、带头双向循环链表 …

技术速递|使用 .NET 为 Microsoft AI 构建可扩展网关

作者&#xff1a;Kara Saucerman 排版&#xff1a;Alan Wang Microsoft AI 团队构建了全面的内容、服务、平台和技术&#xff0c;以便消费者在任何设备上、任何地方获取他们想要的信息&#xff0c;并为企业改善客户和员工的体验。我们的团队支持多种体验&#xff0c;包括 Bing、…

通过氧气退火增强β-Ga₂O₃二极管.中国科技大学和河北半导体研究所的研究人员在这一特定领域取得了最新重大进展

上图所示&#xff1a;&#xff08;a&#xff09;增加台面有助于提高β-Ga2O3肖特基势垒二极管的阻断电压&#xff08;b&#xff09;。 氧气退火和自对准台面终端使β-Ga2O3二极管进一步走向商业化。 虽然β-Ga2O3电力电子技术已经取得了长足的进步&#xff0c;但仍然存在挑战&…

.双链表.

题目&#xff1a; 实现一个双链表&#xff0c;双链表初始为空&#xff0c;支持 55 种操作&#xff1a; 在最左侧插入一个数&#xff1b;在最右侧插入一个数&#xff1b;将第 k&#x1d458; 个插入的数删除&#xff1b;在第 k&#x1d458; 个插入的数左侧插入一个数&#xf…

Redis(Redis配置和订阅发布)

文章目录 1.Redis配置1.网络配置1.配置文件位置 /etc/redis.conf2.bind&#xff08;注销支持远程访问&#xff09;1.默认情况bind 127.0.0.1 只能接受本机的访问2.首先编辑配置文件3.进入命令模式输入/bind定位&#xff0c;输入n查找下一个&#xff0c;shift n查找上一个&…

书生·浦语大模型实战营之XTuner多模态训练与测试

书生浦语大模型实战营之XTuner多模态训练与测试 目录 XTuner多模态训练与测试给LLM装上电子眼&#xff1a;多模态LLM原理简介文本单模态文本图像多模态 电子眼&#xff1a;LLaVA方案简介LLaVA训练阶段示意图LLaVA测试阶段示意图 项目实践环境准备XTuner安装概述Pretrain阶段Fi…

NVIDIA_SMI has failed because it couldn’t communicate with the NVIDIA driver

参考&#xff1a;https://www.zhihu.com/question/474222642/answer/3127013936 https://blog.csdn.net/ZhouDevin/article/details/128265656 nvidia-smi查看报错&#xff0c;nvcc正常 1&#xff09;查看nvidia版本 ls /usr/src | grep nvidia nvidia-550.78 2&#xff09;…