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.pswp.cn/news/247698.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/247698.shtml
英文地址,請注明出處:http://en.pswp.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…