首页 > 其他分享 >43. JS解析JSON

43. JS解析JSON

时间:2022-10-11 18:33:44浏览次数:42  
标签:obj author JavaScript 43 json JSON var JS

1. 前言

JSON 全称为“JavaScript Object Notation”,是当前最流行的一种轻量级的数据交换格式,用来存储和传输数据,通常服务器端与客户端在进行交互时就是使用 JSON 格式的数据。

2. 什么是 JSON

JSON 是从 JavaScript 脚本中演变而来的,并且使用 JavaScript 中的语法来描述数据。与 XML 一样,JSON 也是一种基于文本的格式,文件扩展名为.json

目前大多数编程语言(例如 PHP、Java、.Net)都支持 JSON,JSON 中有两种基本的结构:

  • 对象:由若干键/值对(即key:value)组成的无序集合,每个对象以左花括号{开始,以右花括号}结尾,多个键/值对之间使用逗号,分隔;
  • 数组:一个有序的值列表,每个数组以左方括号[开始,以右方括号]结尾,多个值之间使用逗号,分隔。


在 JSON 中,属性名称或键都是字符串格式的(需要使用英文的双引号括起来),而值则可以是任意类型,如下所示:

{
    "course": {
        "name": "JavaScript",
        "author": "http://c.biancheng.net/",
        "year": 2021,
        "genre": "Getting Started tutorial",
        "bestseller": true
    },
    "fruits": [
        "Apple",
        "Banana",
        "Strawberry",
        "Mango"
    ]
}

3. 在 JavaScript 中解析 JSON 数据

在 JavaScript 中,您可以使用 JSON.parse() 方法来解析 JSON 数据,示例代码如下:

var json = '{"course": {"name": "JavaScript","author": "http://c.biancheng.net/","year": 2021,"genre": "Getting Started tutorial","bestseller": true},"fruits": ["Apple","Banana","Strawberry","Mango"]}';
var obj = JSON.parse(json);
console.log(obj.course);
console.log(obj.fruits);

允许结果如下图所示:

JSON.parse() 方法演示
图:JSON.parse() 方法演示

4. 解析嵌套的 JSON 数据

JSON 数据中的对象和数组可以相互嵌套,一个 JSON 对象中可以包含任意类型的数据(例如数组、嵌套数组、其它 JSON 对象等)。对于相互嵌套的 JSON 数据我们要如何获取呢?示例代码如下:

var json = `{
    "book": {
        "name": "Harry Potter and the Goblet of Fire",
        "author": "J. K. Rowling",
        "year": 2000,
        "characters": ["Harry Potter", "Hermione Granger", "Ron Weasley"],
        "genre": "Fantasy Fiction",
        "price": {
            "paperback": "$10.40", "hardcover": "$20.32", "kindle": "$4.11"
        }
    }
}`;
// 将 JSON 数据转换为 JSON 对象
var obj = JSON.parse(json);
// 打印嵌套的 JSON 数据
function printValues(obj) {
    for (var k in obj) {
        if (obj[k] instanceof Object) {
            printValues(obj[k]);
        } else {
            document.write(obj[k] + "<br>");
        };
    }
};
// 调用 printValues() 函数
printValues(obj);
document.write("<hr>");
// 打印 JSON 数据中的单个值
document.write(obj["book"]["author"] + "<br>");         // 输出: J. K. Rowling
document.write(obj["book"]["characters"][0] + "<br>");  // 输出: Harry Potter
document.write(obj["book"]["price"]["hardcover"]);      // 输出: $20.32

运行结果如下图所示:

解析嵌套的 JSON 数据
图:解析嵌套的 JSON 数据

5. 将数据转换为 JSON

在开发过程中,有时我们需要将数据转换为 JSON 格式,方便客户端与服务器端进行数据交互。JavaScript 中提供了JSON.stringify()方法来将 JavaScript 值转换为 JSON 格式,如下例所示:

var obj = {
    "name": "JavaScript",
    "author": "http://c.biancheng.net/",
    "year": 2021,
    "genre": "Getting Started tutorial",
    "bestseller": true
};
var json = JSON.stringify(obj);
document.write(json);

运行结果如下:

{"name":"JavaScript","author":"http://c.biancheng.net/","year":2021,"genre":"Getting Started tutorial","bestseller":true}

注意:虽然 JavaScript 对象与 JSON 对象看起来非常相似,但它们并不相同,例如在 JavaScript 中,对象的属性名称可以用单引号 '' 或双引号 "" 括起来,也可以完全省略引号。但是,在 JSON 中,所有属性名称都必须用双引号括起来。

标签:obj,author,JavaScript,43,json,JSON,var,JS
From: https://www.cnblogs.com/jiajunling/p/16780201.html

相关文章

  • 41. JS闭包的原理和作用
    1.前言闭包(closures)是Javascript语言的一个难点,也是它的特色,很多高级应用都是依靠闭包实现的。闭包与变量的作用域以及变量的生命周期密切相关,本节我们就来简单介绍一......
  • 困难-2435. 矩阵中和能被 K 整除的路径
    这是10月9日参加竞赛的一道题目,当时没做出来,数据量很大,对性能要求比较高执行结果:通过执行用时:220ms,在所有 JavaScript 提交中击败了100.00%的用户内存消耗:75.2M......
  • 第1章-JSP 简介
    目录什么是JSP安装配置JSP运行环境JSP页面JSP页面简介设置Web服务目录JSP运行原理JSP与JavaServlet的关系HTML与JavaScript什么是JSP★JSP是JavaServerPage的缩写,是......
  • 初识node.js[2]
    一、什么是node.jsnode.jsisajavascriptruntimebuiltonchrome'sV8JavaScriptengine.node.js是一个基于chromeV8引擎的JavaScript运行环境。官网:https://nod......
  • javabean、xml、json、map之间的相互转换
    javabean转map利用cglib的BeanMap类实现转换importorg.springframework.cglib.beans.BeanMap;/****@Title:beanToMap*@Description:javabean转map*@parambean*......
  • JS关于日期的处理
    JS格式化日期//格式化日期Date.prototype.Format=function(fmt)//author:meizzvaro={"M+":this.getMonth()+1,//月份"d+":this.getDate......
  • 40. JS调试(Debug)教程[简明版]
    1.前言在JavaScript开发过程中,代码可能存在一些语法或者逻辑上的错误,导致程序不能得到我们想要的结果,这时就需要我们找到并修复这些错误,我们将查找和修复错误的过程称......
  • 使用SheetJs导出Excel设置指定单元格格式
    vartbl=document.getElementById('sheetjs');varwb=XLSX.utils.table_to_book(tbl);varws=wb.Sheets["Sheet1"];//getthecurrentsheetconsole.log(ws......
  • 38. JS表单验证(附带示例)
    1.前言表单是Web应用(网站)的重要组成部分,通过表单可以收集用户提交的信息,例如姓名、邮箱、电话等。由于用户在填写这些信息时,有可能出现一些错误,例如输入手机号时漏掉了......
  • 39. JS动画效果的实现(附带示例)
    1.前言在学习CSS时我们知道,通过CSS可以实现简单的动画效果,但对于比较复杂的动画,使用CSS实现起来就会比较麻烦。除了可以使用CSS来实现外,也可以使用JavaScript......