基礎(chǔ)結(jié)構(gòu)
JSON建構(gòu)于兩種結(jié)構(gòu):
1. “名稱/值”對(duì)的集合(A collection of name/value pairs)。不同的語(yǔ)言中,它被理解為對(duì)象(object),記錄(record),結(jié)構(gòu)(struct),字典(dictionary),哈希表(hash table),有鍵列表(keyed list),或者關(guān)聯(lián)數(shù)組 (associative array)。
2. 值的有序列表(An ordered list of values)。在大部分語(yǔ)言中,它被理解為數(shù)組(array)。
?
基礎(chǔ)示例
簡(jiǎn)單地說(shuō),JSON 可以將 JavaScript 對(duì)象中表示的一組數(shù)據(jù)轉(zhuǎn)換為字符串,然后就可以在函數(shù)之間輕松地傳遞這個(gè)字符串,或者在異步應(yīng)用程序中將字符串從 Web 客戶機(jī)傳遞給服務(wù)器端程序。這個(gè)字符串看起來(lái)有點(diǎn)兒古怪,但是 JavaScript 很容易解釋它,而且 JSON 可以表示比"名稱 / 值對(duì)"更復(fù)雜的結(jié)構(gòu)。例如,可以表示數(shù)組和復(fù)雜的對(duì)象,而不僅僅是鍵和值的簡(jiǎn)單列表。
表示名稱 / 值對(duì)
按照最簡(jiǎn)單的形式,可以用下面這樣的 JSON 表示 "名稱 / 值對(duì)" :{ "firstName": "Brett" }
這個(gè)示例非?;?,而且實(shí)際上比等效的純文本 "名稱 / 值對(duì)" 占用更多的空間:firstName=Brett
但是,當(dāng)將多個(gè)"名稱 / 值對(duì)"串在一起時(shí),JSON 就會(huì)體現(xiàn)出它的價(jià)值了。首先,可以創(chuàng)建包含多個(gè)"名稱 / 值對(duì)"的 記錄,比如:
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" }
從語(yǔ)法方面來(lái)看,這與"名稱 / 值對(duì)"相比并沒(méi)有很大的優(yōu)勢(shì),但是在這種情況下 JSON 更容易使用,而且可讀性更好。例如,它明確地表示以上三個(gè)值都是同一記錄的一部分;花括號(hào)使這些值有了某種聯(lián)系。
表示數(shù)組
當(dāng)需要表示一組值時(shí),JSON 不但能夠提高可讀性,而且可以減少?gòu)?fù)雜性。例如,假設(shè)您希望表示一個(gè)人名列表。在 XML 中,需要許多開(kāi)始標(biāo)記和結(jié)束標(biāo)記;如果使用典型的 名稱 / 值 對(duì)(就像在本系列前面文章中看到的那種名稱 / 值對(duì)),那么必須建立一種專有的數(shù)據(jù)格式,或者將鍵名稱修改為 person1-firstName這樣的形式。
如果使用 JSON,就只需將多個(gè)帶花括號(hào)的記錄分組在一起:
{ "people": [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" }, { "firstName": "Jason", "lastName":"Hunter", "email": "bbbb"}, { "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" } ]}
這不難理解。在這個(gè)示例中,只有一個(gè)名為 people的變量,值是包含三個(gè)條目的數(shù)組,每個(gè)條目是一個(gè)人的記錄,其中包含名、姓和電子郵件地址。上面的示例演示如何用括號(hào)將記錄組合成一個(gè)值。當(dāng)然,可以使用相同的語(yǔ)法表示多個(gè)值(每個(gè)值包含多個(gè)記錄):
{ "programmers": [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" }, { "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" }, { "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" } ], "authors": [ { "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" }, { "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" }, { "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" } ], "musicians": [ { "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" }, { "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" } ] }
這里最值得注意的是,能夠表示多個(gè)值,每個(gè)值進(jìn)而包含多個(gè)值。但是還應(yīng)該注意,在不同的主條目(programmers、authors 和 musicians)之間,記錄中實(shí)際的名稱 / 值對(duì)可以不一樣。JSON 是完全動(dòng)態(tài)的,允許在 JSON 結(jié)構(gòu)的中間改變表示數(shù)據(jù)的方式。
在處理 JSON 格式的數(shù)據(jù)時(shí),沒(méi)有需要遵守的預(yù)定義的約束。所以,在同樣的數(shù)據(jù)結(jié)構(gòu)中,可以改變表示數(shù)據(jù)的方式,甚至可以以不同方式表示同一事物。
格式應(yīng)用
掌握了 JSON 格式之后,在 JavaScript 中使用它就很簡(jiǎn)單了。JSON 是 JavaScript 原生格式,這意味著在 JavaScript 中處理 JSON 數(shù)據(jù)不需要任何特殊的 API 或工具包。
將 JSON 數(shù)據(jù)賦值給變量
例如,可以創(chuàng)建一個(gè)新的 JavaScript 變量,然后將 JSON 格式的數(shù)據(jù)字符串直接賦值給它:
var people = { "programmers": [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" }, { "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" }, { "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" } ], "authors": [ { "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" }, { "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" }, { "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" } ], "musicians": [ { "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" }, { "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" } ] }
這非常簡(jiǎn)單;現(xiàn)在 people包含前面看到的 JSON 格式的數(shù)據(jù)。但是,這還不夠,因?yàn)樵L問(wèn)數(shù)據(jù)的方式似乎還不明顯。
訪問(wèn)數(shù)據(jù)
盡管看起來(lái)不明顯,但是上面的長(zhǎng)字符串實(shí)際上只是一個(gè)數(shù)組;將這個(gè)數(shù)組放進(jìn) JavaScript 變量之后,就可以很輕松地訪問(wèn)它。實(shí)際上,只需用點(diǎn)號(hào)表示法來(lái)表示數(shù)組元素。所以,要想訪問(wèn) programmers 列表的第一個(gè)條目的姓氏,只需在 JavaScript 中使用下面這樣的代碼:
people.programmers[0].lastName;
注意,數(shù)組索引是從零開(kāi)始的。所以,這行代碼首先訪問(wèn) people變量中的數(shù)據(jù);然后移動(dòng)到稱為 programmers的條目,再移動(dòng)到第一個(gè)記錄([0]);最后,訪問(wèn) lastName鍵的值。結(jié)果是字符串值 “McLaughlin”。
下面是使用同一變量的幾個(gè)示例。
people.authors[1].genre // Value is "fantasy" people.musicians[3].lastName // Undefined. This refers to the fourth entry, and there isn't one people.programmers[2].firstName // Value is "Elliotte"
利用這樣的語(yǔ)法,可以處理任何 JSON 格式的數(shù)據(jù),而不需要使用任何額外的 JavaScript 工具包或 API。
修改 JSON 數(shù)據(jù)
正如可以用點(diǎn)號(hào)和括號(hào)訪問(wèn)數(shù)據(jù),也可以按照同樣的方式輕松地修改數(shù)據(jù):
people.musicians[1].lastName = "Rachmaninov";
在將字符串轉(zhuǎn)換為 JavaScript 對(duì)象之后,就可以像這樣修改變量中的數(shù)據(jù)。
轉(zhuǎn)換回字符串
當(dāng)然,如果不能輕松地將對(duì)象轉(zhuǎn)換回本文提到的文本格式,那么所有數(shù)據(jù)修改都沒(méi)有太大的價(jià)值。在 JavaScript 中這種轉(zhuǎn)換也很簡(jiǎn)單:
String newJSONtext = people.toJSONString();
這樣就行了!現(xiàn)在就獲得了一個(gè)可以在任何地方使用的文本字符串,例如,可以將它用作 Ajax 應(yīng)用程序中的請(qǐng)求字符串。
更重要的是,可以將任何JavaScript 對(duì)象轉(zhuǎn)換為 JSON 文本。并非只能處理原來(lái)用 JSON 字符串賦值的變量。為了對(duì)名為 myObject的對(duì)象進(jìn)行轉(zhuǎn)換,只需執(zhí)行相同形式的命令:
String myObjectInJSON = myObject.toJSONString();
這就是 JSON 與本系列討論的其他數(shù)據(jù)格式之間最大的差異。如果使用 JSON,只需調(diào)用一個(gè)簡(jiǎn)單的函數(shù),就可以獲得經(jīng)過(guò)格式化的數(shù)據(jù),可以直接使用了。對(duì)于其他數(shù)據(jù)格式,需要在原始數(shù)據(jù)和格式化數(shù)據(jù)之間進(jìn)行轉(zhuǎn)換。即使使用 Document Object Model 這樣的 API(提供了將自己的數(shù)據(jù)結(jié)構(gòu)轉(zhuǎn)換為文本的函數(shù)),也需要學(xué)習(xí)這個(gè) API 并使用 API 的對(duì)象,而不是使用原生的 JavaScript 對(duì)象和語(yǔ)法。
最終結(jié)論是,如果要處理大量 JavaScript 對(duì)象,那么 JSON 幾乎肯定是一個(gè)好選擇,這樣就可以輕松地將數(shù)據(jù)轉(zhuǎn)換為可以在請(qǐng)求中發(fā)送給服務(wù)器端程序的格式。
概念比較
JSON和XML的比較
◆可讀性
JSON和XML的可讀性可謂不相上下,一邊是簡(jiǎn)易的語(yǔ)法,一邊是規(guī)范的標(biāo)簽形式,很難分出勝負(fù)。
◆可擴(kuò)展性
XML天生有很好的擴(kuò)展性,JSON當(dāng)然也有,沒(méi)有什么是XML能擴(kuò)展,而JSON卻不能。不過(guò)JSON在Javascript主場(chǎng)作戰(zhàn),可以存儲(chǔ)Javascript復(fù)合對(duì)象,有著xml不可比擬的優(yōu)勢(shì)。
◆編碼難度
XML有豐富的編碼工具,比如Dom4j、JDom等,JSON也有提供的工具。無(wú)工具的情況下,相信熟練的開(kāi)發(fā)人員一樣能很快的寫出想要的xml文檔和JSON字符串,不過(guò),xml文檔要多很多結(jié)構(gòu)上的字符。
◆解碼難度
XML的解析方式有兩種:
一是通過(guò)文檔模型解析,也就是通過(guò)父標(biāo)簽索引出一組標(biāo)記。例如:xmlData.getElementsByTagName("tagName"),但是這樣是要在預(yù)先知道文檔結(jié)構(gòu)的情況下使用,無(wú)法進(jìn)行通用的封裝。
另外一種方法是遍歷節(jié)點(diǎn)(document 以及 childNodes)。這個(gè)可以通過(guò)遞歸來(lái)實(shí)現(xiàn),不過(guò)解析出來(lái)的數(shù)據(jù)仍舊是形式各異,往往也不能滿足預(yù)先的要求。
凡是這樣可擴(kuò)展的結(jié)構(gòu)數(shù)據(jù)解析起來(lái)一定都很困難。
JSON也同樣如此。如果預(yù)先知道JSON結(jié)構(gòu)的情況下,使用JSON進(jìn)行數(shù)據(jù)傳遞簡(jiǎn)直是太美妙了,可以寫出很實(shí)用美觀可讀性強(qiáng)的代碼。如果你是純粹的前臺(tái)開(kāi)發(fā)人員,一定會(huì)非常喜歡JSON。但是如果你是一個(gè)應(yīng)用開(kāi)發(fā)人員,就不是那么喜歡了,畢竟xml才是真正的結(jié)構(gòu)化標(biāo)記語(yǔ)言,用于進(jìn)行數(shù)據(jù)傳遞。
而如果不知道JSON的結(jié)構(gòu)而去解析JSON的話,那簡(jiǎn)直是噩夢(mèng)。費(fèi)時(shí)費(fèi)力不說(shuō),代碼也會(huì)變得冗余拖沓,得到的結(jié)果也不盡人意。但是這樣也不影響眾多前臺(tái)開(kāi)發(fā)人員選擇JSON。因?yàn)閖son.js中的toJSONString()就可以看到JSON的字符串結(jié)構(gòu)。當(dāng)然不是使用這個(gè)字符串,這樣仍舊是噩夢(mèng)。常用JSON的人看到這個(gè)字符串之后,就對(duì)JSON的結(jié)構(gòu)很明了了,就更容易的操作JSON。
以上是在Javascript中僅對(duì)于數(shù)據(jù)傳遞的xml與JSON的解析。在Javascript地盤內(nèi),JSON畢竟是主場(chǎng)作戰(zhàn),其優(yōu)勢(shì)當(dāng)然要遠(yuǎn)遠(yuǎn)優(yōu)越于xml。如果JSON中存儲(chǔ)Javascript復(fù)合對(duì)象,而且不知道其結(jié)構(gòu)的話,我相信很多程序員也一樣是哭著解析JSON的。
◆實(shí)例比較
XML和JSON都使用結(jié)構(gòu)化方法來(lái)標(biāo)記數(shù)據(jù),下面來(lái)做一個(gè)簡(jiǎn)單的比較。
用XML表示中國(guó)部分省市數(shù)據(jù)如下:
<?xml version="1.0" encoding="utf-8"?> <country> <name>中國(guó)</name> <province> <name>黑龍江</name> <cities> <city>哈爾濱</city> <city>大慶</city> </cities> </province> <province> <name>廣東</name> <cities> <city>廣州</city> <city>深圳</city> <city>珠海</city> </cities> </province> </country>
用JSON表示如下:
{ {name:"中國(guó)", province:[ { name:"黑龍江", cities:{ city:["哈爾濱","大慶"] }, {name:"廣東", cities:{ city:["廣州","深圳","珠海"] } }
編碼的可讀性,xml有明顯的優(yōu)勢(shì),畢竟人類的語(yǔ)言更貼近這樣的說(shuō)明結(jié)構(gòu)。json讀起來(lái)更像一個(gè)數(shù)據(jù)塊,讀起來(lái)就比較費(fèi)解了。不過(guò),我們讀起來(lái)費(fèi)解的語(yǔ)言,恰恰是適合機(jī)器閱讀,所以通過(guò)json的索引.province[0].name就能夠讀取“黑龍江”這個(gè)值。
編碼的手寫難度來(lái)說(shuō),xml還是舒服一些,好讀當(dāng)然就好寫。不過(guò)寫出來(lái)的字符JSON就明顯少很多。去掉空白制表以及換行的話,JSON就是密密麻麻的有用數(shù)據(jù),而xml卻包含很多重復(fù)的標(biāo)記字符。
?
JSON在線校驗(yàn)工具
前言
JSON格式取代了xml給網(wǎng)絡(luò)傳輸帶來(lái)了很大的便利,但是卻沒(méi)有了xml的一目了然,尤其是json數(shù)據(jù)很長(zhǎng)的時(shí)候,我們會(huì)陷入繁瑣復(fù)雜的數(shù)據(jù)節(jié)點(diǎn)查找中。
但是國(guó)人的一款在線工具 BeJson 給眾多程序員帶來(lái)了一陣涼風(fēng)。
功能簡(jiǎn)介
1. JSON格式化校驗(yàn)
很多人在得到JSON數(shù)據(jù)后,一時(shí)沒(méi)有辦法判斷JSON數(shù)據(jù)格式是否正確,是否少或多符號(hào)而導(dǎo)致程序不能解析,這個(gè)功能正好能幫助大家來(lái)完成JSON格式的校驗(yàn)。
2. JSON視圖
想必很多程序員都會(huì)遇到當(dāng)找一個(gè)節(jié)點(diǎn)的時(shí)候,會(huì)發(fā)現(xiàn)如果直接對(duì)著一行行數(shù)據(jù)無(wú)從下手,就算知道哪個(gè)位置,還要一個(gè)節(jié)點(diǎn)一個(gè)節(jié)點(diǎn)的往下找,萬(wàn)一一不留神又得從頭開(kāi)始找的麻煩事。
有了這個(gè)功能,一切JSON數(shù)據(jù)都會(huì)變成視圖格式,一目了然,什么對(duì)象下有多少數(shù)組,一個(gè)數(shù)組下有多少對(duì)象。
這個(gè)功能非常實(shí)用。不光有視圖功能還有格式化、壓縮、轉(zhuǎn)義、校驗(yàn)功能。總之很強(qiáng)大。
3. 壓縮轉(zhuǎn)義
程序員在寫JSON語(yǔ)句測(cè)試用例的時(shí)候,很多時(shí)候?yàn)榱朔奖阒苯訉懥藗€(gè)JSON字符串做測(cè)試,但是又陷入了無(wú)止境的雙引號(hào)轉(zhuǎn)義的麻煩中。這款功能集壓縮、轉(zhuǎn)義于一身,讓你在寫測(cè)試用例的時(shí)候,如魚得水。
4. JSON在線編輯器
如果你現(xiàn)在的電腦剛巧沒(méi)有裝你所熟悉的編輯器,如果你想針對(duì)拿到的JSON數(shù)據(jù)的某個(gè)節(jié)點(diǎn)做數(shù)據(jù)修改時(shí),這個(gè)功能可以滿足你的需求。
5. 在線發(fā)送JSON數(shù)據(jù)
大家都知道,JSON用的最多的還是web項(xiàng)目的開(kāi)發(fā),那你要測(cè)試一個(gè)接口是否能準(zhǔn)確的接受JSON數(shù)據(jù),那你就得寫一個(gè)頁(yè)面發(fā)送JSON字符串,重復(fù)的做著這件事。隨著這個(gè)功能的橫空出世,你可以擺脫寫測(cè)試頁(yè)面了,因?yàn)檫@個(gè)功能可以將指定的JSON數(shù)據(jù)發(fā)送指定的url,方便吧。
6. JSON著色
很多人在寫文檔時(shí),總希望文檔能一目了然,但是面對(duì)著白底黑字的JSON數(shù)據(jù)總是提不起精神沒(méi)關(guān)系,使用這個(gè)功能,所有的關(guān)鍵字都會(huì)被著色,數(shù)據(jù)結(jié)構(gòu)一目了然。
7. JSON-XML互轉(zhuǎn)
顧名思義,將JSON格式的數(shù)據(jù)轉(zhuǎn)化成XML格式、或者XML格式的數(shù)據(jù)轉(zhuǎn)化成JSON格式,一切都不是問(wèn)題。
更多JSON 數(shù)據(jù)格式相關(guān)文章請(qǐng)關(guān)注PHP中文網(wǎng)!

Alat AI Hot

Undress AI Tool
Gambar buka pakaian secara percuma

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Clothoff.io
Penyingkiran pakaian AI

Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Terdapat tiga cara biasa untuk memulakan permintaan HTTP dalam node.js: Gunakan modul terbina dalam, axios, dan nod-fetch. 1. Gunakan modul HTTP/HTTPS terbina dalam tanpa kebergantungan, yang sesuai untuk senario asas, tetapi memerlukan pemprosesan manual jahitan data dan pemantauan ralat, seperti menggunakan https.get () untuk mendapatkan data atau menghantar permintaan pos melalui .write (); 2.AXIOS adalah perpustakaan pihak ketiga berdasarkan janji. Ia mempunyai sintaks ringkas dan fungsi yang kuat, menyokong async/menunggu, penukaran JSON automatik, pemintas, dan lain -lain. Adalah disyorkan untuk memudahkan operasi permintaan tak segerak; 3.Node-Fetch menyediakan gaya yang serupa dengan pengambilan penyemak imbas, berdasarkan janji dan sintaks mudah

Jenis data JavaScript dibahagikan kepada jenis primitif dan jenis rujukan. Jenis primitif termasuk rentetan, nombor, boolean, null, undefined, dan simbol. Nilai -nilai tidak berubah dan salinan disalin apabila memberikan nilai, jadi mereka tidak mempengaruhi satu sama lain; Jenis rujukan seperti objek, tatasusunan dan fungsi menyimpan alamat memori, dan pembolehubah menunjuk objek yang sama akan mempengaruhi satu sama lain. Typeof dan Instanceof boleh digunakan untuk menentukan jenis, tetapi memberi perhatian kepada isu -isu sejarah TypeOfNull. Memahami kedua -dua jenis perbezaan ini dapat membantu menulis kod yang lebih stabil dan boleh dipercayai.

Helo, pemaju JavaScript! Selamat datang ke berita JavaScript minggu ini! Minggu ini kami akan memberi tumpuan kepada: Pertikaian tanda dagangan Oracle dengan Deno, objek masa JavaScript baru disokong oleh pelayar, kemas kini Google Chrome, dan beberapa alat pemaju yang kuat. Mari mulakan! Pertikaian tanda dagangan Oracle dengan percubaan Deno Oracle untuk mendaftarkan tanda dagangan "JavaScript" telah menyebabkan kontroversi. Ryan Dahl, pencipta Node.js dan Deno, telah memfailkan petisyen untuk membatalkan tanda dagangan, dan dia percaya bahawa JavaScript adalah standard terbuka dan tidak boleh digunakan oleh Oracle

Janji adalah mekanisme teras untuk mengendalikan operasi tak segerak dalam JavaScript. Memahami panggilan rantaian, pengendalian ralat dan gabungan adalah kunci untuk menguasai aplikasi mereka. 1. Panggilan rantai mengembalikan janji baru melalui .then () untuk merealisasikan persamaan proses tak segerak. Setiap .then () menerima hasil sebelumnya dan boleh mengembalikan nilai atau janji; 2. Pengendalian ralat harus menggunakan .catch () untuk menangkap pengecualian untuk mengelakkan kegagalan senyap, dan boleh mengembalikan nilai lalai dalam tangkapan untuk meneruskan proses; 3. Gabungan seperti janji.all () (berjaya hanya berjaya selepas semua kejayaan), janji.race () (penyempurnaan pertama dikembalikan) dan janji.allsettled () (menunggu semua penyelesaian)

CACHEAPI adalah alat yang disediakan oleh penyemak imbas kepada permintaan rangkaian cache, yang sering digunakan bersempena dengan ServiceWorker untuk meningkatkan prestasi laman web dan pengalaman luar talian. 1. Ia membolehkan pemaju menyimpan sumber secara manual seperti skrip, helaian gaya, gambar, dan lain -lain; 2. Ia boleh memadankan tindak balas cache mengikut permintaan; 3. Ia menyokong memotong cache tertentu atau membersihkan seluruh cache; 4. Ia boleh melaksanakan keutamaan cache atau strategi keutamaan rangkaian melalui perkhidmatan pekerja yang mendengar acara mengambil; 5. Ia sering digunakan untuk sokongan luar talian, mempercepat kelajuan akses berulang, sumber utama dan kandungan kemas kini latar belakang; 6. Apabila menggunakannya, anda perlu memberi perhatian kepada kawalan versi cache, sekatan penyimpanan dan perbezaan dari mekanisme caching HTTP.

Gelung acara JavaScript menguruskan operasi tak segerak dengan menyelaraskan susunan panggilan, webapis, dan barisan tugas. 1. Stack panggilan melaksanakan kod segerak, dan ketika menghadapi tugas -tugas yang tidak segerak, ia diserahkan kepada Webapi untuk diproses; 2. Selepas Webapi melengkapkan tugas di latar belakang, ia meletakkan panggil balik ke dalam barisan yang sama (tugas makro atau tugas mikro); 3. Loop acara memeriksa sama ada timbunan panggilan kosong. Jika ia kosong, panggilan balik diambil dari barisan dan ditolak ke dalam tumpukan panggilan untuk pelaksanaan; 4. Tugas -tugas mikro (seperti janji. 5. Memahami gelung acara membantu mengelakkan menyekat benang utama dan mengoptimumkan pesanan pelaksanaan kod.

Gelembung peristiwa menyebarkan dari elemen sasaran ke luar ke nod nenek moyang, sementara penangkapan peristiwa menyebarkan dari lapisan luar ke dalam ke elemen sasaran. 1. Bubbles Acara: Selepas mengklik elemen kanak -kanak, acara itu mencetuskan pendengar elemen induk ke atas. Sebagai contoh, selepas mengklik butang, ia mengeluarkan anak -anak terlebih dahulu, dan kemudian ParentClicked. 2. Tangkap Acara: Tetapkan parameter ketiga menjadi benar, supaya pendengar dilaksanakan di peringkat penangkapan, seperti mencetuskan pendengar penangkapan elemen induk sebelum mengklik butang. 3. Penggunaan praktikal termasuk pengurusan bersatu peristiwa elemen kanak -kanak, pemprosesan pemintasan dan pengoptimuman prestasi. 4. Aliran acara DOM dibahagikan kepada tiga peringkat: menangkap, sasaran dan gelembung, dan pendengar lalai dilaksanakan di peringkat gelembung.

Dalam tatasusunan JavaScript, sebagai tambahan kepada peta dan penapis, terdapat kaedah lain yang kuat dan jarang digunakan. 1. Mengurangkan bukan sahaja dapat jumlah, tetapi juga mengira, kumpulan, array meratakan, dan membina struktur baru; 2. Cari dan FindIndex digunakan untuk mencari elemen atau indeks individu; 3. Beberapa dan segala -galanya digunakan untuk menentukan sama ada keadaan wujud atau semua memenuhi; 4.Sort boleh disusun tetapi akan mengubah array asal; 5. Beri perhatian untuk menyalin array apabila menggunakannya untuk mengelakkan kesan sampingan. Kaedah ini menjadikan kod lebih ringkas dan cekap.
