JSON.parse和JSON.stringify方法

JSON.parse()

JSON.parse()方法将json字符串转化为Javascript值或对象。

语法

JSON.parse(text[,reviver])

参数

text:要被解析成Javascript值的字符串
reviver:若是一个函数则规定了原始值(text)如何被解析改造,在被返回前。

示例

JSON.parse('{}');              // {}
JSON.parse('true');            // true
JSON.parse('"foo"');           // "foo"
JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
JSON.parse('null');            // null

使用reviver函数(解析值本身以及它所包含的所有属性,会按照一定的顺序:从最最里层的属性开始一级级往外,最终到达顶层,也就是解析值本身分别的去调用reviver函数)

JSON.parse('{"p":5,"":100}',function(k,v){if(k === "") return v;return v*2;
})
返回:{p:10,"":100}//从这个例子可以看出遍历是从内往外的。
JSON.parse('{"1":1,"2":2,"3":{"4":4,"5":{"6":6}}}',function(k,v){console.log(k); //输出当前的属性名,从而得知遍历顺序是从内向外的,最后一个属性名会是个空字符串。return v;  //返回原始属性值,相当于没有传递reviver参数。
})
返回:1 2 4 6 5 3 ""

JSON.stringify()

JSON.stringify() 方法将一个JavaScript值转换为一个JSON字符串,如果指定了一个replacer函数,则可以替换值,或者如果指定了一个replacer数组,可选的仅包括指定的属性.

语法

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

参数

value:将要序列化成 一个JSON字符串的值
replacer:如果该参数是一个函数,则在序列化过程中,被序列化的值的每个属性都会经过该函数的转换和处理;如果该参数是一个数组,则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中;如果该参数为null或者未提供,则对象所有的属性都会被序列化;
space:指定缩进用的空白字符串,用于美化输出(pretty-print);如果参数是个数字,它代表有多少的空格;上限为10。该值若小于1,则意味着没有空格;如果该参数为字符串(字符串的前十个字母),该字符串将被作为空格;如果该参数没有提供(或者为null)将没有空格。

描述

关于序列化,有下面五点注意事项:

1.非数组对象的属性不能保证以特定的顺序出现在序列化后的字符串中。
2.布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值。
3.undefined、任意的函数以及 symbol 值,在序列化过程中会被忽略(出现在非数组对象的属性值中时)或者被转换成 null(出现在数组中时)。
4.所有以 symbol 为属性键的属性都会被完全忽略掉,即便 replacer 参数中强制指定包含了它们。
5.不可枚举的属性会被忽略

JSON.stringify({});                        // '{}'
JSON.stringify(true);                      // 'true'
JSON.stringify("foo");                     // '"foo"'
JSON.stringify([1, "false", false]);       // '[1,"false",false]'
JSON.stringify({ x: 5 });                  // '{"x":5}'JSON.stringify({x: 5, y: 6});              
// "{"x":5,"y":6}"JSON.stringify([new Number(1), new String("false"), new Boolean(false)]); 
// '[1,"false",false]'JSON.stringify({x: undefined, y: Object, z: Symbol("")}); 
// '{}'JSON.stringify([undefined, Object, Symbol("")]);          
// '[null,null,null]' JSON.stringify({[Symbol("foo")]: "foo"});                 
// '{}'JSON.stringify({[Symbol.for("foo")]: "foo"}, [Symbol.for("foo")]);
// '{}'JSON.stringify({[Symbol.for("foo")]: "foo"}, function (k, v) {if (typeof k === "symbol"){return "a symbol";}}
);// undefined // 不可枚举的属性默认会被忽略:
JSON.stringify( Object.create(null, { x: { value: 'x', enumerable: false }, y: { value: 'y', enumerable: true } })
);// "{"y":"y"}"

replacer参数

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字符串的属性名
JSON.stringify(foo,["model","transport"]);
返回: '{"model":"box","transport":"car"}';



本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/247698.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

java面向对象:异常处理 —(18)

1. 异常的体系结构 java.lang.Throwable |-----java.lang.Error:一般不编写针对性的代码进行处理。|-----java.lang.Exception:可以进行异常的处理|------编译时异常(checked)|-----IOException|-----FileNotFoundException|-----ClassNotFoundException|------运行时异常(un…

vue请求简单配置

简单记录一下vue的http请求配置相关 测试环境请求接口设置:   1. config/dev.env.js添加:     module.exports merge(prodEnv, {       NODE_ENV: "development",       API_ROOT: "http://", //配置http请求头     })…

【vue报错】——listen EADDRINUSE :::8080 解决方案

问题原因: 此项错误表示 8080 端口被占用 解决方案一: 打开cmd 输入:netstat -ano 查看所有端口信息,如图,找到端口 8081,以及对应的 PID 输入:tskill PID 即可杀死进程 解决方案二&#xff1a…

记录_20190626

java.lang.ArithmeticException: Non-terminating decimal expansion; no exact representable decimal result异常的解决方法 原来JAVA中如果用BigDecimal做除法的时候一定要在divide方法中传递第二个参数,定义精确到小数点后几位,否则在不整除的情况下…

String与Array

public class Api {Testpublic void StringApi(){// equals() 判断内容是否相同区分大小写// equalsIgnoreCase() 判断内容是否相同不区分大小写// length() 获取长度// charAt(int index) 获取某个索引位置的字…

HTML与CSS布局技巧总结

很多人对CSS的布局有困惑,实际的应用场景中由于布局种类多难以选择。今天我花些时间总结下自己对CSS布局的理解,分析下了解各种布局的优劣,同时希望能分享给初入前端的朋友们一些在布局上的经验,如果有那些地方总结的不好&#xf…

当谈论迭代器时,我谈些什么?

花下猫语:之前说过,我对于编程语言跟其它学科的融合非常感兴趣,但我还说漏了一点,就是我对于 Python 跟其它编程语言的对比学习,也很感兴趣。所以,我一直希望能聚集一些有其它语言基础的同学,一…

在Vue-cli项目中使用echarts

该示例使用 vue-cli 脚手架搭建 安装echarts依赖 npm install echarts -S11 或者使用国内的淘宝镜像: 安装 npm install -g cnpm --registryhttps://registry.npm.taobao.org11 使用 cnpm install echarts -S11 创建图表 全局引入 main.js // 引入echarts im…

Java的模板文件配置

Java的Mappers文件配置 <?xml version"1.0" encoding"UTF-8" ?><!DOCTYPE mapperPUBLIC "-//mybatis.org//DTD Mapper 3.0//EN""http://mybatis.org/dtd/mybatis-3-mapper.dtd"> <mapper namespace"com.qfedu.…

Python爬虫学习二

1、selenium自动测试工具 2、主要使用selenium的目的是跳过登录验证3、下载驱动器下载请求库from selenium import webdriver import time#1、 直接在script文件夹中找驱动 driverwebdriver.Chrome() time.sleep(5) driver.close()#2、找到驱动路径 #webdriver.Chrome(rD:\Pyth…

通过GitHub Pages创建个人主页

登陆github,创建新仓库&#xff0c;写入名字, 这里要以github.io做后缀, 不然创建出来的不是GitHub Pages 打开终端, cd到自己想要的文件夹后clone到本地 git clone https://github.com/username/username.github.io 进入这个项目文件夹 cd username.github.io 把写好HTML项目拷…

Spring IOC 配置文件模板

基于XML的普通设置 <?xml version1.0 encodingUTF-8 ?> <beans xmlns"http://www.springframework.org/schema/beans"xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xmlns:context"http://www.springframework.org/schema/contex…

validate+jquery+ajax表单验证

1.案例 1.1 Html form表单内容 <form class"cForm" id"cForm" method"post" action""> <p> <label for"user">用户名</label> <input id"user" name"user" required minlen…

Html5做webapp中界面适配的问题总结

做一款软件首先是要做出相应的界面&#xff0c;然而对于手机软件开发者来说&#xff0c;大小各异的手机屏幕却给我们带来了不少的麻烦。HTML5技术在大家的心中要比传统的Android/iOS/wp简单的多&#xff0c;因为它的适配性和平台跨越方面比较出色。在外看来却不是那样的&#x…

设置Maven下载镜像源(直接替换其中的 settings.xml 内容即可)

<?xml version"1.0" encoding"UTF-8"?> <settings xmlns"http://maven.apache.org/SETTINGS/1.0.0"xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation"http://maven.apache.org/SETTINGS/1.0.…

P1576 最小花费

----------------------------------- 这道题就是图论最短路&#xff0c;但是我们要改一下一些细节 比如说&#xff0c;因为这是算汇率&#xff0c;我们的初始化就要是0 我们还要改一改松弛操作 ----------------------------------- 还有&#xff0c;题目上给的是汇率&#xf…

css hack技术整理

做前端多年&#xff0c;虽然不是经常需要hack&#xff0c;但是我们经常会遇到各浏览器表现不一致的情况。基于此&#xff0c;某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现。我个人是不太推荐使用hack的&#xff0c;要知道一名好的前端&#xff0c;…

Hanoi双塔问题

Hanoi双塔问题 题目描述 给定A,B,C三根足够长的细柱&#xff0c;在A柱上放有2n个中间有空的圆盘&#xff0c;共有n个不同的尺寸&#xff0c;每个尺寸都有两个相同的圆盘&#xff0c;注意这两个圆盘是不加区分的(下图为n3的情形&#xff09;。现要将 这些国盘移到C柱上&#xff…

vue中config/index.js:配置的详细理解

当我们需要和后台分离部署的时候&#xff0c;必须配置config/index.js: 用vue-cli 自动构建的目录里面 &#xff08;环境变量及其基本变量的配置&#xff09; 123456789101112131415var path require(path)module.exports {build: {index: path.resolve(__dirname, dist/ind…

uni-app吸顶固定样式

<template><view class"full"><view class"sticky-box"><!-- 搜索 --><uni-search-bar class"unisearchbar" radius"5" placeholder"请输入搜索关键词" clearButton"auto" bgColor&qu…