Javascript基础巩固系列——标准库JSON对象

全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/13730736.html, 多谢,=。=~(如果对你有帮助的话请帮我点个赞啦)

重新学习JavaScript是因为当年转前端有点儿赶鸭子上架的意味,我一直在反思我的知识点总是很零散,不能在脑海中形成一个完整的体系,所以这次想通过再次学习将知识点都串联起来,结合日常开发的项目,达到温故而知新的效果。与此同时,总结一下我认为很重要但又被我遗漏的知识点~

概述

JSON格式是一种用于数据交换的文本格式,书写简单,可以由解释引擎直接处理。JSON对象是 JavaScript 的原生对象,用来处理 JSON 格式数据。

JSON对象静态方法

JSON.stringify()

  • 将一个值转为 JSON 字符串。
JSON.stringify([1, "false", false])
// '[1,"false",false]'

JSON.stringify({ name: "张三" })
// '{"name":"张三"}'

// 原始类型的字符串,转换结果会带双引号
JSON.stringify('foo') === "\"foo\"" // true
  • 如果对象的属性是undefined、函数或 XML 对象,该属性会被过滤;如果数组的成员是undefined、函数或 XML 对象,则这些值被转成null
var obj = {
  a: undefined,
  b: function () {}
};
JSON.stringify(obj) // "{}"

var arr = [undefined, function () {}];
JSON.stringify(arr) // "[null,null]"
  • 会忽略对象的不可遍历的属性。
var obj = {};
Object.defineProperties(obj, {
  'foo': {
    value: 1,
    enumerable: true
  },
  'bar': {
    value: 2,
    enumerable: false
  }
});

JSON.stringify(obj); // "{"foo":1}"
  • 可以接受一个数组作为第二个参数,指定需要转成字符串的属性(只对对象生效,对数组无用)。
var obj = {
  'prop1': 'value1',
  'prop2': 'value2',
  'prop3': 'value3'
};

var selectedProperties = ['prop1', 'prop2'];

JSON.stringify(obj, selectedProperties)
// "{"prop1":"value1","prop2":"value2"}"
  • 可以接受一个函数作为第二个参数,用来变更返回值。
function f(key, value) {
  if (typeof value === "number") {
    value = 2 * value;
  }
  return value;
}

JSON.stringify({ a: 1, b: 2 }, f)
// '{"a": 2,"b": 4}'
  • 可以接受数字(表示每个属性前面添加的空格,不超过10个)或字符串(不超过10个)作为第三个参数,增加返回的 JSON 字符串的可读性,就是格式化显示。
JSON.stringify({ p1: 1, p2: 2 }, null, 2);
/*
"{
  "p1": 1,
  "p2": 2
}"
*/

JSON.stringify({ p1:1, p2:2 }, null, '|-');
/*
"{
|-"p1": 1,
|-"p2": 2
}"
*/
  • 参数对象如果有toJSON方法,就直接使用这个方法的返回值作为参数,而忽略原对象的其他参数。
var user = {
  firstName: '三',
  lastName: '张',

  get fullName(){
    return this.lastName + this.firstName;
  },

  toJSON: function () {
    return {
      name: this.lastName + this.firstName
    };
  }
};

JSON.stringify(user)
// "{"name":"张三"}"

// 应用:将正则对象自动转为字符串
var obj = {
  reg: /foo/
};

// 不设置 toJSON 方法时
JSON.stringify(obj) // "{"reg":{}}"

// 设置 toJSON 方法时
RegExp.prototype.toJSON = RegExp.prototype.toString;
JSON.stringify(/foo/) // ""/foo/""

JSON.parse()

  • 将 JSON 字符串转换成对应的值。
JSON.parse('{}') // {}
JSON.parse('true') // true
JSON.parse('"foo"') // "foo"
JSON.parse('[1, 5, "false"]') // [1, 5, "false"]
JSON.parse('null') // null

var o = JSON.parse('{"name": "张三"}');
o.name // 张三
  • 可以接受一个函数作为第二个参数,用来变更返回值。
function f(key, value) {
  if (key === 'a') {
    return value + 10;
  }
  return value;
}

JSON.parse('{"a": 1, "b": 2}', f)
// {a: 11, b: 2}

参考资料

JavaScript 语言入门教程 :https://wangdoc.com/javascript/index.html

上一篇:数组或对象转为JSON字符换 JavaScript JSON.stringify()


下一篇:盘点常见的JSON用法