（三）JavaScript 標(biāo)準(zhǔn)對(duì)象

本文是大神廖雪峰的JavaScript教程學(xué)習(xí)筆記。并不是教程推盛，如有需要葱淳，請(qǐng)前往廖雪峰大神大博客.

在JavaScript的世界里钝腺，一切都是對(duì)象。

但是某些對(duì)象還是和其他對(duì)象不太一樣赞厕。為了區(qū)分對(duì)象的類(lèi)型艳狐，我們用typeof操作符獲取對(duì)象的類(lèi)型，它總是返回一個(gè)字符串：

typeof 123; // 'number'
typeof NaN; // 'number'
typeof 'str'; // 'string'
typeof true; // 'boolean'
typeof undefined; // 'undefined'
typeof Math.abs; // 'function'
typeof null; // 'object'
typeof []; // 'object'
typeof {}; // 'object'

可見(jiàn)皿桑，number毫目、string、boolean诲侮、function和undefined有別于其他類(lèi)型镀虐。特別注意null的類(lèi)型是object，Array的類(lèi)型也是object沟绪，如果我們用typeof將無(wú)法區(qū)分出null刮便、Array和通常意義上的object——{}。

包裝對(duì)象

除了這些類(lèi)型外近零，JavaScript還提供了包裝對(duì)象，熟悉Java的小伙伴肯定很清楚int和Integer這種曖昧關(guān)系抄肖。

number久信、boolean和string都有包裝對(duì)象。沒(méi)錯(cuò)漓摩，在JavaScript中裙士，字符串也區(qū)分string類(lèi)型和它的包裝類(lèi)型。包裝對(duì)象用new創(chuàng)建：

var n = new Number(123); // 123,生成了新的包裝類(lèi)型
var b = new Boolean(true); // true,生成了新的包裝類(lèi)型
var s = new String('str'); // 'str',生成了新的包裝類(lèi)型

雖然包裝對(duì)象看上去和原來(lái)的值一模一樣管毙，顯示出來(lái)也是一模一樣腿椎，但他們的類(lèi)型已經(jīng)變?yōu)閛bject了！所以夭咬，包裝對(duì)象和原始值用===比較會(huì)返回false：

typeof new Number(123); // 'object'
new Number(123) === 123; // false

typeof new Boolean(true); // 'object'
new Boolean(true) === true; // false

typeof new String('str'); // 'object'
new String('str') === 'str'; // false

所以閑的蛋疼也不要使用包裝對(duì)象啃炸！尤其是針對(duì)string類(lèi)型！Ｗ慷妗南用！

如果我們?cè)谑褂肗umber、Boolean和String時(shí)，沒(méi)有寫(xiě)new會(huì)發(fā)生什么情況裹虫？

此時(shí)肿嘲，Number()迹缀、Boolean和String()被當(dāng)做普通函數(shù)磷雇，把任何類(lèi)型的數(shù)據(jù)轉(zhuǎn)換為number、boolean和string類(lèi)型（注意不是其包裝類(lèi)型）：

var n = Number('123'); // 123票腰，相當(dāng)于parseInt()或parseFloat()
typeof n; // 'number'

var b = Boolean('true'); // true
typeof b; // 'boolean'

var b2 = Boolean('false'); // true! 'false'字符串轉(zhuǎn)換結(jié)果為true匣屡！因?yàn)樗欠强兆址?var b3 = Boolean(''); // false

var s = String(123.45); // '123.45'
typeof s; // 'string'

是不是感覺(jué)頭大了封救？這就是JavaScript特有的催眠魅力！

總結(jié)一下耸采，有這么幾條規(guī)則需要遵守：

  • 不要使用new Number()兴泥、new Boolean()、new String()創(chuàng)建包裝對(duì)象虾宇；

  • 用parseInt()或parseFloat()來(lái)轉(zhuǎn)換任意類(lèi)型到number搓彻；

  • 用String()來(lái)轉(zhuǎn)換任意類(lèi)型到string，或者直接調(diào)用某個(gè)對(duì)象的toString()方法嘱朽；

  • 通常不必把任意類(lèi)型轉(zhuǎn)換為boolean再判斷旭贬，因?yàn)榭梢灾苯訉?xiě)if (myVar) {...}；

  • typeof操作符可以判斷出number搪泳、boolean稀轨、string、function和undefined岸军；

  • 判斷Array要使用Array.isArray(arr)奋刽；

  • 判斷null請(qǐng)使用myVar === null；

  • 判斷某個(gè)全局變量是否存在用typeof window.myVar === 'undefined'艰赞；

  • 函數(shù)內(nèi)部判斷某個(gè)變量是否存在用typeof myVar === 'undefined'佣谐。

最后有細(xì)心的同學(xué)指出，任何對(duì)象都有toString()方法嗎方妖？null和undefined就沒(méi)有狭魂！確實(shí)如此，這兩個(gè)特殊值要除外党觅，雖然null還偽裝成了object類(lèi)型雌澄。

更細(xì)心的同學(xué)指出，number對(duì)象調(diào)用toString()報(bào)SyntaxError：

123.toString(); // SyntaxError

遇到這種情況杯瞻，要特殊處理一下：

123..toString(); // '123', 注意是兩個(gè)點(diǎn)镐牺！
(123).toString(); // '123'

不要問(wèn)為什么，這就是JavaScript代碼的樂(lè)趣魁莉！

一任柜、Date

在JavaScript中卒废，Date對(duì)象用來(lái)表示日期和時(shí)間。

要獲取系統(tǒng)當(dāng)前時(shí)間宙地，用：

var now = new Date();
now; // Wed Jun 24 2015 19:49:22 GMT+0800 (CST)
now.getFullYear(); // 2015, 年份
now.getMonth(); // 5, 月份摔认，注意月份范圍是0~11，5表示六月
now.getDate(); // 24, 表示24號(hào)
now.getDay(); // 3, 表示星期三
now.getHours(); // 19, 24小時(shí)制
now.getMinutes(); // 49, 分鐘
now.getSeconds(); // 22, 秒
now.getMilliseconds(); // 875, 毫秒數(shù)
now.getTime(); // 1435146562875, 以number形式表示的時(shí)間戳

注意参袱，當(dāng)前時(shí)間是瀏覽器從本機(jī)操作系統(tǒng)獲取的時(shí)間，所以不一定準(zhǔn)確，因?yàn)橛脩?hù)可以把當(dāng)前時(shí)間設(shè)定為任何值。

如果要?jiǎng)?chuàng)建一個(gè)指定日期和時(shí)間的Date對(duì)象，可以用：

var d = new Date(2015, 5, 19, 20, 15, 30, 123);
d; // Fri Jun 19 2015 20:15:30 GMT+0800 (CST)

你可能觀(guān)察到了一個(gè)非常非常坑爹的地方，就是JavaScript的月份范圍用整數(shù)表示是0~11，0表示一月邑滨，1表示二月……诈铛，所以要表示6月恩静，我們傳入的是5循签！這絕對(duì)是JavaScript的設(shè)計(jì)者當(dāng)時(shí)腦抽了一下撒轮，但是現(xiàn)在要修復(fù)已經(jīng)不可能了。

第二種創(chuàng)建一個(gè)指定日期和時(shí)間的方法是解析一個(gè)符合ISO 8601格式的字符串：

var d = Date.parse('2015-06-24T19:49:22.875+08:00');
d; // 1435146562875

但它返回的不是Date對(duì)象，而是一個(gè)時(shí)間戳。不過(guò)有時(shí)間戳就可以很容易地把它轉(zhuǎn)換為一個(gè)Date：

var d = new Date(1435146562875);
d; // Wed Jun 24 2015 19:49:22 GMT+0800 (CST)
時(shí)區(qū)

Date對(duì)象表示的時(shí)間總是按瀏覽器所在時(shí)區(qū)顯示的，不過(guò)我們既可以顯示本地時(shí)間备蚓，也可以顯示調(diào)整后的UTC時(shí)間：

var d = new Date(1435146562875);
d.toLocaleString(); // '2015/6/24 下午7:49:22'战惊，本地時(shí)間（北京時(shí)區(qū)+8:00），顯示的字符串與操作系統(tǒng)設(shè)定的格式有關(guān)
d.toUTCString(); // 'Wed, 24 Jun 2015 11:49:22 GMT'，UTC時(shí)間傻盟，與本地時(shí)間相差8小時(shí)

那么在JavaScript中如何進(jìn)行時(shí)區(qū)轉(zhuǎn)換呢跟啤？實(shí)際上，只要我們傳遞的是一個(gè)number類(lèi)型的時(shí)間戳捉片，我們就不用關(guān)心時(shí)區(qū)轉(zhuǎn)換莹规。任何瀏覽器都可以把一個(gè)時(shí)間戳正確轉(zhuǎn)換為本地時(shí)間赔蒲。

時(shí)間戳是個(gè)什么東西？時(shí)間戳是一個(gè)自增的整數(shù)良漱，它表示從1970年1月1日零時(shí)整的GMT時(shí)區(qū)開(kāi)始的那一刻舞虱，到現(xiàn)在的毫秒數(shù)。假設(shè)瀏覽器所在電腦的時(shí)間是準(zhǔn)確的母市，那么世界上無(wú)論哪個(gè)時(shí)區(qū)的電腦矾兜，它們此刻產(chǎn)生的時(shí)間戳數(shù)字都是一樣的，所以患久，時(shí)間戳可以精確地表示一個(gè)時(shí)刻椅寺，并且與時(shí)區(qū)無(wú)關(guān)。

所以蒋失，我們只需要傳遞時(shí)間戳返帕，或者把時(shí)間戳從數(shù)據(jù)庫(kù)里讀出來(lái)，再讓JavaScript自動(dòng)轉(zhuǎn)換為當(dāng)?shù)貢r(shí)間就可以了高镐。

要獲取當(dāng)前時(shí)間戳溉旋，可以用：

if (Date.now) {
    alert(Date.now()); // 老版本IE沒(méi)有now()方法
} else {
    alert(new Date().getTime());
}

二畸冲、RegExp

字符串是編程時(shí)涉及到的最多的一種數(shù)據(jù)結(jié)構(gòu)嫉髓，對(duì)字符串進(jìn)行操作的需求幾乎無(wú)處不在观腊。比如判斷一個(gè)字符串是否是合法的Email地址，雖然可以編程提取@前后的子串算行，再分別判斷是否是單詞和域名梧油，但這樣做不但麻煩，而且代碼難以復(fù)用州邢。

正則表達(dá)式是一種用來(lái)匹配字符串的強(qiáng)有力的武器儡陨。它的設(shè)計(jì)思想是用一種描述性的語(yǔ)言來(lái)給字符串定義一個(gè)規(guī)則，凡是符合規(guī)則的字符串量淌，我們就認(rèn)為它“匹配”了骗村，否則，該字符串就是不合法的呀枢。

所以我們判斷一個(gè)字符串是否是合法的Email的方法是：

1胚股、創(chuàng)建一個(gè)匹配Email的正則表達(dá)式；

2裙秋、用該正則表達(dá)式去匹配用戶(hù)的輸入來(lái)判斷是否合法琅拌。

因?yàn)檎齽t表達(dá)式也是用字符串表示的，所以摘刑，我們要首先了解如何用字符來(lái)描述字符进宝。

在正則表達(dá)式中，如果直接給出字符枷恕，就是精確匹配党晋。用\d可以匹配一個(gè)數(shù)字，\w可以匹配一個(gè)字母或數(shù)字徐块，所以：

  • '00\d'可以匹配'007'隶校，但無(wú)法匹配'00A'；

  • '\d\d\d'可以匹配'010'蛹锰；

  • '\w\w'可以匹配'js'深胳；

.可以匹配任意字符，所以：

  • 'js.'可以匹配'tsp'铜犬、'jss'舞终、'js!'等等。

要匹配變長(zhǎng)的字符癣猾，在正則表達(dá)式中敛劝，用*表示任意個(gè)字符（包括0個(gè)），用+表示至少一個(gè)字符纷宇，用?表示0個(gè)或1個(gè)字符夸盟，用{n}表示n個(gè)字符，用{n,m}表示n-m個(gè)字符：

來(lái)看一個(gè)復(fù)雜的例子：\d{3}\s+\d{3,8}像捶。

我們來(lái)從左到右解讀一下：

  1. \d{3}表示匹配3個(gè)數(shù)字上陕，例如'010'桩砰；
  2. \s可以匹配一個(gè)空格（也包括Tab等空白符），所以\s+表示至少有一個(gè)空格释簿，例如匹配' '亚隅，'\t\t'等；
  3. \d{3,8}表示3-8個(gè)數(shù)字庶溶，例如'1234567'煮纵。

綜合起來(lái)，上面的正則表達(dá)式可以匹配以任意個(gè)空格隔開(kāi)的帶區(qū)號(hào)的電話(huà)號(hào)碼偏螺。

如果要匹配'010-12345'這樣的號(hào)碼呢行疏？由于'-'是特殊字符，在正則表達(dá)式中套像，要用'\'轉(zhuǎn)義隘擎，所以，上面的正則是\d{3}\-\d{3,8}凉夯。

但是货葬，仍然無(wú)法匹配'010 - 12345'，因?yàn)閹в锌崭窬⒐弧Ｋ晕覀冃枰鼜?fù)雜的匹配方式震桶。

進(jìn)階

要做更精確地匹配，可以用[]表示范圍征绎，比如：

  • [0-9a-zA-Z\_]可以匹配一個(gè)數(shù)字蹲姐、字母或者下劃線(xiàn)；

  • [0-9a-zA-Z\_]+可以匹配至少由一個(gè)數(shù)字人柿、字母或者下劃線(xiàn)組成的字符串柴墩，比如'a100'，'0_Z'凫岖，'js2015'等等江咳；

  • [a-zA-Z\_\$][0-9a-zA-Z\_\$]*可以匹配由字母或下劃線(xiàn)、$開(kāi)頭哥放，后接任意個(gè)由一個(gè)數(shù)字歼指、字母或者下劃線(xiàn)、$組成的字符串甥雕，也就是JavaScript允許的變量名踩身；

  • [a-zA-Z\_\$][0-9a-zA-Z\_\$]{0, 19}更精確地限制了變量的長(zhǎng)度是1-20個(gè)字符（前面1個(gè)字符+后面最多19個(gè)字符）。

A|B可以匹配A或B社露，所以(J|j)ava(S|s)script可以匹配'JavaScript'挟阻、'Javascript'、'javaScript'或者'javascript'。

^表示行的開(kāi)頭附鸽，^\d表示必須以數(shù)字開(kāi)頭脱拼。

$表示行的結(jié)束，\d$表示必須以數(shù)字結(jié)束拒炎。

你可能注意到了，js也可以匹配'jsp'挨务，但是加上^js$就變成了整行匹配击你，就只能匹配'js'了。

RegExp

有了準(zhǔn)備知識(shí)谎柄，我們就可以在JavaScript中使用正則表達(dá)式了丁侄。

JavaScript有兩種方式創(chuàng)建一個(gè)正則表達(dá)式：

第一種方式是直接通過(guò)/正則表達(dá)式/寫(xiě)出來(lái)，第二種方式是通過(guò)new RegExp('正則表達(dá)式')創(chuàng)建一個(gè)RegExp對(duì)象朝巫。

兩種寫(xiě)法是一樣的：

var re1 = /ABC\-001/;
var re2 = new RegExp('ABC\\-001');

re1; // /ABC\-001/
re2; // /ABC\-001/

注意鸿摇，如果使用第二種寫(xiě)法，因?yàn)樽址霓D(zhuǎn)義問(wèn)題劈猿，字符串的兩個(gè)\實(shí)際上是一個(gè)\拙吉。

先看看如何判斷正則表達(dá)式是否匹配：

var re = /^\d{3}\-\d{3,8}$/;
re.test('010-12345'); // true
re.test('010-1234x'); // false
re.test('010 12345'); // false

RegExp對(duì)象的test()方法用于測(cè)試給定的字符串是否符合條件。

切分字符串

用正則表達(dá)式切分字符串比用固定的字符更靈活揪荣，請(qǐng)看正常的切分代碼：

'a b   c'.split(' '); // ['a', 'b', '', '', 'c']

嗯筷黔，無(wú)法識(shí)別連續(xù)的空格，用正則表達(dá)式試試：

'a b   c'.split(/\s+/); // ['a', 'b', 'c']

無(wú)論多少個(gè)空格都可以正常分割仗颈。加入,試試：

'a,b, c  d'.split(/[\s\,]+/); // ['a', 'b', 'c', 'd']

再加入;試試：

'a,b;; c d'.split(/[\s,;]+/); // ['a', 'b', 'c', 'd']
如果用戶(hù)輸入了一組標(biāo)簽佛舱，下次記得用正則表達(dá)式來(lái)把不規(guī)范的輸入轉(zhuǎn)化成正確的數(shù)組。

分組

除了簡(jiǎn)單地判斷是否匹配之外挨决，正則表達(dá)式還有提取子串的強(qiáng)大功能请祖。用()表示的就是要提取的分組（Group）。比如：

^(\d{3})-(\d{3,8})$分別定義了兩個(gè)組脖祈，可以直接從匹配的字符串中提取出區(qū)號(hào)和本地號(hào)碼：

var re = /^(\d{3})-(\d{3,8})$/;
re.exec('010-12345'); // ['010-12345', '010', '12345']
re.exec('010 12345'); // null

如果正則表達(dá)式中定義了組肆捕，就可以在RegExp對(duì)象上用exec()方法提取出子串來(lái)。

exec()方法在匹配成功后盖高，會(huì)返回一個(gè)Array福压，第一個(gè)元素是正則表達(dá)式匹配到的整個(gè)字符串，后面的字符串表示匹配成功的子串或舞。

exec()方法在匹配失敗時(shí)返回null荆姆。

提取子串非常有用。來(lái)看一個(gè)更兇殘的例子：

var re = /^(0[0-9]|1[0-9]|2[0-3]|[0-9])\:(0[0-9]|1[0-9]|2[0-9]|3[0-9]|4[0-9]|5[0-9]|[0-9])\:(0[0-9]|1[0-9]|2[0-9]|3[0-9]|4[0-9]|5[0-9]|[0-9])$/;
re.exec('19:05:30'); // ['19:05:30', '19', '05', '30']

這個(gè)正則表達(dá)式可以直接識(shí)別合法的時(shí)間映凳。但是有些時(shí)候胆筒，用正則表達(dá)式也無(wú)法做到完全驗(yàn)證，比如識(shí)別日期：

var re = /^(0[1-9]|1[0-2]|[0-9])-(0[1-9]|1[0-9]|2[0-9]|3[0-1]|[0-9])$/;

對(duì)于'2-30'，'4-31'這樣的非法日期仆救，用正則還是識(shí)別不了抒和，或者說(shuō)寫(xiě)出來(lái)非常困難，這時(shí)就需要程序配合識(shí)別了彤蔽。

貪婪匹配

需要特別指出的是摧莽，正則匹配默認(rèn)是貪婪匹配，也就是匹配盡可能多的字符顿痪。舉例如下镊辕，匹配出數(shù)字后面的0：

var re = /^(\d+)(0*)$/;
re.exec('102300'); // ['102300', '102300', '']

由于\d+采用貪婪匹配，直接把后面的0全部匹配了蚁袭，結(jié)果0*只能匹配空字符串了征懈。

必須讓\d+采用非貪婪匹配（也就是盡可能少匹配），才能把后面的0匹配出來(lái)揩悄，加個(gè)?就可以讓\d+采用非貪婪匹配：

var re = /^(\d+?)(0*)$/;
re.exec('102300'); // ['102300', '1023', '00']

全局搜索

JavaScript的正則表達(dá)式還有幾個(gè)特殊的標(biāo)志卖哎，最常用的是g，表示全局匹配：

var r1 = /test/g;
// 等價(jià)于:
var r2 = new RegExp('test', 'g');

全局匹配可以多次執(zhí)行exec()方法來(lái)搜索一個(gè)匹配的字符串删性。當(dāng)我們指定g標(biāo)志后亏娜，每次運(yùn)行exec()，正則表達(dá)式本身會(huì)更新lastIndex屬性蹬挺，表示上次匹配到的最后索引：

var s = 'JavaScript, VBScript, JScript and ECMAScript';
var re=/[a-zA-Z]+Script/g;

// 使用全局匹配:
re.exec(s); // ['JavaScript']
re.lastIndex; // 10

re.exec(s); // ['VBScript']
re.lastIndex; // 20

re.exec(s); // ['JScript']
re.lastIndex; // 29

re.exec(s); // ['ECMAScript']
re.lastIndex; // 44

re.exec(s); // null照藻，直到結(jié)束仍沒(méi)有匹配到

全局匹配類(lèi)似搜索，因此不能使用/^...$/汗侵，那樣只會(huì)最多匹配一次幸缕。

正則表達(dá)式還可以指定i標(biāo)志，表示忽略大小寫(xiě)晰韵，m標(biāo)志发乔，表示執(zhí)行多行匹配。

三雪猪、JSON

JSON是JavaScript Object Notation的縮寫(xiě)栏尚，它是一種數(shù)據(jù)交換格式。

在JSON出現(xiàn)之前只恨，大家一直用XML來(lái)傳遞數(shù)據(jù)译仗。因?yàn)閄ML是一種純文本格式，所以它適合在網(wǎng)絡(luò)上交換數(shù)據(jù)官觅。XML本身不算復(fù)雜纵菌，但是，加上DTD休涤、XSD咱圆、XPath笛辟、XSLT等一大堆復(fù)雜的規(guī)范以后，任何正常的軟件開(kāi)發(fā)人員碰到XML都會(huì)感覺(jué)頭大了序苏，最后大家發(fā)現(xiàn)手幢，即使你努力鉆研幾個(gè)月，也未必搞得清楚XML的規(guī)范忱详。

終于围来，在2002年的一天，道格拉斯·克羅克福特（Douglas Crockford）同學(xué)為了拯救深陷水深火熱同時(shí)又被某幾個(gè)巨型軟件企業(yè)長(zhǎng)期愚弄的軟件工程師匈睁，發(fā)明了JSON這種超輕量級(jí)的數(shù)據(jù)交換格式监透。

道格拉斯同學(xué)長(zhǎng)期擔(dān)任雅虎的高級(jí)架構(gòu)師，自然鐘情于JavaScript软舌。他設(shè)計(jì)的JSON實(shí)際上是JavaScript的一個(gè)子集才漆。在JSON中牛曹，一共就這么幾種數(shù)據(jù)類(lèi)型：

  • number：和JavaScript的number完全一致佛点；
  • boolean：就是JavaScript的true或false；
  • string：就是JavaScript的string黎比；
  • null：就是JavaScript的null超营；
  • array：就是JavaScript的Array表示方式——[]；
  • object：就是JavaScript的{ ... }表示方式阅虫。

以及上面的任意組合演闭。

并且，JSON還定死了字符集必須是UTF-8颓帝，表示多語(yǔ)言就沒(méi)有問(wèn)題了米碰。為了統(tǒng)一解析，JSON的字符串規(guī)定必須用雙引號(hào)""购城，Object的鍵也必須用雙引號(hào)""吕座。

由于JSON非常簡(jiǎn)單，很快就風(fēng)靡Web世界瘪板，并且成為ECMA標(biāo)準(zhǔn)吴趴。幾乎所有編程語(yǔ)言都有解析JSON的庫(kù)，而在JavaScript中侮攀，我們可以直接使用JSON锣枝，因?yàn)镴avaScript內(nèi)置了JSON的解析。

把任何JavaScript對(duì)象變成JSON兰英，就是把這個(gè)對(duì)象序列化成一個(gè)JSON格式的字符串撇叁，這樣才能夠通過(guò)網(wǎng)絡(luò)傳遞給其他計(jì)算機(jī)。

如果我們收到一個(gè)JSON格式的字符串畦贸，只需要把它反序列化成一個(gè)JavaScript對(duì)象税朴，就可以在JavaScript中直接使用這個(gè)對(duì)象了。

序列化

讓我們先把小明這個(gè)對(duì)象序列化成JSON格式的字符串：

var xiaoming = {
    name: '小明',
    age: 14,
    gender: true,
    height: 1.65,
    grade: null,
    'middle-school': '\"W3C\" Middle School',
    skills: ['JavaScript', 'Java', 'Python', 'Lisp']
};

JSON.stringify(xiaoming); // '{"name":"小明","age":14,"gender":true,"height":1.65,"grade":null,"middle-school":"\"W3C\" Middle School","skills":["JavaScript","Java","Python","Lisp"]}'

要輸出得好看一些，可以加上參數(shù)正林，按縮進(jìn)輸出：

JSON.stringify(xiaoming, null, '  ');

結(jié)果：

{
  "name": "小明",
  "age": 14,
  "gender": true,
  "height": 1.65,
  "grade": null,
  "middle-school": "\"W3C\" Middle School",
  "skills": [
    "JavaScript",
    "Java",
    "Python",
    "Lisp"
  ]
}

第二個(gè)參數(shù)用于控制如何篩選對(duì)象的鍵值泡一，如果我們只想輸出指定的屬性，可以傳入Array：

JSON.stringify(xiaoming, ['name', 'skills'], '  ');

結(jié)果：

{
  "name": "小明",
  "skills": [
    "JavaScript",
    "Java",
    "Python",
    "Lisp"
  ]
}

還可以傳入一個(gè)函數(shù)觅廓，這樣對(duì)象的每個(gè)鍵值對(duì)都會(huì)被函數(shù)先處理：

function convert(key, value) {
    if (typeof value === 'string') {
        return value.toUpperCase();
    }
    return value;
}

JSON.stringify(xiaoming, convert, '  ');

上面的代碼把所有屬性值都變成大寫(xiě)：

{
  "name": "小明",
  "age": 14,
  "gender": true,
  "height": 1.65,
  "grade": null,
  "middle-school": "\"W3C\" MIDDLE SCHOOL",
  "skills": [
    "JAVASCRIPT",
    "JAVA",
    "PYTHON",
    "LISP"
  ]
}

如果我們還想要精確控制如何序列化小明鼻忠，可以給xiaoming定義一個(gè)toJSON()的方法，直接返回JSON應(yīng)該序列化的數(shù)據(jù)：

var xiaoming = {
    name: '小明',
    age: 14,
    gender: true,
    height: 1.65,
    grade: null,
    'middle-school': '\"W3C\" Middle School',
    skills: ['JavaScript', 'Java', 'Python', 'Lisp'],
    toJSON: function () {
        return { // 只輸出name和age杈绸，并且改變了key：
            'Name': this.name,
            'Age': this.age
        };
    }
};

JSON.stringify(xiaoming); // '{"Name":"小明","Age":14}'

反序列化

拿到一個(gè)JSON格式的字符串帖蔓，我們直接用JSON.parse()把它變成一個(gè)JavaScript對(duì)象：

JSON.parse('[1,2,3,true]'); // [1, 2, 3, true]
JSON.parse('{"name":"小明","age":14}'); // Object {name: '小明', age: 14}
JSON.parse('true'); // true
JSON.parse('123.45'); // 123.45

JSON.parse()還可以接收一個(gè)函數(shù)，用來(lái)轉(zhuǎn)換解析出的屬性：

JSON.parse('{"name":"小明","age":14}', function (key, value) {
    // 把number * 2:
    if (key === 'name') {
        return value + '同學(xué)';
    }
    return value;
}); // Object {name: '小明同學(xué)', age: 14}

在JavaScript中使用JSON瞳脓，就是這么簡(jiǎn)單塑娇！

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 人面猴
    序言：七十年代末，一起剝皮案震驚了整個(gè)濱河市劫侧，隨后出現(xiàn)的幾起案子埋酬，更是在濱河造成了極大的恐慌，老刑警劉巖烧栋，帶你破解...
    沈念sama閱讀 221,888評(píng)論 6贊 515
  • 死咒
    序言：濱河連續(xù)發(fā)生了三起死亡事件写妥，死亡現(xiàn)場(chǎng)離奇詭異，居然都是意外死亡审姓，警方通過(guò)查閱死者的電腦和手機(jī)珍特，發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,677評(píng)論 3贊 399
  • 救了他兩次的神仙讓他今天三更去死
    文/潘曉璐 我一進(jìn)店門(mén)，熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)魔吐，“玉大人扎筒，你說(shuō)我怎么就攤上這事〕昴罚” “怎么了嗜桌？”我有些...
    開(kāi)封第一講書(shū)人閱讀 168,386評(píng)論 0贊 360
  • 道士緝兇錄：失蹤的賣(mài)姜人
    文/不壞的土叔 我叫張陵，是天一觀(guān)的道長(zhǎng)轴踱。 經(jīng)常有香客問(wèn)我症脂，道長(zhǎng)，這世上最難降的妖魔是什么淫僻？ 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 59,726評(píng)論 1贊 297
  • ?港島之戀（遺憾婚禮）
    正文 為了忘掉前任诱篷，我火速辦了婚禮，結(jié)果婚禮上雳灵，老公的妹妹穿的比我還像新娘棕所。我一直安慰自己，他們只是感情好悯辙，可當(dāng)我...
    茶點(diǎn)故事閱讀 68,729評(píng)論 6贊 397
  • 惡毒庶女頂嫁案：這布局不是一般人想出來(lái)的
    文/花漫 我一把揭開(kāi)白布琳省。 她就那樣靜靜地躺著迎吵，像睡著了一般。 火紅的嫁衣襯著肌膚如雪针贬。 梳的紋絲不亂的頭發(fā)上击费，一...
    開(kāi)封第一講書(shū)人閱讀 52,337評(píng)論 1贊 310
  • 城市分裂傳說(shuō)
    那天，我揣著相機(jī)與錄音桦他，去河邊找鬼蔫巩。 笑死，一個(gè)胖子當(dāng)著我的面吹牛快压，可吹牛的內(nèi)容都是我干的圆仔。 我是一名探鬼主播，決...
    沈念sama閱讀 40,902評(píng)論 3贊 421
  • 雙鴛鴦連環(huán)套：你想象不到人心有多黑
    文/蒼蘭香墨 我猛地睜開(kāi)眼蔫劣，長(zhǎng)吁一口氣：“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼坪郭！你這毒婦竟也來(lái)了？” 一聲冷哼從身側(cè)響起脉幢，我...
    開(kāi)封第一講書(shū)人閱讀 39,807評(píng)論 0贊 276
  • 萬(wàn)榮殺人案實(shí)錄
    序言：老撾萬(wàn)榮一對(duì)情侶失蹤歪沃，失蹤者是張志新（化名）和其女友劉穎，沒(méi)想到半個(gè)月后鸵隧，有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體绸罗，經(jīng)...
    沈念sama閱讀 46,349評(píng)論 1贊 318
  • ?護(hù)林員之死
    正文 獨(dú)居荒郊野嶺守林人離奇死亡意推，尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,439評(píng)論 3贊 340
  • ?白月光啟示錄
    正文 我和宋清朗相戀三年豆瘫，在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片菊值。...
    茶點(diǎn)故事閱讀 40,567評(píng)論 1贊 352
  • 活死人
    序言：一個(gè)原本活蹦亂跳的男人離奇死亡外驱，死狀恐怖，靈堂內(nèi)的尸體忽然破棺而出腻窒，到底是詐尸還是另有隱情昵宇，我是刑警寧澤，帶...
    沈念sama閱讀 36,242評(píng)論 5贊 350
  • ?日本核電站爆炸內(nèi)幕
    正文 年R本政府宣布儿子，位于F島的核電站瓦哎，受9級(jí)特大地震影響，放射性物質(zhì)發(fā)生泄漏柔逼。R本人自食惡果不足惜蒋譬，卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,933評(píng)論 3贊 334
  • 男人毒藥：我在死后第九天來(lái)索命
    文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望愉适。 院中可真熱鬧犯助，春花似錦、人聲如沸维咸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,420評(píng)論 0贊 24
  • 一樁弒父案惠爽，背后竟有這般陰謀
    文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至瞬哼，卻和暖如春婚肆，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背坐慰。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,531評(píng)論 1贊 272
  • 情欲美人皮
    我被黑心中介騙來(lái)泰國(guó)打工旬痹， 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留，地道東北人讨越。 一個(gè)月前我還...
    沈念sama閱讀 48,995評(píng)論 3贊 377
  • 代替公主和親
    正文 我出身青樓两残，卻偏偏與公主長(zhǎng)得像，于是被迫代替她去往敵國(guó)和親把跨。 傳聞我的和親對(duì)象是個(gè)殘疾皇子人弓，可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,585評(píng)論 2贊 359

推薦閱讀更多精彩內(nèi)容

  • 標(biāo)準(zhǔn)對(duì)象包裝對(duì)象DateRegExpJSON 標(biāo)準(zhǔn)對(duì)象 在JavaScript的世界里，一切都是對(duì)象着逐。 但是某些對(duì)...
    染微言閱讀 433評(píng)論 0贊 1
  • Spring Cloud為開(kāi)發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見(jiàn)模式的工具（例如配置管理崔赌，服務(wù)發(fā)現(xiàn)，斷路器耸别，智...
    卡卡羅2017閱讀 134,702評(píng)論 18贊 139
  • 原題 你給出一個(gè)整數(shù)數(shù)組(size為n)健芭，其具有以下特點(diǎn)：相鄰位置的數(shù)字是不同的A[0] < A[1] 并且 A[...
    Jason_Yuan閱讀 662評(píng)論 0贊 1
  • 你有沒(méi)有一刻覺(jué)得自己特別討厭自己，什么都做不好秀姐，堅(jiān)持不住慈迈，又矯情。在困難面前束手無(wú)策省有，只能停留在原地痒留，還在埋怨。 ...
    淺安時(shí)光木槿花開(kāi)閱讀 201評(píng)論 0贊 0
  • vhjhhuisnwbbjjsjbbdbjsjj
    仇志軒閱讀 136評(píng)論 0贊 4