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

一、JSON方法

1.将对象转换为字符串

JavaScript 提供了如下方法:

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

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

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

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

javascript 复制代码
        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]``)``;

javascript 复制代码
// 字符串化数组
let numbers = "[0, 1, 2, 3]";

numbers = JSON.parse(numbers);

alert( numbers[1] ); // 1

str

要解析的 JSON 字符串。

reviver

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

javascript 复制代码
        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);// [{...}, {...}, {...}]

二、递归

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

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

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

递归遍历:

javascript 复制代码
        //  递归遍历
        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

递归通用写法:

javascript 复制代码
        // 递归通用写法;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));
相关推荐
for_ever_love__17 分钟前
python基础语法学习: 数据容器
windows·python·学习
云空1 小时前
《电子专业完整学习路线图(分两套:本科四年版 / 零基础自学速成版)》
科技·学习·学习方法·高考
min(a,b)1 小时前
学习第16天:LangGraph 与 Agent 工作流编排
学习
woshihuanglaoshi1 小时前
鸿蒙技术进阶全景高级成长体系:从初中级到架构师的技能树/学习路径/项目实战/认证体系系统性方法论
学习·华为·harmonyos
AI即插即用1 小时前
即插即用系列 | IEEE TMI PLG-HN:原型学习引导的 CNN-Transformer 混合网络,攻克乳腺肿瘤分割难题
人工智能·深度学习·神经网络·学习·目标检测·cnn·transformer
for_ever_love__3 小时前
python基础语法学习: 变量, 输入输出, 运算符
网络·python·学习
学习和思考3 小时前
非自动化专业如何自学PLC?我的6个月学习路线图
笔记·学习·自动化·学习方法
拾陆楼3 小时前
PT: DMSA辅助调tree报告前后级余量脚本
后端·学习
桑榆4164 小时前
JSON 格式
json
sbjdhjd5 小时前
大三网安秋招核心学习前言(AI 安全 + Web 漏洞 + 内网渗透全考点)
人工智能·网络协议·学习·安全·网络安全·开源·php