关于javascript:JavaScript和json

41次阅读

共计 4230 个字符，预计需要花费 11 分钟才能阅读完成。

JSON

​ XML 已经一度成为互联网上传输数据的事实标准。第一代 Web 服务很大水平上是以 XML 为根底的，以服务器间通信为次要特色。可是，XML 也并非没有批评者。有的人认为 XML 过于冗余和啰唆。为解决这些问题，也呈现了几种计划。不过 Web 曾经朝着它的新方向进发了。
​ 2006 年，Douglas Crockford 在国内互联网工程工作组（IETF，The Internet Engineering Task Force）制订了 JavaScript 对象简谱（JSON，JavaScript Object Notation）规范，即 RFC 4627。但实际上，JSON 早在 2001 年就开始应用了。JSON 是 JavaScript 的严格子集，利用 JavaScript 中的几种模式来示意结构化数据。Crockford 将 JSON 作为代替 XML 的一个计划提出，因为 JSON 能够间接传给 eval()而不须要创立 DOM。
​ 了解 JSON 最要害的一点是要把它当成一种数据格式，而不是编程语言。JSON 不属于 JavaScript，它们只是领有雷同的语法而已。JSON 也不是只能在 JavaScript 中应用，它是一种通用数据格式。很多语言都有解析和序列化 JSON 的内置能力。

​ 实践上用户端传输数据到服务器和服务器传输数据到用户端采纳 json 格局，json 格局就是字符串。服务器和用户端拿到 json 能够把 json 转换为 JavaScript 格局来执行，也能够把本人的 JavaScript 转换成 json 格局来传输

语法

​ JSON 语法反对三种类型的值，别离是 简略值 ， 对象 ， 数组

  • 简略值：字符串、数值、布尔值和 null 能够在 JSON 中呈现，就像在 JavaScript 中一样。非凡值 undefined 不能够。
  • 对象：第一种简单数据类型，对象示意有序键 / 值对。每个值能够是简略值，也能够是简单类型。
  • 数组：第二种简单数据类型，数组示意能够通过数值索引拜访的值的有序列表。数组的值能够是任意类型，包含简略值、对象，甚至其余数组。

留神：

​ JSON 没有变量、函数或对象实例的概念。JSON 的所有记号都只为示意结构化数据，尽管它借用了 JavaScript 的语法，然而千万不要把它跟 JavaScript 语言混同。

解析和序列化

  • Javascript 转 JSON 字符串

    let person = {
    name: "小明",
    address: [
        "China",
        "BeiJing"
    ],
    age: 18,
    birthday: "2008,9,11"
};

let json =JSON.stringify(person);// 申明 json 用来保留 JavaScript 转换成的 json 字符串

    ​ console.log(json);

    {"name":"小明","address":["China","BeiJing"],"age":18,"birthday":"2008,9,11"}

    ​ console.log(typeof json);=>string

    在给小明加个女朋友

    let person = {
    name: "小明",       // 姓名：小明
    address: [          // 地址
        "China",        // 中国
        "BeiJing"       // 北京
    ],
    age: 18,            // 年龄
    birthday: "2008,9,11",// 生日
    girlfriend: undefined// 女朋友：未定义
};

    ​ 留神：小明还没有女朋友，这里给的是undefined，而后再转换成 JSON 格局

    {"name":"小明","address":["China","BeiJing"],"age":18,"birthday":"2008,9,11"}

    会发现：啥女朋友，连个女朋友的栏位都没有了，切记：在 JavaScript 中，属性值是 undefined，转换成 JSON 格局会生效，如果必须给undefined 这个值，那么必须用 字符串的 undefined

  • JOSN 字符串转 JavaScript
let person = {
    name: "小明",       // 姓名：小明
    address: [          // 地址
        "China",        // 中国
        "BeiJing"       // 北京
    ],
    age: 18,            // 年龄
    birthday: "2008,9,11",// 生日
    girlfriend: "undefined"// 女朋友：未定义
};

let json = JSON.stringify(person);
console.log(json);
let js = JSON.parse(json);
console.log(js);

这里的 json

{"name":"小明","address":["China","BeiJing"],"age":18,"birthday":"2008,9,11","girlfriend":"undefined"}

json 转换为 JavaScript

{
  name: '小明',
  address: ['China', 'BeiJing'],
  age: 18,
  birthday: '2008,9,11',
  girlfriend: 'undefined'
}

变成一个对象，字符串的 undefined方才说过，想要 undefined 就先用字符串，后续通过一些操作转换为，正真的 undefined 值

转换 undefined

​ 如果传输的数据用的是 json 格局，json 最终都是转换成 JavaScript 来运行的，如果想在数据中有 undefined 这个值，那么必须用字符串的 undefined。

{"name":"小明","address":["China","BeiJing"],"age":18,"birthday":"2008,9,11","girlfriend":"undefined"}

​ 这条 json 数据转换成 JavaScript 格局的代码来运行，就会发现属性值外面的 undefined 是一个字符串，与冀望的 undefined 类型的 undefined 值不合乎。

{
  name: '小明',
  address: ['China', 'BeiJing'],
  age: 18,
  birthday: '2008,9,11',
  girlfriend: 'undefined'
}

​ 略微复杂化一点 json 数据转换成的 JavaScript 代码，例如是这样的

let obj = {
    name: "小明",       // 姓名：小明
    address: [          // 地址
        "China",        // 中国
        "BeiJing"       // 北京
    ],
    age: 18,            // 年龄
    birthday: "2008,9,11",// 生日
    girlfriend: "undefined",// 女朋友：未定义
    obj: {
        a: 'undefined',
        b: {
            a: "undefined",
            c: {
                a: 'undefined',
                d: {
                    a: 'undefined',
                    b: 12471234,
                    c: function () {console.log(777);
                    }
                }
            }
        }
    }
};

这么简单的数据，如果手动一条一条批改外部的字符串的 undefined 显得很不迷信，能够手动写一个函数来转换

function conversion(obj) {let target = {};// 创立一个空对象

    let keys = Object.keys(obj);// 对象属性名的数组

    for (const key of keys) {// 遍历这个数组

        // 给空对象增加属性名和属性值
        target[key] = obj[key];

        // 判断这里如果是字符串的 undefined，那么就转换为 undefined 类型的 undefined
        if (obj[key] === 'undefined') target[key] = undefined;//-- 敞开正文就扭转原对象  obj[key]=undefined

        // 如果判断属性值是一个对象，那么传入这个属性值对象
        if (typeof obj[key] === "object") conversion(obj[key]);
    }

    // 返回这个空对象
    return target;
}

这里是不扭转原对象，如果原对象还有其余用，怕造成不必要的麻烦，如果想扭转原对象只有关上一条正文就能够。

​ 这里能够测试，把方才的小明传入

let myobj = conversion(obj);

​ json 数据中想传 undefined，能够改成字符串前面交给 JavaScript 解决，JavaScript 想把数据转换成 json 格局要小心外部的 undefined，也能够通过下面的例子，做一个相同的函数，先把 JavaScript 中的 undefined 转换成字符串的 undefined，也就是把下面的字符串的 undefined 改成 undefined 值，转换函数只是把判断扭转一下，如果是 undefined 值就转换成字符串

let obj = {
    name: "小明",       // 姓名：小明
    address: [          // 地址
        "China",        // 中国
        "BeiJing"       // 北京
    ],
    age: 18,            // 年龄
    birthday: "2008,9,11",// 生日
    girlfriend: undefined,// 女朋友：未定义
    obj: {
        a: undefined,
        b: {
            a: undefined,
            c: {
                a: undefined,
                d: {
                    a: undefined,
                    b: 12471234,
                    c: function () {console.log(777);
                    }
                }
            }
        }
    }
};

function conversion(obj) {let target = {};// 创立一个空对象

    let keys = Object.keys(obj);// 对象属性名的数组

    for (const key of keys) {// 遍历这个数组

        // 给空对象增加属性名和属性值
        target[key] = obj[key];

        // 判断这里如果是 undefined，那么就转换为字符串类型的 undefined
        if (obj[key] === undefined) target[key] = 'undefined';

        // 如果判断属性值是一个对象，那么传入这个属性值对象
        if (typeof obj[key] === "object") conversion(obj[key]);
    }

    // 返回这个空对象
    return target;
}

let myobj = conversion(obj);
console.log(myobj)

如果感觉两个函数麻烦，能够把这函数的判断批改，如果是字符串的 undefined 那么就转换成 undefined 值，反之亦然，也就是一个 if-else 就能够解决的事件，然而用一个函数，如果重复转换，迟早把本人搞懵逼，不如用两个函数，用函数名字好区别本人是要干什么

正文完
javascript
发表至： javascript
2022-07-18
 0
关于javascript:Vue数据双向绑定的简易实现
ES6学习变量解构赋值
关于javascript:数组去重之新老对比法
红宝书笔记第5章引用类型