數(shù)據(jù)系統(tǒng) - 數(shù)據(jù)流的模式

前的文章中我們說過當(dāng)你不想共享內(nèi)存但又想發(fā)送數(shù)據(jù)給另一個(gè)進(jìn)程時(shí)，比方說，你想通過網(wǎng)絡(luò)發(fā)送數(shù)據(jù)或者寫一個(gè)文件，那么就需要把這些數(shù)據(jù)編碼成一串字節(jié)。數(shù)據(jù)系統(tǒng) - 數(shù)據(jù)的編碼格式一文中我們就討論了各種不同的編碼方式。

我們談到了向前和向后的兼容性，這對(duì)于演化是很重要的，這會(huì)允許你可以單獨(dú)的升級(jí)你系統(tǒng)中的一部分，而不會(huì)影響其他部分，且這會(huì)變得很簡(jiǎn)單。兼容性就是一個(gè)對(duì)數(shù)據(jù)進(jìn)行編碼的進(jìn)程與另一個(gè)對(duì)數(shù)據(jù)進(jìn)行解碼的進(jìn)程之間的關(guān)系。

數(shù)據(jù)從一個(gè)進(jìn)程流向另一個(gè)進(jìn)程也存在很多的形式，這是一個(gè)相當(dāng)抽象的概念。誰編碼數(shù)據(jù)？誰又解碼數(shù)據(jù)？接下來我們會(huì)討論一些最常見的進(jìn)程間數(shù)據(jù)流動(dòng)的方式。

通過數(shù)據(jù)庫的數(shù)據(jù)流

在一個(gè)數(shù)據(jù)庫中，往數(shù)據(jù)庫寫入數(shù)據(jù)的進(jìn)程編碼數(shù)據(jù)，從數(shù)據(jù)庫讀出數(shù)據(jù)的進(jìn)程解碼數(shù)據(jù)。可能只有一個(gè)進(jìn)程正在訪問數(shù)據(jù)庫，在這種情況下，讀取數(shù)據(jù)的進(jìn)程可能只是同一進(jìn)程的更高版本-在這種情況下，您可以考慮將某些內(nèi)容存儲(chǔ)在數(shù)據(jù)庫中作為向您自己的未來發(fā)送消息。

向后的兼容性在這里必然是需要的，否則未來的你將不能解碼你自己寫的數(shù)據(jù)。

一般來說，幾個(gè)不同的進(jìn)程同時(shí)訪問數(shù)據(jù)庫是很常見的。這些進(jìn)程可能是幾個(gè)不同的應(yīng)用或服務(wù)，又或是同一個(gè)服務(wù)的好幾個(gè)實(shí)例（并行運(yùn)行以實(shí)現(xiàn)可擴(kuò)展性或容錯(cuò)能力）。無論哪種方式，在應(yīng)用程序不斷更新的環(huán)境中，訪問數(shù)據(jù)庫的某些進(jìn)程很可能正在運(yùn)行較新的代碼，而某些正在運(yùn)行較舊的代碼，例如，由于當(dāng)前正在滾動(dòng)升級(jí)部署新版本，因此有些實(shí)例已更新，而另一些尚未更新。

這也就意味著數(shù)據(jù)庫的某一個(gè)數(shù)據(jù)有可能被新的新版本的代碼寫入的，并且隨后被一個(gè)正在運(yùn)行老版本代碼進(jìn)程讀取。因此，對(duì)于數(shù)據(jù)來說，通常向后的兼容性也是需要的。

但是，有其他障礙。假設(shè)您將一個(gè)字段添加到記錄模式，并且較新的代碼將該新字段的值寫入數(shù)據(jù)庫。隨后，舊版本的代碼（尚不知道新字段）將讀取記錄，對(duì)其進(jìn)行更新，然后將其寫回。在這種情況下，通常的做法是使舊代碼保持新字段的完整性，即使無法解釋也是如此。

先前討論的編碼格式支持這種未知字段的保存，但是有時(shí)您需要在應(yīng)用程序級(jí)別格外小心，如下圖所示。例如，如果在應(yīng)用程序中將數(shù)據(jù)庫值解碼為模型對(duì)象，然后再對(duì)這些模型對(duì)象進(jìn)行重新編碼，則在該轉(zhuǎn)換過程中未知字段可能會(huì)丟失。解決這個(gè)問題并不困難。您只需要意識(shí)到這一點(diǎn)。

在不同時(shí)間寫入的不同數(shù)值

一個(gè)數(shù)據(jù)庫通常允許在任何時(shí)間更新任意的值。這也就是說在單個(gè)數(shù)據(jù)庫，你會(huì)有一些5毫秒之前寫入的值，并且你也會(huì)有一些5年前寫入的值。

當(dāng)你部署一個(gè)你的應(yīng)用的新版本時(shí)，你可能會(huì)花一些時(shí)間完全取代老的版本。但數(shù)據(jù)庫中的內(nèi)容不是這樣的：五年前的數(shù)據(jù)會(huì)仍然在那里，除非你已經(jīng)明確重寫了它。這種觀察有時(shí)被總結(jié)為data outlives code。

重寫（遷移）數(shù)據(jù)進(jìn)一個(gè)新的模式當(dāng)然是可行的，但對(duì)于一個(gè)龐大的數(shù)據(jù)集而言，開銷是巨大的，所以大多數(shù)的數(shù)據(jù)庫在可能的情況下都避免這種做法。大多數(shù)的關(guān)系型數(shù)據(jù)庫允許簡(jiǎn)單的模式更改，比如在不重寫現(xiàn)有值的情況下，增加一列默認(rèn)值為null的新列。讀取舊行時(shí)，數(shù)據(jù)庫對(duì)磁盤上編碼數(shù)據(jù)中缺少的任何列填充null。 LinkedIn的文檔數(shù)據(jù)庫Espresso使用Avro進(jìn)行存儲(chǔ)，從而使其可以使用Avro的模式演變規(guī)則。

因此，模式演化使整個(gè)數(shù)據(jù)庫看起來好像是用單個(gè)模式編碼的，即使基礎(chǔ)存儲(chǔ)可能包含使用模式的各種歷史版本編碼的記錄。

歸檔存儲(chǔ)Archival storage

也許你會(huì)對(duì)你的數(shù)據(jù)庫時(shí)不時(shí)的進(jìn)行一次快照，說這是為了備份或是加載其進(jìn)入數(shù)據(jù)倉(cāng)庫。在這樣的情況下，數(shù)據(jù)轉(zhuǎn)儲(chǔ)一般會(huì)使用最新的模式進(jìn)行編碼，即使在源數(shù)據(jù)庫中存在著來自不同紀(jì)元的各種模式版本。由于仍然要復(fù)制數(shù)據(jù)，因此最好對(duì)數(shù)據(jù)副本進(jìn)行一致的編碼。

由于數(shù)據(jù)轉(zhuǎn)儲(chǔ)是一次性寫入的，并且此后是不可變的，因此類似Avro對(duì)象容器文件的格式非常適合。這也是把數(shù)據(jù)編碼成面向列的，對(duì)分析友好的格式的好機(jī)會(huì)。

通過服務(wù)的數(shù)據(jù)流：REST和RPC

當(dāng)你有進(jìn)行需要通過網(wǎng)絡(luò)通信時(shí)，有幾種不同的方式來安排這種溝通。最常見的安排就是定義兩個(gè)角色：客戶端和服務(wù)器。服務(wù)端在網(wǎng)絡(luò)上暴露API，然后，客戶端就可以連接服務(wù)器，對(duì)API發(fā)出請(qǐng)求。服務(wù)端暴露的API也被稱為服務(wù)。

網(wǎng)站是按照如下這種方式工作的：客戶端（網(wǎng)頁瀏覽器）向網(wǎng)站服務(wù)器發(fā)出請(qǐng)求，通過GET請(qǐng)求下載HTML，CCS，JavaScript，圖片等，并且通過POST請(qǐng)求向服務(wù)器提交數(shù)據(jù)。API由一組標(biāo)準(zhǔn)的協(xié)議和數(shù)據(jù)格式組成（HTTP，URLs，SSL/TLS，HTML等等）。因?yàn)榫W(wǎng)頁瀏覽器、網(wǎng)站服務(wù)器和網(wǎng)站作者大多數(shù)都對(duì)這些標(biāo)準(zhǔn)達(dá)成了一致，因此你可以使用任意的瀏覽器訪問任意的網(wǎng)址（至少理論上是這樣的）。

網(wǎng)頁瀏覽器不是唯一的客戶端類型。比方說一個(gè)運(yùn)行在移動(dòng)設(shè)備或是臺(tái)式電腦上的應(yīng)用也可以向服務(wù)器發(fā)出網(wǎng)絡(luò)請(qǐng)求，并且運(yùn)行在網(wǎng)頁瀏覽器中的客戶端的JavaScript應(yīng)用也可以使用XMLHttpRequest成為一個(gè)HTTP客戶端（這種技術(shù)被稱為Ajax）。在這樣的情況下，服務(wù)器的響應(yīng)一般不是展示給人的HTML，而是便于客戶端應(yīng)用代碼后續(xù)處理的數(shù)據(jù)編碼（比方說JSON）。雖然HTTP被用作傳輸協(xié)議，但頂部的API實(shí)現(xiàn)是根據(jù)應(yīng)用特定的，客戶端和服務(wù)器需要在API上細(xì)節(jié)上達(dá)成一致。

此外，服務(wù)器自己也可以是另一個(gè)服務(wù)的客戶端（比方說一般網(wǎng)頁應(yīng)用服務(wù)器也是數(shù)據(jù)庫的客戶端）。這種方法通常用于按功能領(lǐng)域?qū)⒋笮蛻?yīng)用程序分解為較小的服務(wù)，這樣，當(dāng)一個(gè)服務(wù)需要來自另一個(gè)服務(wù)的某些功能或數(shù)據(jù)時(shí)，就會(huì)向另一個(gè)服務(wù)發(fā)出請(qǐng)求。這種構(gòu)建應(yīng)用程序的方式傳統(tǒng)上被稱為面向服務(wù)的體系結(jié)構(gòu)（service-oriented architecture，SOA），最近被完善并更名為微服務(wù)體系結(jié)構(gòu)(microservices architecture)。

在某些方面，服務(wù)類似于數(shù)據(jù)庫：它們通常允許客戶提交和查詢數(shù)據(jù)。但是，盡管數(shù)據(jù)庫允許使用我們?cè)谥坝懻摰牟樵冋Z言進(jìn)行任意查詢，但是服務(wù)公開了特定于應(yīng)用程序的API，該API僅允許輸入和輸出預(yù)先根據(jù)業(yè)務(wù)邏輯（應(yīng)用程序代碼）預(yù)先確定好的內(nèi)容。這種限制提供了一定程度的封裝：服務(wù)可以對(duì)客戶端可以做什么和不能做什么進(jìn)行嚴(yán)格的限制。

面向服務(wù)/微服務(wù)體系結(jié)構(gòu)的關(guān)鍵設(shè)計(jì)目標(biāo)是通過使服務(wù)能夠獨(dú)立部署和發(fā)展，使應(yīng)用程序更易于更改和維護(hù)。例如，每個(gè)服務(wù)應(yīng)由一個(gè)團(tuán)隊(duì)擁有，并且該團(tuán)隊(duì)?wèi)?yīng)能夠頻繁發(fā)布服務(wù)的新版本，而不必與其他團(tuán)隊(duì)進(jìn)行協(xié)調(diào)。換句話說，我們應(yīng)該期望新舊版本的服務(wù)器和客戶端能夠同時(shí)運(yùn)行，因此服務(wù)器和客戶端使用的數(shù)據(jù)編碼必須在服務(wù)API的各個(gè)版本之間兼容，這正是我們一直在談?wù)摰膬?nèi)容。

Web Services

當(dāng)HTTP用作與服務(wù)進(jìn)行通信的基礎(chǔ)協(xié)議時(shí)，它稱為Web Services。這也許是一個(gè)輕微的誤稱，因?yàn)閃eb Services不僅在Web上使用，而且在幾種不同的情形中也有被使用到。例如：

在用戶設(shè)備上運(yùn)行的客戶端應(yīng)用程序（例如，移動(dòng)設(shè)備上的本機(jī)應(yīng)用程序，或使用Ajax的JavaScript網(wǎng)絡(luò)應(yīng)用程序）通過HTTP向服務(wù)發(fā)出請(qǐng)求。這些請(qǐng)求通常通過公共互聯(lián)網(wǎng)發(fā)送
作為面向服務(wù)/微服務(wù)體系結(jié)構(gòu)的一部分，一個(gè)服務(wù)向通常位于同一數(shù)據(jù)中心內(nèi)的同一組織擁有的另一服務(wù)發(fā)出請(qǐng)求。（支持這種用例的軟件有時(shí)稱為中間件。）
一種通常通過Internet向其他組織擁有的服務(wù)發(fā)出請(qǐng)求的服務(wù)。這用于不同組織的后端系統(tǒng)之間的數(shù)據(jù)交換。此類別包括由在線服務(wù)（例如信用卡處理系統(tǒng)）提供的公共API，或用于共享訪問用戶數(shù)據(jù)的OAuth。

有兩種流行的web services方式，REST和SOAP。他們幾乎是截然相反的，而且常常是各自支持者之間激烈辯論的主題。

REST不是一個(gè)協(xié)議，而是基于HTTP上的設(shè)計(jì)哲學(xué)。它強(qiáng)調(diào)數(shù)據(jù)格式的簡(jiǎn)單化，使用URL標(biāo)記資源并且使用HTTP特性用來控制緩存，身份驗(yàn)證和內(nèi)容類型協(xié)商。相比于SOAP，REST更受大家歡迎。至少是在跨組織的不同的服務(wù)的整合上，并且通常與微服務(wù)相關(guān)聯(lián)。一個(gè)根據(jù)REST原則設(shè)計(jì)的API被稱為RESTful。

相對(duì)比，SOAP是一個(gè)基于XML的發(fā)送網(wǎng)絡(luò)API請(qǐng)求的協(xié)議。雖然絕大多數(shù)也是基于HTTP，但它旨在從HTTP中獨(dú)立出去并且避免使用絕大多數(shù)HTTP的特性。相反，它帶有廣泛而復(fù)雜的相關(guān)標(biāo)準(zhǔn)（web service framework，稱為WS- *），這些標(biāo)準(zhǔn)添加了各種功能。

使用稱為Web服務(wù)描述語言或WSDL的基于XML的語言來描述SOAP Web服務(wù)的API。 WSDL支持代碼生成，以便客戶端可以使用本地類和方法調(diào)用（它們被編碼為XML消息并由框架再次解碼）訪問遠(yuǎn)程服務(wù)。這在靜態(tài)類型的編程語言中很有用，而在動(dòng)態(tài)類型的編程語言中則很少用到。

盡管表面上對(duì)SOAP及其各種擴(kuò)展進(jìn)行了標(biāo)準(zhǔn)化，但不同供應(yīng)商的實(shí)現(xiàn)之間的互操作性經(jīng)常會(huì)引起問題。由于所有這些原因，盡管SOAP仍在許多大型企業(yè)中使用，但是它已經(jīng)下降了。在大多數(shù)較小的公司中都不受歡迎。

RESTful API傾向于使用更簡(jiǎn)單的方法，通常涉及更少的代碼生成和自動(dòng)化工具。諸如OpenAPI（也稱為Swagger）之類的定義格式可用于描述RESTful API并生成文檔。

Remode procedure call（RPC）的問題

Web服務(wù)只是用于通過網(wǎng)絡(luò)發(fā)出API請(qǐng)求的眾多技術(shù)的最新形式，其中許多技術(shù)受到了廣泛宣傳，但存在嚴(yán)重問題。企業(yè)JavaBean（EJB）和Java的遠(yuǎn)程方法調(diào)用（RMI）僅限Java。分布式組件對(duì)象模型（DCOM）僅限于Microsoft平臺(tái)。通用對(duì)象請(qǐng)求代理體系結(jié)構(gòu)（CORBA）過于復(fù)雜，并且不提供向后或向前兼容性。

所有這些都是基于Remode procedure call（RPC）的思想，該思想自1970年代就已經(jīng)存在。 RPC模型試圖在同一個(gè)進(jìn)程內(nèi)，使對(duì)遠(yuǎn)程網(wǎng)絡(luò)服務(wù)的請(qǐng)求看起來與以編程語言調(diào)用函數(shù)或方法相同（這種抽象被稱為location transparency）。盡管乍一看RPC似乎很方便，但是該方法從根本上來說是有缺陷的。網(wǎng)絡(luò)請(qǐng)求與本地函數(shù)調(diào)用有很大不同：

局部函數(shù)調(diào)用是可預(yù)測(cè)的，成功或失敗取決于僅在您控制下的參數(shù)。網(wǎng)絡(luò)請(qǐng)求是不可預(yù)測(cè)的：由于網(wǎng)絡(luò)問題，請(qǐng)求或響應(yīng)可能會(huì)丟失，或者遠(yuǎn)程計(jì)算機(jī)可能運(yùn)行緩慢或不可用，而這些問題完全不在您的控制范圍之內(nèi)。網(wǎng)絡(luò)問題很常見，因此您必須預(yù)見它們，例如，通過重試失敗的請(qǐng)求。
局部函數(shù)調(diào)用要么返回結(jié)果，要么拋出異常，要么永不返回（因?yàn)樗M(jìn)入無限循環(huán)或進(jìn)程崩潰）。網(wǎng)絡(luò)請(qǐng)求還有另一個(gè)可能的結(jié)果：由于超時(shí)，它可能沒有結(jié)果返回。在這種情況下，您根本不知道發(fā)生了什么：如果您沒有從遠(yuǎn)程服務(wù)獲得響應(yīng)，那么您將無法知道請(qǐng)求是否通過。
如果重試失敗的網(wǎng)絡(luò)請(qǐng)求，則可能是請(qǐng)求實(shí)際上已經(jīng)通過，只有響應(yīng)丟失了。在這種情況下，除非您在協(xié)議中建立重復(fù)數(shù)據(jù)刪除（冪等性）的機(jī)制，否則重試將導(dǎo)致該操作多次執(zhí)行。本地函數(shù)調(diào)用沒有這個(gè)問題。
每次調(diào)用局部函數(shù)時(shí)，通常需要大約相同的時(shí)間才能執(zhí)行。網(wǎng)絡(luò)請(qǐng)求比函數(shù)調(diào)用要慢得多，并且其延遲也很容易變化：在好時(shí)機(jī)，它可能會(huì)在不到一毫秒的時(shí)間內(nèi)完成，但是當(dāng)網(wǎng)絡(luò)擁塞或遠(yuǎn)程服務(wù)超載時(shí)，它可能需要花費(fèi)幾秒鐘的時(shí)間才能完成完全一樣的東西。
調(diào)用本地函數(shù)時(shí)，可以有效地將其引用（指針）傳遞給本地內(nèi)存中的對(duì)象。發(fā)出網(wǎng)絡(luò)請(qǐng)求時(shí)，所有這些參數(shù)都需要編碼為可以通過網(wǎng)絡(luò)發(fā)送的字節(jié)序列。如果參數(shù)是數(shù)字或字符串之類的原語，那沒關(guān)系，但是對(duì)于較大的對(duì)象，很快就會(huì)出現(xiàn)問題。
客戶端和服務(wù)可能以不同的編程語言實(shí)現(xiàn)，因此RPC框架必須將數(shù)據(jù)類型從一種語言轉(zhuǎn)換為另一種語言。由于并非所有語言都具有相同的類型，因此這可能很難實(shí)現(xiàn)-比如說JavaScript的數(shù)字大于2 ^ 53的問題。用單一語言編寫的單個(gè)進(jìn)程中不存在此問題。

所有這些因素都意味著，要使遠(yuǎn)程服務(wù)看起來像您的編程語言中的本地對(duì)象，沒有任何意義，因?yàn)檫@是根本不同的事情。 REST的吸引力之一是它沒有試圖掩蓋它是網(wǎng)絡(luò)協(xié)議的事實(shí)（盡管這似乎并沒有阻止人們?cè)赗EST之上構(gòu)建RPC庫）。

RPC的當(dāng)前方向

盡管存在所有這些問題，但RPC并沒有消失。在之前提到的所有編碼的基礎(chǔ)上，已經(jīng)構(gòu)建了各種RPC框架：例如，Thrift和Avro附帶了RPC支持，gRPC是使用protobuf實(shí)現(xiàn)的RPC，F(xiàn)inagle也使用Thrift，Rest.li則在HTTP上使用JSON 。

對(duì)于遠(yuǎn)程請(qǐng)求與本地函數(shù)調(diào)用不同的事實(shí)，新一代的RPC框架更加明確。例如，F(xiàn)inagle和Rest.li使用futures（promises）來封裝可能失敗的異步操作。Futures還簡(jiǎn)化了您需要并行請(qǐng)求多個(gè)服務(wù)并合并其結(jié)果的情況。 gRPC支持流，其中調(diào)用不僅包括一個(gè)請(qǐng)求和一個(gè)響應(yīng)，還包括一段時(shí)間內(nèi)的一系列請(qǐng)求和響應(yīng)。

這些框架中的某些框架還提供service discovery-即，允許客戶端可以在其中找到特定服務(wù)的IP地址和端口號(hào)。

具有二進(jìn)制編碼格式的自定義RPC協(xié)議可以實(shí)現(xiàn)比JSON over REST等通用功能更好的性能。但是，RESTful API具有其他顯著優(yōu)點(diǎn)：它適合進(jìn)行實(shí)驗(yàn)和調(diào)試（您可以使用Web瀏覽器或命令行工具curl對(duì)其進(jìn)行請(qǐng)求，而無需生成任何代碼或安裝軟件），它受到以下方面的支持：所有主流編程語言和平臺(tái)，以及廣泛的可用工具生態(tài)系統(tǒng)（服務(wù)器，緩存，負(fù)載平衡器，代理，防火墻，監(jiān)視，調(diào)試工具，測(cè)試工具等）。

由于這些原因，REST似乎是公共API的主要樣式。 RPC框架的主要焦點(diǎn)是在同一組織（通常在同一數(shù)據(jù)中心內(nèi)）擁有的服務(wù)之間的請(qǐng)求。

RPC的數(shù)據(jù)編碼和演變

為了發(fā)展，重要的是可以獨(dú)立地更改和部署RPC客戶端和服務(wù)器。與通過數(shù)據(jù)庫的數(shù)據(jù)流相比，對(duì)于通過服務(wù)的數(shù)據(jù)流，我們可以做一個(gè)簡(jiǎn)化的假設(shè)：合理的假設(shè)是首先更新所有服務(wù)器，然后更新所有客戶端。因此，您只需要關(guān)注請(qǐng)求的向后兼容性，以及響應(yīng)的向前兼容性。

RPC方案的向后和向前兼容性屬性是從其使用的任何編碼形式那繼承的：

Thrift，gRPC（protobug）和Avro RPC可以根據(jù)各自編碼格式的兼容性規(guī)則進(jìn)行開發(fā)。
在SOAP中，請(qǐng)求和響應(yīng)是使用XML模式指定的。這些可以演化，但是有一些細(xì)微的小坑。
RESTful API最通常使用JSON（沒有正式指定的架構(gòu)）進(jìn)行響應(yīng)，并使用JSON或URI編碼/表單編碼的請(qǐng)求參數(shù)。通常將添加可選的請(qǐng)求參數(shù)和向響應(yīng)對(duì)象添加新字段視為保持兼容性的更改。

由于RPC通常用于跨組織邊界的通信，因此使服務(wù)兼容性更加困難，因此，服務(wù)的提供者通常無法控制其客戶端，因此無法強(qiáng)制其升級(jí)。因此，可能需要無限期地保持長(zhǎng)時(shí)間的兼容性。如果需要破壞兼容性的更改，則服務(wù)提供商通常最終會(huì)并排維護(hù)多個(gè)版本的服務(wù)API。

對(duì)于API版本控制的工作方式（即客戶端如何指示要使用的API版本），尚無共識(shí)。對(duì)于RESTful API，常見的方法是在URL或HTTP Accept標(biāo)頭中使用版本號(hào)。對(duì)于使用API?密鑰標(biāo)識(shí)特定客戶端的服務(wù)，另一種選擇是將客戶端請(qǐng)求的API版本存儲(chǔ)在服務(wù)器上，并允許通過單獨(dú)的管理界面更新此版本選擇。

傳遞消息的數(shù)據(jù)流

我們一直在研究編碼數(shù)據(jù)從一個(gè)過程流到另一個(gè)過程的不同方式。到目前為止，我們已經(jīng)討論了REST和RPC（其中一個(gè)進(jìn)程通過網(wǎng)絡(luò)將請(qǐng)求發(fā)送到另一個(gè)進(jìn)程并期望盡快響應(yīng)）和數(shù)據(jù)庫（其中一個(gè)進(jìn)程寫入編碼的數(shù)據(jù)，而另一個(gè)進(jìn)程會(huì)在未來的某個(gè)時(shí)間讀取它）。

在最后一部分中，我們將簡(jiǎn)要介紹異步消息傳遞系統(tǒng)，該系統(tǒng)位于RPC和數(shù)據(jù)庫之間。它們與RPC的相似之處在于，客戶端的請(qǐng)求（通常稱為消息）以低延遲傳遞到另一個(gè)進(jìn)程。它們與數(shù)據(jù)庫相似，因?yàn)橄⒉皇峭ㄟ^直接的網(wǎng)絡(luò)連接發(fā)送的，而是通過稱為消息代理message broker（也稱為消息隊(duì)列message queue或面向消息的中間件message-oriented middleware）的中介發(fā)送的，該中介臨時(shí)存儲(chǔ)消息。

與直接RPC相比，使用消息代理有幾個(gè)優(yōu)點(diǎn)：

如果收消息的一方不可用或負(fù)載過重，它可以充當(dāng)緩沖區(qū)，從而提高系統(tǒng)可靠性。
它可以自動(dòng)將消息重新傳遞到已崩潰的進(jìn)程，從而防止消息丟失。
它避免了發(fā)件人需要知道收件人的IP地址和端口號(hào)（這在虛擬機(jī)經(jīng)常來去的云部署中特別有用）。
它允許將一個(gè)消息發(fā)送給多個(gè)收件人。
從邏輯上講，它使發(fā)件人與收件人脫鉤（發(fā)件人只是發(fā)布消息，而不管誰使用消息）。

但是，與RPC的區(qū)別在于，消息傳遞通信通常是單向的：發(fā)件人通常不希望收到對(duì)其消息的回復(fù)。進(jìn)程可以發(fā)送響應(yīng)，但這通常是在單獨(dú)的通道上完成的。這種通信模式是異步的：發(fā)件人無需等待郵件的發(fā)送，而只是發(fā)送它，然后就忘記了。

消息代理message broker

過去，消息代理的格局主要由TIBCO，IBM WebSphere和webMethods等公司的商業(yè)企業(yè)軟件主導(dǎo)。最近，諸如RabbitMQ，ActiveMQ，HornetQ，NATS和Apache Kafka之類的開源實(shí)現(xiàn)已變得很流行。

詳細(xì)的傳遞語義因?qū)崿F(xiàn)和配置而異，但是通常，消息代理的使用方式如下：一個(gè)進(jìn)程將消息發(fā)送到命名隊(duì)列或主題，并且代理確保將消息傳遞給這個(gè)隊(duì)列或主題上的一個(gè)或多個(gè)使用者或訂閱者。同一主題上可能有多個(gè)生產(chǎn)者和許多消費(fèi)者。

一個(gè)主題提供了一個(gè)單向的數(shù)據(jù)流。然而，消費(fèi)者自己也可以發(fā)布消息到另一個(gè)主題上（所以你可以把他們連接在一起），或是由原始消息的發(fā)送者使用的應(yīng)答隊(duì)列（允許請(qǐng)求/響應(yīng)數(shù)據(jù)流，類似于RPC）。

消息代理一般不強(qiáng)制特定的數(shù)據(jù)模型，一條消息就是一串元數(shù)據(jù)的字節(jié)，所以你可以使用任何的編碼。如果編碼是向前并且向后兼容的，那么你就有了最大的靈活度，以任意的順序獨(dú)立的更改發(fā)布者和消費(fèi)者并且部署。

如果消費(fèi)者向另一個(gè)主題發(fā)送消息，那么你需要小心保存不知道的字段，防止之前數(shù)據(jù)庫中描述的數(shù)據(jù)丟失的情況。

分布式參與者框架Distributed actor frameworks

參與者模型actor model是用于在單個(gè)進(jìn)程中進(jìn)行并發(fā)的編程模型。處理邏輯是封裝在每個(gè)參與者中，而不是直接調(diào)用線程處理，每個(gè)參與者通常代表一個(gè)客戶端或?qū)嶓w，它可能具有某種本地狀態(tài)（不與任何其他參與者共享），并且它通過發(fā)送和接收異步消息與其他參與者進(jìn)行通信。無法保證消息傳遞：在某些錯(cuò)誤情況下，消息將丟失。由于每個(gè)參與者每次僅處理一條消息，因此無需擔(dān)心線程問題，并且每個(gè)參與者都可以由框架獨(dú)立安排。

在分布式參與者框架中，這個(gè)編程模型被用來擴(kuò)展了訪問多個(gè)節(jié)點(diǎn)的應(yīng)用程序。同一個(gè)消息傳遞機(jī)制被使用，無論發(fā)送方或接受方是否在同一個(gè)節(jié)點(diǎn)上。如果他們?cè)诓煌墓?jié)點(diǎn)上，消息會(huì)透明地編碼成字節(jié)序列，通過網(wǎng)絡(luò)發(fā)送，在另一邊解碼。

在參與者模型中，Location transparncy比在RPC中工作得更好，因?yàn)閰⑴c者模型已經(jīng)假定即使在單個(gè)進(jìn)程中，消息也可能丟失。盡管網(wǎng)絡(luò)上的等待時(shí)間可能比同一過程中的等待時(shí)間要長(zhǎng)，但是使用參與者模型時(shí)，本地和遠(yuǎn)程通信之間本質(zhì)上的不匹配較少。

分布式參與者框架實(shí)質(zhì)上將消息代理和參與者編程模型集成到單個(gè)框架中。但是，如果要對(duì)基于actor的應(yīng)用程序執(zhí)行滾動(dòng)升級(jí)，則仍然需要擔(dān)心向前和向后的兼容性，因?yàn)橄⒖赡軙?huì)從運(yùn)行新版本的節(jié)點(diǎn)發(fā)送到運(yùn)行舊版本的節(jié)點(diǎn)，反之亦然。

三種流行的分布式actor框架按以下方式處理消息編碼：

默認(rèn)情況下，Akka使用Java的內(nèi)置序列化，不提供前向或后向兼容性。但是，您可以將其替換為“Protocol Buffer”之類的東西，從而獲得滾動(dòng)升級(jí)的功能。
默認(rèn)情況下，Orleans使用自定義數(shù)據(jù)編碼格式，該格式不支持滾動(dòng)升級(jí)部署。要部署應(yīng)用程序的新版本，您需要設(shè)置一個(gè)新集群，將流量從舊集群移到新集群，然后關(guān)閉舊集群。與Akka一樣，可以使用自定義序列化插件。
在Erlang OTP中，很難更改記錄模式（盡管系統(tǒng)具有為高可用性而設(shè)計(jì)的許多功能）；可以進(jìn)行滾動(dòng)升級(jí)，但需要仔細(xì)計(jì)劃。實(shí)驗(yàn)性的新的maps數(shù)據(jù)類型（2014年在Erlang R17中引入的類似JSON的結(jié)構(gòu)）可能會(huì)在將來使此操作變得更容易。

isual Studio Code是一個(gè)免費(fèi)跨平臺(tái)的開源代碼編輯器，具有廣泛的預(yù)構(gòu)建擴(kuò)展庫，具備很多有用的附加功能。但是在使用過程中，我們有時(shí)不需要所有的功能，例如Python擴(kuò)展（超過220萬次安裝）提供很多支持，IntelliSense、代碼格式化等等，而我們往往指示想要快速查汝之行有用且重復(fù)的較小代碼塊，例如循環(huán)或條件語句。

現(xiàn)在已經(jīng)有人編寫了這種小的代碼塊，并且打包好供其他程序員使用。

為什么我們不使用 Visual Studio Code Marketplace，而是要選擇"Snippets"呢？因?yàn)檫@種小的代碼片段不僅可以在擴(kuò)展類別中使用，也適用于不同語言、調(diào)試器、格式化程序等等。

由于 VS Code是運(yùn)行在Windows、Linux和MacOS上的跨平臺(tái)工具，而JavaScript正在成為各種跨平臺(tái)項(xiàng)目的首選編程語言，所以今天就為大家推薦一些實(shí)用的JavaScript代碼片段。評(píng)選標(biāo)準(zhǔn)主要是基于下載次數(shù)、評(píng)級(jí)以及個(gè)人主觀評(píng)估。

JavaScript (ES6) Code Snippets

隨著JavaScript的版本發(fā)展，ES6成為了新的JavaS核心語言標(biāo)準(zhǔn)，主流瀏覽器也實(shí)現(xiàn)了其很多功能。

為了幫助用戶快速上手新功能，開發(fā)者Charalampos Karypidis發(fā)布了JavaScript (ES6) code snippets。

該代碼片段包支持JavaScript和TypeScript，目前下載已超過41.5萬次，評(píng)級(jí)為4.6。自首次發(fā)布以來，Charalampos Karypidis一直都在更新維護(hù)，所以不斷有新功能出現(xiàn)，如1.4.0版本支持用戶請(qǐng)求HTML文件。如果您也對(duì)開源項(xiàng)目有興趣，可以去GitHub上查看補(bǔ)充。

這個(gè)代碼片段包包含34個(gè)小片段： import and export、class helpers、 various methods和console methods。

Angular v4 TypeScript Snippets

最初由Google開發(fā)的AngularJS和Angular（基于TypeScript）的框架全部可以在VS Code extension marketplace 中找到。其余不兼容的框架幾乎總是會(huì)出現(xiàn)在“XX JavaScript框架”類似的文章中。也許你現(xiàn)在還在看這種JavaScript頂級(jí)框架的文章，但是我已經(jīng)在看開發(fā)者John Papa為Angular 4.0.0開發(fā)的Angular v4 TypeScript Snippets。Angular v4 TypeScript Snippets三月剛剛發(fā)布，據(jù)說更快更小，同時(shí)也涵蓋了很多新功能，如ahead-of-time視圖引擎的改進(jìn)，TypeScript 2.1和2.2兼容性，ES2015實(shí)驗(yàn)性構(gòu)建等等。

目前Papa代碼包已經(jīng)被下載5.18萬次，是JavaScript代碼片段中下載量第一。該包中的42個(gè)片段可以分為三大類，TypeScript Angular Snippets、TypeScript RxJS Snippets (Reactive Extensions)和HTML Snippets。

使用該片段的方式與上述ES6片段相同，首先鍵入字母“a”，然后再輸入片段的名稱，直到您選擇所需的選項(xiàng)為止。要插入一個(gè)新組件的shell代碼，例如你開始輸入“a-component”，直到你可以選擇全名，你得到這個(gè)：

Angular v4 TypeScript片段包的平均評(píng)級(jí)為4.8，在GitHub上共獲得312星，以及112位開發(fā)者的支持，擁有MIT認(rèn)證。

Vue 2 Snippets

Vue.js是一個(gè)熱門的JavaScript框架，StackFlow調(diào)查顯示Vue.js已經(jīng)呈現(xiàn)出快速應(yīng)用的趨勢(shì)，是StackFlow年度增長(zhǎng)最快的，Backbone.js, Ember.js和Meteor等框架似乎已經(jīng)開始進(jìn)入到生命周期的后期了。

當(dāng)你還在研究Vue是否能夠打入框架的最前列時(shí)，已經(jīng)有人走在了最前端。hollowtree發(fā)布了Vue 2 Snippets。Vue 2 Snippets基于vue.tmLanguage，支持vue（.vue）、HTML（.html的）、JavaScript（.js）、TypeScript（.ts）和pug（.pug）語言。

請(qǐng)點(diǎn)

該軟件包包含82個(gè)片段，主要用于JavaScript，HTML和Vue Router功能。如果要收集錯(cuò)誤，你可以使用字母“v”鍵入，直到找到VueConfigErrorHandler選項(xiàng)，按下ENTER鍵可以：

Vue.config.errorHandler = function（err，vm）{

//處理錯(cuò)誤

}

所有命令都不以“v”開始，如果要快速插入渲染器，你可以使用字母“r”開始輸入，直到找到渲染器選項(xiàng)，這樣您可以：

const renderer = require（'vue-server-renderer'）.createRenderer（）

如果您必須對(duì)很多選項(xiàng)進(jìn)行排序，那么沒有一致的觸發(fā)器模式可能會(huì)令人困惑，但使用情況會(huì)變得常規(guī)，有一點(diǎn)經(jīng)驗(yàn)。

Vue 2 Snippets的安裝近5.4萬次，獲得了4.9的評(píng)級(jí)，在GitHub上獲得了九顆星，目前的發(fā)展比較積極規(guī)律。

React標(biāo)準(zhǔn)樣式代碼片段

開發(fā)者Timon van Spronsen發(fā)布了React 標(biāo)準(zhǔn)樣式代碼片段，比照ES6 語法中的JavaScript標(biāo)準(zhǔn)樣式指南開發(fā)的React代碼片段。

React是由Facebook創(chuàng)建和開源的流行框架。雖然Spronsen并不是安裝量第一的Reactjs代碼片段，

但是我還是建議希望遵循JavaScript標(biāo)準(zhǔn)樣式的開發(fā)者使用這一產(chǎn)品，它的安裝量達(dá)到21610，同時(shí)也為Karypidis項(xiàng)目提供了支持。

Spronsen說，他的片段基于babel-sublime-snippets package，可預(yù)見地提供了與Karypidis包相同的功能。支持以下文件類型：JavaScript（.js）; TypeScript（.ts）; JavaScript React（.jsx;）和TypeScript React（.tsx）。

它包括51個(gè)片段，其中29個(gè)專門用于支持類型。例如，觸發(fā)器“rccp [TAB key]”在類之后引入了一個(gè)帶有prop類的類組件框架，如下所示：

該軟件包評(píng)論不多，但5.0的評(píng)級(jí)還是比較難得的，GitHub項(xiàng)目獲得了10顆星。

ES6 / ES7的React-Native / React / Redux代碼片段

相信React Native是眾多程序員的心頭之愛，雖然我已經(jīng)安裝了完整的React Native Tools擴(kuò)展，但是我相信EQuimper的ES6 / ES7軟件包的React-Native / React / Redux代碼片段對(duì)于功能需求范圍較窄的程序員來說還是很有吸引力的。

它一共提供了30個(gè)片段，包括從導(dǎo)入到測(cè)試，例如生成組件類的ccs觸發(fā)器，

該代碼片段包雖然已經(jīng)被安裝了36000次，但是遺憾的是現(xiàn)在還沒有評(píng)價(jià)。

Visual Studio Marketplace中僅在代碼片段選項(xiàng)中搜索“JavaScript”就會(huì)出現(xiàn)105個(gè)相關(guān)結(jié)果，而且這些都是免費(fèi)來源的，程序員還可以獲取源代碼，然后根據(jù)自己的需求來做定制化的修改。這么贊的資源，程序員快快行動(dòng)起來吧。

一章職業(yè)規(guī)劃和前景

職業(yè)方向規(guī)劃定位：
web前端開發(fā)工程師
web網(wǎng)站架構(gòu)師
自己創(chuàng)業(yè)
轉(zhuǎn)崗管理或其他
web前端開發(fā)的前景展望：
未來IT行業(yè)企業(yè)需求最多的人才
結(jié)合最新的html5搶占移動(dòng)端的市場(chǎng)
自己創(chuàng)業(yè)做老板
隨著互聯(lián)網(wǎng)的普及web開發(fā)成為企業(yè)的寵兒和核心
web職業(yè)發(fā)展目標(biāo)：
第一、梳理知識(shí)架構(gòu)
負(fù)責(zé)內(nèi)容的HTML
負(fù)責(zé)外觀的css（層疊樣式表）
負(fù)責(zé)行為的js
ps切圖
第二、分解目標(biāo)（起步階段、提升階段、成型階段）
起步階段：
基本知識(shí)的掌握
常用工具的掌握
溝通技巧的掌握（圍繞客戶的需求）
良好的開發(fā)習(xí)慣（加注釋、對(duì)齊方式）
提升階段：
熟悉掌握HTML基本標(biāo)簽和屬性
熟練掌握css的基本語法和使用
瀏覽器兼容和w3c標(biāo)準(zhǔn)的掌握
結(jié)合html+css+js開始系統(tǒng)項(xiàng)目的開發(fā)
成型階段：
精通DIV+CCS布局
精通css樣式表控制html標(biāo)簽
熟悉運(yùn)用js制作動(dòng)態(tài)網(wǎng)站的效果
能獨(dú)立開發(fā)完成網(wǎng)站

第二章 html基本結(jié)構(gòu)

認(rèn)識(shí)HTML：
html不是一種編程語言，是一種標(biāo)志語言
標(biāo)記語言是由一套標(biāo)識(shí)標(biāo)簽組成的
html使用標(biāo)簽來描述網(wǎng)頁
html結(jié)構(gòu)：

<html>
 <head></head>
 <body></body>
</html>

不成對(duì)出現(xiàn)的標(biāo)簽
<br> <hr> <meta> <img> <input..> <option..> <link>
HTML 基本標(biāo)簽的講解：
<html> <head> <body>標(biāo)簽
<h1>—-<h6>僅僅用于標(biāo)題文本，不要為了產(chǎn)生粗體文本使用它們
<p>標(biāo)簽段落標(biāo)簽
<strong><b>標(biāo)簽
都會(huì)讓文字產(chǎn)生加粗效果
<strong>用于強(qiáng)調(diào)文本，強(qiáng)度更深，表示重要文本—>用于SEO優(yōu)化
<b>只是視覺加粗效果—>單純?yōu)榱水a(chǎn)生加粗
<em> <i>標(biāo)簽
em用于強(qiáng)調(diào)文本
i只是視覺斜體效果
<strong>比<em>強(qiáng)調(diào)更強(qiáng)
特殊符號(hào)：
—->空格
> —>大于號(hào)
&lt；—>小于號(hào)
&quot；—>引號(hào)
?–>版權(quán)號(hào)

第三章 html基本標(biāo)簽

HTMl基本標(biāo)簽：
span標(biāo)簽
對(duì)被用來組合文檔中的行內(nèi)元素
注意：span沒有固定的格式表現(xiàn)，當(dāng)對(duì)它應(yīng)用樣式時(shí)，才會(huì)產(chǎn)生視覺上的變化
<pre>標(biāo)簽
文字的格式按源碼的排版來顯示，我們稱之為預(yù)處理格式
<a>標(biāo)簽—>他有一個(gè)必不可少的屬性 href
target屬性：
_self(在原來頁面打開)
_blank（新窗口打開）
_top（打開時(shí)忽略所有的框架）
_parent（在父窗口中打開）
創(chuàng)建錨點(diǎn)和錨鏈接
錨點(diǎn)也是一種超鏈接，是頁面內(nèi)進(jìn)行跳轉(zhuǎn)的超鏈接
第一步：創(chuàng)建錨點(diǎn) <a name="錨點(diǎn)名稱"></a>
第二步：使用創(chuàng)建好的錨點(diǎn)名稱 <a href="#錨點(diǎn)名稱">內(nèi)容</a>
marquee標(biāo)簽
可以創(chuàng)建一個(gè)內(nèi)容滾動(dòng)效果

<marquee direction="down" loop="4" onmouseover=this.stop() onmouseout=this.start()></marquee>

direction 表示滾動(dòng)方向，取值有（left,right,up,down,默認(rèn)left）
loop表示滾動(dòng)循環(huán)的次數(shù)，默認(rèn)為無限循環(huán)

onmouseover=this.stop() onmouseover=this.start() scrollamout="1"(滾動(dòng)速度)

表示當(dāng)鼠標(biāo)移上區(qū)域的時(shí)候停止?jié)L動(dòng)，鼠標(biāo)移開繼續(xù)滾動(dòng)

第四章 img圖片標(biāo)簽與路徑

圖片標(biāo)簽與路徑：
常見圖片格式 jpg png gif
Gif （只支持全透明）
Jpeg /jpg
Png 半/全透明都支持
圖片標(biāo)簽寫法：
<img src="" alt="" width="" height="" />
圖片四要素：
src="" 圖片路徑
alt="" 圖片含義
width="" 圖片寬度和圖片大小保持一致
height="" 圖片高度和圖片大小保持一致
title=""
路徑知識(shí)：
相對(duì)路徑、絕對(duì)路徑：
相對(duì)路徑：(Relative Path) 相對(duì)于該文件的路徑；
絕對(duì)路徑：(Absolute Path) 從磁盤出發(fā)的路徑；
<img src="" …… align="" /> align屬性–設(shè)置圖片與后面文字的位置關(guān)系
值–top、bottom、middle、absmiddle、left、right
在靜態(tài)頁面中：
/開頭表示根目錄；
./表示當(dāng)前目錄；（斜畫線前面一個(gè)點(diǎn)）
../上級(jí)目錄；（斜畫線前面兩個(gè)點(diǎn)）
直接用文件名不帶/也表示同一目錄
這些都是相對(duì)于當(dāng)前文件的位置來說的，如果用絕對(duì)路徑的話就是寫全了。

第五章三種列表的講解

三種列表的知識(shí)講解：
<ul>無序列表
無序列表是一個(gè)沒有順序項(xiàng)目的列表，此列表項(xiàng)默認(rèn)粗體圓點(diǎn)進(jìn)行標(biāo)識(shí)

<ul>
 <li></li>
 <li></li>
 <li></li>
</ul>

有序列表

有序列表也是一列項(xiàng)目，只是列表項(xiàng)目使用的是數(shù)字進(jìn)行標(biāo)記。有序列表始于 <ol> 標(biāo)簽。每個(gè)列表項(xiàng)始于 <li>標(biāo)簽。

<ol>
 <li>內(nèi)容一</li>
 <li>內(nèi)容二</li>
 <li>內(nèi)容三</li>
</ol>

列表符號(hào)
無序列表-列表符號(hào):
type="circle" 空心圓 type=“disc” 實(shí)心圓默認(rèn)值 type="square" 方塊符
有序列表-列表符號(hào)
type="A" A B C D
type="a" a b c d
type="1" 1 2 3 4 默認(rèn)值type=”I” I II III type=”i” i ii iii
列表嵌套
無序列表-嵌套

<ul>
 <li>柚子
 <ul>
 <li>沙田柚</li>
 <li>蜜柚</li>
 </ul>
 </li>
 <li>荔枝</li>
 <li>蘋果</li></ul>

有序列表-嵌套

<ol>
 <li>茶
 <ul>
 <li>紅茶</li>
 <li>綠茶</li>
 </ul>
 </li>
 <li>果汁</li>
 <li>牛奶</li></ol>

定義列表
定義列表不僅僅是一列項(xiàng)目，而是項(xiàng)目及其注釋的組合。定義列表以 <dl> 標(biāo)簽開始。每個(gè)定義列表項(xiàng)以 <dt>開始。每個(gè)自定義列表項(xiàng)的定義以 <dd> 開始。

<dl> 
 <dt>pc網(wǎng)頁制作</dt> 
 <dd>學(xué)習(xí)DIV+CSS JS JQ 項(xiàng)目實(shí)戰(zhàn)</dd> 
 <dt>手機(jī)網(wǎng)頁制作</dt> 
 <dd>手機(jī)網(wǎng)頁制作實(shí)戰(zhàn)</dd>
</dl>

dd是對(duì)dt的解釋
< dl>< /dl>用來創(chuàng)建一個(gè)普通的列表,
< dt>< /dt>用來創(chuàng)建列表中的上層項(xiàng)目，
< dd>< /dd>用來創(chuàng)建列表中最下層項(xiàng)目，
< dt>< /dt>和< dd>< /dd>都必須放在< dl>< /dl>標(biāo)志對(duì)之間。

<dl>
 <dt>中國(guó)城市</dt>
 <dd>北京 </dd>
 <dd>上海 </dd>
 <dd>廣州 </dd>
 <dt>美國(guó)城市</dt>
 <dd>華盛頓 </dd>
 <dd>芝加哥 </dd>
 <dd>紐約 </dd>
</dl>

dl是definition list的縮寫
dt是definition title的縮寫
dd是definition description的縮寫
list-style屬性具有三個(gè)屬性分量：
list-style-position ：設(shè)置列表項(xiàng)圖標(biāo)的位置，位于文本內(nèi)或者文本外
list-style-type：設(shè)置列表項(xiàng)圖標(biāo)的類型
list-style-image：使用圖像設(shè)置列表項(xiàng)圖標(biāo)

第六章表單元素(上)

表單標(biāo)簽:
<form>表單標(biāo)簽
<form>表單是一個(gè)包含表單元素的區(qū)域，包括起來的都是表單的內(nèi)容

<form>
 <input type="text"/>
</form>

HTML標(biāo)簽 - Action和確認(rèn)按鈕：
當(dāng)用戶單擊確認(rèn)按鈕時(shí)，表單的內(nèi)容會(huì)被傳送到另一個(gè)文件。表單的動(dòng)作屬性定義了目的文件的文件名。由動(dòng)作屬性定義的這個(gè)文件通常會(huì)對(duì)接收到的輸入數(shù)據(jù)進(jìn)行相關(guān)的處理。

<form action="html.do" method="get"> 
 username: <input type="text" name="user" /> 
 <input type="submit" value="提 交" />
</form>

HTML標(biāo)簽 - 隱藏域隱藏標(biāo)簽：
隱藏域在頁面中對(duì)于用戶是不可見的，在表單中插入隱藏域的目的在于收集或發(fā)送信息，以利于被處理表單的程序所使用。瀏覽者單擊發(fā)送按鈕發(fā)送表單的時(shí)候，隱藏域的信息也被一起發(fā)送到服務(wù)器

<form> 
 <input type="hidden" name="hid" value="value">
</form>

<input>標(biāo)簽的掌握
常用type類型：
<input type="" name="" value="" />
type="text" 單行文本輸入框
type="password" 密碼（maxlength=""）
type="radio" 單項(xiàng)選擇（checked="checked"）
type="checkbox" 多項(xiàng)選擇
type="button" 按鈕
type="submit" 提交 type="image"圖片提交
type="file" 上傳文件
type="reset"重置
type="hidden" 隱藏
關(guān)于表單中的設(shè)置默認(rèn)值：

<input type="text" name="" value="今天心情不錯(cuò)" />
<input type="radio" name="" value="" checked="checked">
<input type="checkbox" name="" value="" checked="checked">

<select name="" >
 <option value=""></option>
 <option value="" selected="selected"></option>
<select>

textarea沒有默認(rèn)值
<label>標(biāo)簽的使用
<label></label>
label 元素不會(huì)向用戶呈現(xiàn)任何特殊效果。
不過，它為鼠標(biāo)用戶改進(jìn)了可用性。
如果您在 label 元素內(nèi)點(diǎn)擊文本，就會(huì)觸發(fā)此控件。
就是說，當(dāng)用戶選擇該標(biāo)簽時(shí)，瀏覽器就會(huì)自動(dòng)將焦點(diǎn)轉(zhuǎn)到和標(biāo)簽相關(guān)的表單控件上。
<label> 標(biāo)簽的for 屬性應(yīng)當(dāng)與相關(guān)元素的 id屬性相同。
例子：（重要—注冊(cè)表單–用戶體驗(yàn)–必做）

<p>單向選擇</p>
<label for="male">男：</label><input type="radio" name="sex" id="male"/>
<label for="nv">女：</label><input type="radio" name="sex"checked="check"/>

第七章表單和表格(下)

表單和表格標(biāo)簽：
<textarea>文本域標(biāo)簽
<textarea>標(biāo)簽：
<textarea></textarea>是文本域標(biāo)簽，可以在其中插入一段文字內(nèi)容，它有兩個(gè)常用屬性rows和cols
注意：
rows表示這個(gè)文本域有多少行
cols表示這個(gè)文本域有多少列
除了這兩個(gè)屬性它還有readonly（只讀，文本域的內(nèi)容無法改變，相當(dāng)于協(xié)議）和title（鼠標(biāo)放上提示）
<select>標(biāo)簽的掌握
注：當(dāng)提交表單時(shí)，瀏覽器會(huì)提交選定的項(xiàng)目，或者收集用逗號(hào)分隔的多個(gè)選項(xiàng)，將其合成一個(gè)單獨(dú)的參數(shù)列表，并且在將 <select> 表單數(shù)據(jù)提交給服務(wù)器時(shí)包括 name屬性

<form> 
 <select name="" id="">
 <option value="1">1月</option> 
 <option value="2">2月</option> 
</select>
</form>

常用到的屬性：disabled=“disabled” name="sel" size="2"
<table>表格標(biāo)簽
<table>表格標(biāo)簽：<table>是表格標(biāo)簽，可以用它定義一個(gè)表格。

<table border="1">
 <tr>
 <td>姓名</td>
 <td>性別</td>
 </tr>
</table>

注意：<table>的border屬性不能少
<tr> <td>標(biāo)簽的使用
<tr>行標(biāo)簽：
<tr>可以定義表格中的一行，一個(gè)<tr></tr>表示一行。

<table border="1">
<tr>
 <td>姓名</td>
 <td>性別</td>
</tr>
<tr>
 <td>姓名</td>
 <td>性別</td>
</tr>
</table>

<td>單元格標(biāo)簽:
<td>可以定義表格中的一個(gè)單元格，<td></td>表示一個(gè)單元格。

<table border="1">
<tr>
<td >姓名</td>
<td>性別</td>
<td>愛好</td>
</tr>
</table>

border-collapse 屬性設(shè)置是否將表格邊框折疊為單一邊框：
border-collapse:collapse;
colspan左右合并
rowspan上下合并

第一部分總結(jié)：

非可視化標(biāo)簽：head meta style scrpit...
可視化標(biāo)簽：img div span a ul li…
只有可視化標(biāo)簽，才能用css改變它
單標(biāo)簽：meta link base img input br hr
雙標(biāo)簽：html head body div a p span ..ul li ol dl ….
常用可視化標(biāo)簽
div
一般用它來布局
a 超鏈接標(biāo)簽
href*屬性：設(shè)置跳轉(zhuǎn)的網(wǎng)頁地址
target屬性：設(shè)置跳轉(zhuǎn)的目標(biāo)
結(jié)論：凡事頁面可以點(diǎn)擊跳轉(zhuǎn)或者表單提交的文字，都用a標(biāo)簽
img
src*屬性用來設(shè)置圖片的url數(shù)據(jù)
alt提供給搜索引擎搜索的
width
height
結(jié)論：顯示圖片
ul li
列表
結(jié)論：只要將來設(shè)計(jì)頁面中有固定樣式的列表，就用ul和li
table caption tr td (th)
慢慢已經(jīng)被淘汰了被ul li代替
如果是合并豎排的就是合并行（rowspan）
如果是合并橫排的就是合并列（colspan）

HTML部分導(dǎo)圖總結(jié)

HTML5標(biāo)簽集合

學(xué)習(xí)從來不是一個(gè)人的事情，要有個(gè)相互監(jiān)督的伙伴，想要學(xué)習(xí)或交流前端問題的小伙伴可以私信“學(xué)習(xí)”小明加群獲取2019web前端最新入門資料，一起學(xué)習(xí)，一起成長(zhǎng)！

在線咨詢

上一篇：HTML自學(xué)視頻教程，零基礎(chǔ)知道怎么學(xué)了吧
下一篇：快速了解JavaScript文本框操作

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營(yíng)銷服務(wù)商