JS系列之JSON

Miracle_lihb 发布于2019-08-23 13:12 / 2654人阅读

摘要：用于转换结果的函数或数组。作为函数，它有两个参数，键值都会被序列化。如果返回一个该字符串作为属性值被添加入。如果一个被序列化的对象拥有方法，那么该方法就会覆盖该对象默认的序列化行为。如果返回它接收的相同值，则不修改对应属性值。

JSON 值

JSON 值可以是：

数字（整数或浮点数）

字符串（在双引号中）

逻辑值（true 或 false）

数组（在中括号中）

对象（在大括号中）

null

JSON 文件

JSON 文件的文件类型是 ".json"
JSON 文本的 MIME 类型是 "application/json"

规则

对象和数组

属性名称必须是双引号括起来的字符串

最后一个属性后不能有逗号

数值

禁止出现前导零（ JSON.stringify 方法自动忽略前导零，而在 JSON.parse 方法中将会抛出 SyntaxError）

如果有小数点, 则后面至少跟着一位数字

字符串

字符串必须用双引号括起来

方法 JSON.stringify

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

replacer:
可选。用于转换结果的函数或数组。

var str = {"name":"haha", "age":20};

JSON.stringify(str);   // {"name":"haha","age":20}

作为函数，它有两个参数，键(key)值(value)都会被序列化。

过滤函数以对象中的每一个属性和值作为输入，返回值有以下几种情况：

如果返回一个 Number, 转换成相应的字符串被添加入JSON字符串。

如果返回一个 String, 该字符串作为属性值被添加入JSON。

如果返回一个 Boolean, "true" 或者 "false"被作为属性值被添加入JSON字符串

返回undefined表示忽略该属性

返回对象将会触发递归调用知道遇到基本类型的属性

返回无法stringify的值将会被忽略

JSON.stringify(str, function(key, val){
  console.log("key is ", key);
  console.log("val is  ", typeof(val));
  return val;
}

//======================
key is 
val is object
key is name
val is string
key is age
val is number

// {"name":"haha","age":20}

function replacer(key, value) {
  if (typeof value === "string") {
    return undefined;
  }
  return value;
}

var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
var jsonString = JSON.stringify(foo, replacer); 
// {"week":45,"month":7}

如果 replacer 是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。

JSON.stringify(str, ["name", "haha", "kk"]);

// {"name":"haha"}

space:
可选，文本添加缩进、空格和换行符，如果 space 是一个数字，则返回值文本在每个级别缩进指定数目的空格，如果 space 大于 10，则文本缩进 10 个空格。space 也可以使用非数字，如：t。

JSON.stringify(str, null, 4);

//
{
    "name": "haha",
    "age": 20
}

toJSON()

如果一个被序列化的对象拥有 toJSON 方法，那么该 toJSON 方法就会覆盖该对象默认的序列化行为。

var data = {
  name:"niuzai",
  info:{
    age:18,
    sex:"male"
  },
  toJSON:function(){
    return "by toJSON";
  }
};

JSON.stringify(data);
//""by toJSON"";

JSON.parse()

JSON.parse(text[, reviver])

reviver:
可选，一个函数，它用来转换已经被从text字符串转为对象的对象，规则如下:

如果reviver返回一个有效值，则对应的属性值将替换为转换后的值。

如果reviver返回它接收的相同值，则不修改对应属性值。

如果reviver返回undefined，则删除对应的属性

function reviver(key,value){
  if(key=="webName"){
    return "antzone";
  }
  return value;
}
var jsonStr="{"webName":"蚂蚁部落","url":"softwhy.com","age":"2"}";
var obj=JSON.parse(jsonStr,reviver);
console.log(obj);

//
{
    age: "2",
    url: "softwhy.com",
    webName: "antzone"
}

云服务器 GPU云服务器系列之系列之二架构之坑系列 js+json

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/99289.html

【从零入门系列-5】Spring Boot 之前端展示

摘要：务必在之前引入最新的核心文件为了偷懒，我们这里引入的第三方库文件都是采用的方式，也可以选择把库下载到本地然后再引用。文章系列【从零入门系列-0】Spring Boot 之 Hello World 【从零入门系列-1】Spring Boot 之程序结构设计说明【从零入门系列-2】Spring Boot 之数据库实体类【从零入门系列-3】Spring Boot 之数据库操作...

freewolf 2019-08-02 16:18 评论0 收藏0
【从零入门系列-5】Spring Boot 之前端展示

摘要：务必在之前引入最新的核心文件为了偷懒，我们这里引入的第三方库文件都是采用的方式，也可以选择把库下载到本地然后再引用。文章系列【从零入门系列-0】Spring Boot 之 Hello World 【从零入门系列-1】Spring Boot 之程序结构设计说明【从零入门系列-2】Spring Boot 之数据库实体类【从零入门系列-3】Spring Boot 之数据库操作...

Mr_houzi 2019-08-26 13:48 评论0 收藏0
JavaScript系列--浅析JavaScript解析赋值、浅拷贝和深拷贝的区别

摘要：它将返回目标对象。有些文章说是深拷贝，其实这是不正确的。深拷贝相比于浅拷贝速度较慢并且花销较大。拷贝前后两个对象互不影响。使用深拷贝的场景完全改变变量之后对没有任何影响，这就是深拷贝的魔力。一、赋值（Copy）赋值是将某一数值或对象赋给某个变量的过程，分为： 1、基本数据类型：赋值，赋值之后两个变量互不影响 2、引用数据类型：赋址，两个变量具有相同的引用，指向同一个对象，相互之间有...

laznrbfe 2019-08-26 13:48 评论0 收藏0
webpack系列之plugin及简单的使用

摘要：系列之及简单的使用一有什么用是核心功能，通过插件可以实现所不能完成的复杂功能，使用丰富的自定义，可以控制编译流程的每个环节，实现对的自定义功能扩展。三使用在配置文件中，向属性传入实例即可。 webpack系列之plugin及简单的使用一.plugin有什么用 plugin是webpack核心功能，通过plugin（插件）webpack可以实现loader所不能完成的复杂功能，使用p...

TesterHome 2019-08-22 16:39 评论0 收藏0
前端代码风格自动化系列（三）之Lint-staged

摘要：在我们介绍了之后，来看一个前端文件过滤的工具，代码的格式化肯定会涉及到文件系统，一般工具会首先读取文件，格式化操作之后，重新写入。在我们介绍了Husky、Commitlint之后，来看一个前端文件过滤的工具Lint-staged，代码的格式化肯定会涉及到文件系统，一般工具会首先读取文件，格式化操作之后，重新写入。对于较大型的项目，文件众多，首先遇到的就是性能问题，虽然如Eslint之...

zzir 2019-08-23 14:33 评论0 收藏0