整合營銷服務(wù)商
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
頁，又叫Web，其實就是一個后綴名為.html的文本文件。HTML文件采用超級文本標(biāo)記語言(HyperText Markup Language)書寫而成，最終由客戶端瀏覽器解釋并呈現(xiàn)給用戶。
Web由HTML內(nèi)容、CSS樣式、JavaScript前端行為三要素組成。開發(fā)一個網(wǎng)頁，就好比設(shè)計一出舞臺劇，首先要決定舞臺上有哪些演員(HTML網(wǎng)頁內(nèi)容)、演員的扮相(CSS網(wǎng)頁樣式)、演員的動作及劇情(JavaScript網(wǎng)頁前端行為)。
HTML使用標(biāo)記標(biāo)簽來描述網(wǎng)頁，標(biāo)記標(biāo)簽是HTML語言中最基本的單位，是HTML中最重要的組成部分。
標(biāo)記是HTML文檔中一些有特定意義的符號，這些符號指明網(wǎng)頁內(nèi)容的含義或結(jié)構(gòu)。
標(biāo)記即標(biāo)簽，不同的標(biāo)記能實現(xiàn)不同的功能。HTML標(biāo)記按功能可大致分為六大類。分別是語義標(biāo)記、元標(biāo)記、文本標(biāo)記、容器標(biāo)記、嵌入式標(biāo)記，以及表單和表單元素標(biāo)記六大類。
(1) 語義標(biāo)記。又稱結(jié)構(gòu)標(biāo)記，是指盡量使用有相對應(yīng)結(jié)構(gòu)含義的HTML標(biāo)記。語義標(biāo)記的逐漸增加便于開發(fā)者閱讀并寫出優(yōu)雅美麗的代碼，同時讓瀏覽器的“爬蟲”和機器更好地解析檢索。在沒有CSS的情況下，語義標(biāo)記讓頁面也能呈現(xiàn)出很好的內(nèi)容、代碼結(jié)構(gòu)。簡而言之，語義標(biāo)記的使用，即是為了網(wǎng)頁“裸奔時也好看”。
(2) 元標(biāo)記。是指位于HTML文件頭部的一些特殊代碼，是解釋說明的標(biāo)記。其主要功能就是對文檔進(jìn)行說明，描述HTML文檔的整體信息。元標(biāo)記向瀏覽者提供某一頁面的附加信息，告訴我們它是誰。當(dāng)客戶機找服務(wù)器要東西時，它幫助一些搜索引擎進(jìn)行頁面分析，使導(dǎo)出的某一頁面檢索信息能正確地放入合適的目錄中。
HTML元標(biāo)記出現(xiàn)于網(wǎng)頁頭標(biāo)簽處，主要包括標(biāo)題標(biāo)記、關(guān)鍵詞標(biāo)記、描述標(biāo)記等，合理運用元標(biāo)記會使網(wǎng)頁在搜索引擎中表現(xiàn)更為突出。
(3) 文本標(biāo)記。這是最重要、最基本的標(biāo)記，一般只能嵌套文本、超鏈接的標(biāo)簽。為了讓網(wǎng)頁中的文本看上去編排有序、整齊美觀、錯落有致，就要設(shè)置文本的標(biāo)題、字號大小、字體顏色、字體類型以及換行、換段等。而為實現(xiàn)這一目的所使用的特定的HTML語言，就叫作文本標(biāo)記。
(4) 容器標(biāo)記。又稱作內(nèi)容組織標(biāo)記，可以簡單地理解為它是能嵌套其他所有標(biāo)簽的標(biāo)簽，是用來裝東西的容器。容器與容器之間也可以相互嵌套，表現(xiàn)為父級容器和子級容器。
如div標(biāo)簽中可以鑲嵌span標(biāo)簽，div可以看作是一個可以裝入其他標(biāo)簽的大容器，span是一個只能裝文本的小容器，大容器當(dāng)然可以放得下小容器。
(5) 嵌入式標(biāo)記。常用于嵌入圖像、音頻、視頻、flash動畫、插件等多媒體元素，使網(wǎng)頁呈現(xiàn)方式更加多樣化，還可以嵌套某些標(biāo)簽來指定視頻文件的路徑或者網(wǎng)址路徑，決定多媒體元素的屬性和播放方式等。
(6) 表單和表單元素標(biāo)記。多用于制作網(wǎng)頁和用戶交互的界面、控件，是客戶端與服務(wù)器端進(jìn)行信息交流的途徑。用戶可以使用諸如文本域、列表框、復(fù)選框及單選按鈕之類的表單元素輸入信息，然后單擊某個按鈕提交這些信息。
如果說HTML語言規(guī)定了網(wǎng)頁的具體內(nèi)容，那么CSS(cascading style sheets)就是為了給這些內(nèi)容進(jìn)行規(guī)整和裝飾而存在的。CSS最初的誕生，就是因為HTML為了滿足頁面設(shè)計者的顯示要求而變得臃腫復(fù)雜，因而需要一種樣式表語言達(dá)到控制頁面呈現(xiàn)內(nèi)容的效果。CSS讓整個頁面可視化程度更強，可以說是網(wǎng)頁的門面。如果將網(wǎng)頁比作一個舞臺，HTML是舞臺上的演員，那么CSS就是演員的扮相，更完美地將節(jié)目(即頁面內(nèi)容)呈現(xiàn)在觀眾面前。
CSS即層疊樣式表。作為一種用來表現(xiàn)HTML或者XML的計算機語言,CSS可以對網(wǎng)頁元素位置的排版進(jìn)行像素級別的精確控制,可以靜態(tài)地修飾網(wǎng)頁,也可以配合腳本語言(如后文會提到的JavaScript)動態(tài)地格式化網(wǎng)頁元素。
所謂層疊，是即樣式可以層層疊加。
每個HTML元素都有一組樣式屬性,它們可以通過CSS來設(shè)定。這些屬性涉及背景(background)、字體(fonts)、顏色(color)、鏈接(link)、邊框(border)、列表樣式(url)等。CSS就是一種先選擇HTML元素,然后設(shè)定選中元素屬性的機制。
CSS選擇器和要應(yīng)用的樣式構(gòu)成了一條CSS規(guī)則。
CSS規(guī)則由兩個主要的部分構(gòu)成：選擇器及一條或多條聲明。選擇器(selector)就是想要改變樣式的HTML元素;每條聲明(declaration)由一個屬性(property)和一個值(value)構(gòu)成。屬性是想要設(shè)置的樣式屬性(style attribute),每個屬性有一個值。屬性和值被冒號(:)分開,CSS聲明總是以分號(;)結(jié)束,聲明組以大括號({ })括起來。
JavaScript最早是由Netscape Communication(網(wǎng)景)公司開發(fā)出來的一種客戶端腳本語言,將JavaScript代碼直接嵌入在HTML頁面中，能對HTML頁面中的HTML、CSS和JavaScript本身進(jìn)行增加、刪除、修改、查詢等操作，使得客戶端靜態(tài)頁面變成支持用戶交互并響應(yīng)相應(yīng)事件的動態(tài)頁面(DHTML=HTML+CSS+JavaScript)。它的出現(xiàn)彌補了HTML語言的缺陷，使得開發(fā)客戶端Web應(yīng)用程序成為可能。
HTML Web運行在瀏覽器中，這就是說瀏覽器是Web的實際運行環(huán)境。如果將運行環(huán)境視為一個京劇表演的舞臺，則在這個舞臺上有網(wǎng)頁內(nèi)容HTML(演員)、網(wǎng)頁樣式CSS(演員的扮相)、網(wǎng)頁行為JavaScript(演員的動作)。JavaScript只能在自己的舞臺上表演，能對舞臺上的既有存在(HTML、CSS、JavaScript)進(jìn)行操作(增、刪、改、查)，而不能跨越到舞臺外面表演(功能受限，JavaScript程序不能操作瀏覽器之外的事物)。
更進(jìn)一步思考與觀察，會發(fā)現(xiàn)兩個有趣的現(xiàn)象:
① 當(dāng)網(wǎng)站被服務(wù)器軟件架設(shè)起來時(如同京劇正式開演)，由于遵守網(wǎng)絡(luò)安全協(xié)議，JavaScript這個演員的功能受限于表演的舞臺(也就是瀏覽器客戶區(qū))。也就是說，此時JavaScript是存在功能受限的，能對HTML、CSS、JavaScript進(jìn)行增刪改查，而不能對瀏覽器客戶區(qū)之外做任何事情，如不能操作硬盤等本地資源等。為了在互聯(lián)網(wǎng)上搭建網(wǎng)站，讓所有人都能看到的，還需要租用域名、空間。
② 當(dāng)直接雙擊運行本地Web文件時(如同京劇在做排練)，JavaScript的功能相對不受限制。此時JavaScript可以訪問本地資源，如讀取本機IP、操縱本地文件系統(tǒng)等。但這樣架設(shè)的Web不能被他人通過網(wǎng)絡(luò)訪問，也不能被百度檢索。事實上，我們可以在本地放置無數(shù)個網(wǎng)頁，只要我們的硬盤容量足夠大。
JavaScript包含了三個部分的內(nèi)容：JavaScript腳本語言規(guī)范EMCAScript(語言核心)、文檔對象模型DOM(以面向?qū)ο蟮姆绞讲倏v文檔內(nèi)容)、瀏覽器對象模型BOM(以面向?qū)ο蟮姆绞讲倏v瀏覽器窗口元素)。
3.1 語言核心EMCA Script
EMCA 是歐洲計算機制造商協(xié)會(EuropeanComputer Manufacturers Association)的縮寫，EMCAScript就是這個協(xié)會制定的標(biāo)準(zhǔn)化腳本語言。我們知道，JavaScript是一門編程語言，而每一種語言都有它自己的基本語法如數(shù)據(jù)類型等，這些概念必須遵循一定的規(guī)范，瀏覽器開發(fā)者要嚴(yán)格依據(jù)這個規(guī)范來開發(fā)編譯器，JavaScript程序員要嚴(yán)格依據(jù)這個規(guī)范來調(diào)用API。也就是說，EMCAScript是JavaScript的語法規(guī)范，規(guī)定了JavaScript腳本的核心內(nèi)容。打個比方，新華字典(也算是一種語言規(guī)范)規(guī)定了“血”這個字，而無論在“血液”中的讀“xuè”，還是在“血暈”中的讀“xiě”。新華字典規(guī)范了漢字，EMCAScript規(guī)范了JavaScript。
3.2 文檔對象模型DOM
文檔對象模型(document object model)是針對HTML和XML文檔的應(yīng)用程序編程接口。DOM 把整個頁面規(guī)劃成由多個節(jié)點構(gòu)成的文檔，我們可以用DOM API將頁面內(nèi)容繪制成一個樹狀圖。在這種模型下，頁面中的每個部分都是可用程序操縱的節(jié)點，我們可以通過DOM 來方便地控制頁面的結(jié)構(gòu)和內(nèi)容(增加、刪除、修改、查詢等)，如我們就可以用document.getElementById()通過id號來查詢文檔中的元素。DOM 使得用戶頁面可以動態(tài)地變化，用戶可以和Web文檔內(nèi)容進(jìn)行交互。
3.3 瀏覽器對象模型
瀏覽器對象模型BOM(browser object model)是針對瀏覽器的應(yīng)用程序編程接口。我們可以通過BOM 對瀏覽器窗口進(jìn)行訪問和操作，例如彈出新的瀏覽器窗口，移動、關(guān)閉和更改瀏覽器窗口，提供詳細(xì)的網(wǎng)絡(luò)瀏覽器信息(navigator object)、詳細(xì)的頁面信息(location object)、詳細(xì)的用戶屏幕分辨率的信息(screen object)等。BOM 方便我們從瀏覽器上獲得信息，更好地和瀏覽器進(jìn)行交互。例如，我們可以用window.alert()彈出消息框，用window.prompt()彈出提示框，使得用戶可以和瀏覽器窗口進(jìn)行交互。
點擊沒同選項卡，實現(xiàn)如下切換效果：
代碼：
<html>
<head>
<title>tab control</title></head>
<style type="text/css">
#tab{
position:relative;/* 定義選項卡的為相對定位，使其子級元素有定位參考對象 */
width:45%;
height:400px;
}
#tab h4{
display:inline;
background-color:#ccc;
color:black;
}
#tab div{
border:1px #666 solid;
position:absolute; /*tab下的div疊在一起*/
top:28px;
left:0px;
width:100%;
height:370px;
display:none;
}
#tab .block{
display:block;
}
#tab .up{
color:#999999;
background-color:black;
}
</style>
<script>
function tabSwitch(tab,ao) {
var h = document.getElementById(tab).getElementsByTagName("h4");
var d = document.getElementById(tab).getElementsByTagName("div");
var n = document.getElementById(tab).getElementsByTagName("div").length;
for (var i = 0; i < n; i++) {
if (ao - 1 == i) {
h[i].className += " up";
d[i].className += " block";
} else {
h[i].className = " ";
d[i].className = " ";
}
}
}
</script>
<body>
<div id="tab">
<h4 onclick="tabSwitch('tab',1)" class="up">道德經(jīng)</h4>
<h4 onclick="tabSwitch('tab',2)" >岳陽樓記</h4>
<h4 onclick="tabSwitch('tab',3)" >中庸</h4>
<div class="block">
<p>上善若水。</p>
<p>水善利萬物而不爭，處眾人之所惡，故幾於道。</p>
<p>居善地，心善淵，與善仁，言善信，正善治，事善能，動善時。</p>
<p>夫唯不爭，故無尤。</p>
</div>
<div>
<p>不以物喜，不以己悲</p>
<p>惟江上之清風(fēng)，與山間之明月</p>
<p>耳得之而為聲，目遇之而成色</p>
</div>
<div>
<p>博學(xué)，審問，慎思，明辨，篤行。</p>
<p>學(xué)之要能，問之要知，思之要得，辨之要明，行之要篤。</p>
<p>雖愚必明，雖柔必強。</p>
</div>
</div>
</body>
</html>ref：
王小峰《大話Web開發(fā)：基于知識管理角度》
－End－
本系列文章旨在記錄和總結(jié)自己在Java Web開發(fā)之路上的知識點、經(jīng)驗、問題和思考，原來已經(jīng)分享在我的CSDN博客，現(xiàn)在分享在頭條，希望能幫助更多碼農(nóng)和想成為碼農(nóng)的人。版權(quán)聲明：本文為CSDN博主「普通的碼農(nóng)」的原創(chuàng)文章，遵循CC 4.0 by-sa版權(quán)協(xié)議，轉(zhuǎn)載請附上原文出處鏈接及本聲明。原文鏈接：https://blog.csdn.net/liyongyan1202/article/details/89064944
前面的文章多次使用到了HTML（HyperText Markup Language，中文就是超文本標(biāo)記語言）。這門語言可以使用任何的文本編輯器進(jìn)行編寫，寫出的文檔就是網(wǎng)頁，只要將文件名以后綴 .html 結(jié)尾，瀏覽器就可以解釋該文檔，并以一定的格式呈現(xiàn)出來。
HTML是Web前端三劍客之一，主要是負(fù)責(zé)數(shù)據(jù)的結(jié)構(gòu)、框架或骨架，表示哪些數(shù)據(jù)是標(biāo)題啊、主體啊、導(dǎo)航啊、鏈接啊、表格啊、段落啊、圖片啊、音頻、代碼啊等。簡而言之，就是表示數(shù)據(jù)是什么。
HTML的核心思想很簡單，就是給你的信息打標(biāo)記，舉個例子：
<這是一篇文章> <這是標(biāo)題>XX爆炸性新聞</這是標(biāo)題> <這是段落> 某年某月某日，某某發(fā)生某事。。。 </這是段落> <這是段落> 其他事情。。。 </這是段落> </這是一篇文章>
尖括號 < > 及其里面的詞就是標(biāo)記或者標(biāo)簽，只不過HTML標(biāo)準(zhǔn)里面用的是英文單詞，我這只是用中文的詞來說明這個思想。
標(biāo)記有開始標(biāo)記和結(jié)束標(biāo)記，結(jié)束標(biāo)記里面多一個正斜杠，就是 </ > 。
真正的信息（就是要呈現(xiàn)給用戶看的）就寫在開始標(biāo)記和結(jié)束標(biāo)記之間，這就是標(biāo)記的內(nèi)容。有時候沒有內(nèi)容，開始標(biāo)記和結(jié)束標(biāo)記可以合二為一，變成 < /> ，就是把正斜杠寫到右尖括號前面，或者省略正斜杠。
標(biāo)記及其內(nèi)容合起來叫做元素，比如例子中的開始標(biāo)記<文章>和結(jié)束標(biāo)記</文章>及其之間的內(nèi)容就是一個元素。可以看到元素可以嵌套，就是元素里面的內(nèi)容可以再次包含元素，不過開始標(biāo)記和結(jié)束標(biāo)記要注意遙相呼應(yīng)，事實上，編寫的時候可以采用縮進(jìn)來增加層次感且不易出錯。
元素還有屬性，屬性可以有屬性值，也可以沒有，這些后面再討論。這里要提到的是一個編寫規(guī)范，不管是標(biāo)記、屬性還是值，習(xí)慣上都采用英文小寫單詞用連字符（就是短橫線、減號）相連。表單中的需要發(fā)往Web服務(wù)器的數(shù)據(jù)可以使用后端的開發(fā)規(guī)范。
每一個元素都可以設(shè)置一個id屬性，其值必須在該網(wǎng)頁中是唯一的。
目前HTML的版本是HTML5，大多數(shù)瀏覽器版本都支持大部分常用的特性。再次強調(diào)，HTML的主要思想就是給你的信息打標(biāo)記，這些標(biāo)記表示數(shù)據(jù)的結(jié)構(gòu)、框架或骨架，就是語義，至于數(shù)據(jù)如何呈現(xiàn)（比如呈現(xiàn)在哪個位置，什么顏色、字體、背景等等）和動態(tài)行為是由CSS（層疊樣式表，Cascading Style Sheets）和JavaScript來負(fù)責(zé)。它們都由瀏覽器來解釋執(zhí)行。
HTML5的網(wǎng)頁基本都有如下結(jié)構(gòu)：
<!DOCTYPE html> <html lang="zh-cmn-hans"> <head> <meta charset="utf-8" /> <title>這里是網(wǎng)頁的標(biāo)題</title> </head> <body> </body> </html>
可以看到，基本結(jié)構(gòu)就是由各種標(biāo)記組成的，只不過標(biāo)記使用的是英文單詞，而且這些標(biāo)記都是標(biāo)準(zhǔn)化（這樣各家瀏覽器都能識別）了的，瀏覽器必須識別它們。這些標(biāo)記也很語義化（這樣人類能容易識別，便于開發(fā)和維護(hù)網(wǎng)頁），基本上都是使用語義相對應(yīng)的英文單詞或縮寫，這也是理所當(dāng)然的，便于記憶和使用嘛。
基本結(jié)構(gòu)里面包含以下幾點：
但是，僅僅告訴瀏覽器使用何種字符編碼還不行，網(wǎng)頁文檔本身在使用文本編輯器編寫完保存的時候，必須使用該字符編碼來保存；通過網(wǎng)絡(luò)傳輸?shù)脑挘莻鬏敃r也必須使用該字符編碼來傳輸。
就好像我給你寫了一封信，信上指示你說要用英語來讀這封信，但信的內(nèi)容卻是用中文寫的，那么你還是不能讀這封信。這里我使用了普遍采用的utf-8這種字符編碼，Web上基本都用這個，它能表示全球各個語言中的字符，而且占用字節(jié)數(shù)較少。字符編碼也是比較復(fù)雜但很重要的內(nèi)容，這里暫且不說；
OK，每個網(wǎng)頁都有這個基本結(jié)構(gòu)，剩下的就是往<body>元素里面添加你的各種信息了。
首先，我們可以向<body>元素里面添加文本，畢竟文字在我們的生活中占據(jù)很重要的位置，特別是在古代。文字可以寫成小說、劇本、新聞、資訊等等。添加文本很簡單，直接在元素里面敲文字（各種語言都行）就可以了。
如果光是這樣的話，那就談不上說HTML負(fù)責(zé)數(shù)據(jù)的結(jié)構(gòu)、框架或骨架了。不錯，HTML還提供了很多標(biāo)記來描述數(shù)據(jù)，這里先說一些常用的。
寫文章的時候通常要為文章起標(biāo)題，而且有文章的總標(biāo)題，副標(biāo)題，文章內(nèi)容相關(guān)的放在同一個標(biāo)題下，標(biāo)題下又可能有若干個子標(biāo)題，就類似文檔的大綱似的。所以，HTML提供了<h1>、<h2>、<h3>、<h4>、<h5>、<h6>這六個標(biāo)記來說明標(biāo)題的語義。我們試試給信息打上這些標(biāo)記會是什么樣子，先看代碼：
<!DOCTYPE html> <html lang="zh-cmn-hans"> <head> <meta charset="utf-8" /> <title>這里是網(wǎng)頁的標(biāo)題</title> </head> <body> <h1>這是一級標(biāo)題</h1><h2>這是一級標(biāo)題</h2> <h3>這是一級標(biāo)題</h3><h4>這是一級標(biāo)題</h4> <h5>這是一級標(biāo)題</h5><h6>這是一級標(biāo)題</h6> </body> </html>
我特地把這些信息兩個一行來寫，看看瀏覽器是怎么處理的：
可以看到，瀏覽器會把各級標(biāo)題的字體大小顯示的不太一樣，一級標(biāo)題最大，六級標(biāo)題最小。大多數(shù)瀏覽器都會這么處理。
那么問題來了，不是說HTML只負(fù)責(zé)信息的語義，不負(fù)責(zé)信息是如何展示的嗎？話雖如此，給不同語義的信息來個默認(rèn)的展示效果，不就省的我們還要再寫信息如何展示的代碼了嘛。這又再一次體現(xiàn)了契約優(yōu)先（本質(zhì)就是由默認(rèn)值）的思想。這就是說我們還是可以修改這些各級標(biāo)題是如何展示的，比如字體、顏色等等，這就要用到CSS了。
注意，瀏覽器可以關(guān)閉CSS和JavaScript，就是讓這兩個技術(shù)不起作用，從這個角度看，給標(biāo)記設(shè)置默認(rèn)的展示效果也有這方面的原因。
雖然標(biāo)記有默認(rèn)的展示效果，但我們一定不能為了獲得這些類似的展示效果而強行給某些信息打上標(biāo)記，而是應(yīng)該使用CSS去獲得這些展示效果。比如，不能為了加大字體就強行把不是標(biāo)題的內(nèi)容打上<h1>標(biāo)記，這應(yīng)該交給CSS去做，是否打上<hn>標(biāo)記（n代表1、2、3、4、5、6）應(yīng)該考慮該內(nèi)容在語義上是否是標(biāo)題！
第二點很重要的是，明明代碼里面兩個標(biāo)題一行，為何瀏覽器展示的效果確是每個標(biāo)題占一行？
這是因為HTML規(guī)定了某些標(biāo)記有個作用，瀏覽器遇到它就必須另起一行來展示，有這個作用的標(biāo)記就叫塊級標(biāo)記，沒有這個作用的就是行級標(biāo)記（不知道是否可以這么劃分，通常的劃分方式是塊級標(biāo)記是里面可以嵌套其他標(biāo)記的，行級標(biāo)記是里面不可以嵌套其他標(biāo)記的）。
事實上，HTML規(guī)定文本里面的格式（縮進(jìn)、換行、多個連續(xù)的空格等等）都沒用，瀏覽器會把這些格式壓縮成一個空格。比如下面的代碼實際展示的是一行：
<body> 這是第一段。。。 這是第二段。。。 這是第三段。。。 </body>
展示效果成了：
這是第一段。。。 這是第二段。。。 這是第三段。。。
除了表示標(biāo)題的標(biāo)記以外，還有其他很多作用于文本，甚至是整個語義上的布局的標(biāo)記，下面僅僅使用一段代碼來展示比較常用的標(biāo)記，不做過多解釋說明。
<!DOCTYPE html> <html lang="zh-cmn-hans"> <head> <meta charset="utf-8" /> <title>這里是網(wǎng)頁的標(biāo)題</title> </head> <body> <header> <h1>這里是網(wǎng)頁的頁眉，里面可以有導(dǎo)航</h1> <nav> 這里是整個頁面的導(dǎo)航按鈕。。。 </nav> </header> <main><!-- 一個頁面往往只有一個主體部分 --> <article><!-- 這里也可以使用通用容器標(biāo)記<div> --> <header> <h2>這里是主體的頁眉，可以有主體的導(dǎo)航/目錄、介紹等等</h2> <nav> 這里是目錄 </nav> <p>這里是介紹</p> </header> <article> <h2>這里是第一篇文章</h2> <p>這里是段落一</p> <p>這里是段落二</p> <p>。。。</p> </article> <article> <h2>這里是第二篇文章</h2> <section> <h3>這里是第二篇文章的第一部分</h3> <p>與上面類似</p> </section> <section> <h3>這里是第二篇文章的第二部分</h3> <p>與上面類似</p> </section> </article> </article> </main> <aside> <h2>這里是附注，往往跟主體內(nèi)容相關(guān)性沒那么強，但比較獨立，瀏覽器上通常會顯示主體的兩側(cè)</h2> </aside> <footer> <p>這里是整個頁面的頁腳，通常放一些版權(quán)聲明、隱私政策之類的。</p> </footer> </body> </html>
涉及到布局的標(biāo)記有：
涉及到文本內(nèi)容的標(biāo)記有：
還有很多用來標(biāo)記文本的，比如表示重要性的<strong>、表示強調(diào)的<em>、表示圖的<figure>和<figcaption>、表示引用或參考的<cite>、表示引述文本的<blockquote>和<q>、表示代碼的<code>等等。
以上這些標(biāo)記在我們的Java Web開發(fā)中暫時用不到，所以都不討論。
鏈接可以說是網(wǎng)頁的靈魂，正是它才能形成Web。表示信息是一個鏈接的標(biāo)記是<a>。下面舉例：
<!DOCTYPE html> <html lang="zh-cmn-hans"> <head> <meta charset="utf-8" /> <title>這里是網(wǎng)頁的標(biāo)題</title> </head> <body> <nav> <ul> <li><a >CSDN</a></li> <li><a >百度</a></li> </ul> </nav> <p> 這里是某些文本。。。有些<a href="dir/file.html">東西</a>需要人們在另一個網(wǎng)頁中查看 </p> <nav> <ul> <li><a href="#question1">What is HTML?</a></li> <li><a href="#question2">How does HTML work?</a></li> </ul> </nav> <article> <h1 id="question1">What is HTML?</h1> <p> HTML is ... <br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> </p> <h2 id="question2">How does HTML work?</h2> <p> HTML is explained by browser ... </p> </article> <p></p> </body> </html>
在瀏覽器上呈現(xiàn)這樣：
上面的例子中<ul>標(biāo)記表示是一個無序列表，<li>表示是列表中的一項。我們將CSDN、百度和東西打上<a>標(biāo)記，表示它們都是一個鏈接，用鼠標(biāo)點擊它們可以看到指定的另一個網(wǎng)頁。<br>表示需要換行，這里用來模擬頁面很長導(dǎo)致看不見question2。
可以看到，瀏覽器為列表、鏈接都設(shè)置了默認(rèn)的樣式，鼠標(biāo)移到鏈接上會變成手型。
鏈接必須要有一個href屬性，其值就是目標(biāo)網(wǎng)頁的URL，當(dāng)然可以是本網(wǎng)站內(nèi)部的其他網(wǎng)頁，也可以是外部網(wǎng)站某個網(wǎng)頁，甚至是本網(wǎng)頁中的其他部分（需要使用元素的id屬性，如例子所示）。
表單允許用戶向Web服務(wù)器提交數(shù)據(jù)，而不是僅僅用瀏覽器向Web服務(wù)器索要網(wǎng)頁。
最常用的表單應(yīng)該要數(shù)登錄表單了。用戶通過輸入用戶名和密碼，點擊登錄按鈕向Web服務(wù)器發(fā)起登錄請求。
表單使用標(biāo)記<form>，在<form>添加供用戶輸入信息的其他內(nèi)容，常用的有文本框、密碼框、單選按鈕、復(fù)選按鈕、下拉列表選擇框以及最后的提交按鈕。我們先簡單介紹文本框、密碼框以及提交按鈕，其他的以后再介紹。
先上代碼：
<!DOCTYPE html> <html lang="zh-cmn-hans"> <head> <meta charset="utf-8" /> <title>這里是網(wǎng)頁的標(biāo)題</title> </head> <body> <form method="post" action="login-success.html"> <label for="user-name">用戶名：</label><input type="text" id="user-name" name="userName" /> <label for="password">密碼：</label><input type="password" id="password" name="password" /> <input type="submit" value="登錄"/> </form> </body> </html>
再看看瀏覽器上的呈現(xiàn)：
第一點，從呈現(xiàn)上看，用戶名和密碼都是文本框，不過，密碼的文本框會將輸入信息屏蔽，<input>標(biāo)記使用type屬性來區(qū)分各類輸入方式：text是文本框、password是密碼框、radio是單選按鈕、checkbox是復(fù)選按鈕等。
其次，我為標(biāo)記指定了id和name兩個屬性，id屬性用于<label>標(biāo)記的for屬性，從而將兩個元素關(guān)聯(lián)起來，這樣，鼠標(biāo)如果點擊其內(nèi)容，其關(guān)聯(lián)的元素也會獲得焦點（就是在文本框內(nèi)出現(xiàn)了不斷閃爍的輸入光標(biāo)）。
而name屬性用于標(biāo)識用戶輸入的該項數(shù)據(jù)，這樣Web服務(wù)器才能根據(jù)該名字取出對應(yīng)的數(shù)據(jù)，可以理解為Web服務(wù)器應(yīng)用程序中的變量名，或者參數(shù)名。
所以，name屬性的值通常遵循后端應(yīng)用程序的開發(fā)規(guī)范，由于我們以后是使用Java Servlet技術(shù)作為后端應(yīng)用的開發(fā)技術(shù)（還有PHP、Python、Go等技術(shù)），所以遵循Java的變量名命名規(guī)范（采用駝峰形式，比如userName）。
通常，表單中的每一項輸入都會有一個關(guān)聯(lián)的<label>元素，用于呈現(xiàn)，總不能光出現(xiàn)一個文本框在那吧，這樣用戶如何知道輸入什么數(shù)據(jù)呢！它有一個for屬性，用來指定關(guān)聯(lián)元素的id。
提交按鈕也是使用<input>標(biāo)記，type屬性值是submit，還有一個value屬性，用來指定按鈕上呈現(xiàn)的文字。
最后，回過頭來看<form>標(biāo)記，它必須指定一個action屬性，它的值通常是后端應(yīng)用中處理用戶提交數(shù)據(jù)的一個程序的URL，比如可以是login.servlet、login.jsp、login.php、login.asp等等，后綴名通常表明了采用的后端應(yīng)用開發(fā)技術(shù)。當(dāng)然，我的例子里直接指定了一個HTML頁面（login-success.html，你需要創(chuàng)建這么一個頁面，相信你已經(jīng)知道怎么創(chuàng)建了！），相當(dāng)于不處理用戶提交的數(shù)據(jù)，一般不能這么做！
那么，用戶提交的數(shù)據(jù)是如何提交到Web服務(wù)器的呢？答案當(dāng)然就是HTTP啊，瀏覽器使用HTTP來向Web服務(wù)器請求網(wǎng)頁，再用它來向Web服務(wù)器提交數(shù)據(jù)也就理所當(dāng)然了啊。瀏覽器會將用戶輸入的信息封裝成HTTP的報文格式，最后通過網(wǎng)卡發(fā)送出去。
在這篇文章提到過，HTTP報文里面含有HTTP方法，常用的有GET、POST等。<form>標(biāo)記的method屬性就是用于指定提交數(shù)據(jù)的HTTP方法。默認(rèn)值是get，但通常使用post，一方面get的語義就是獲取而不是提交。另一方面get會將表單數(shù)據(jù)作為參數(shù)直接暴露在瀏覽器的地址欄里面。最后get提交的數(shù)據(jù)不能太大。
我們把上述代碼中的元素的method屬性值修改為get，保存，然后用瀏覽器打開，輸入用戶名和密碼后點擊提交，效果呈現(xiàn)如下：
可以看到，使用GET方法提交表單數(shù)據(jù)會在URL上附加上你的數(shù)據(jù)，同時也可以看到<input>標(biāo)記的name屬性值在這所起的作用，就是參數(shù)名的作用。
到此為止，我們就先介紹這么多，我們來總結(jié)一下：
CSDN 編者按】“如果我們把人類文明想象成汽車的話，那么軟件開發(fā)行業(yè)就相當(dāng)于汽車的引擎，編程語言就像引擎的燃料。”作為一名開發(fā)者，需跟隨技術(shù)潮流的發(fā)展來學(xué)習(xí)新技術(shù)。2020年，你有計劃新學(xué)一門編程語言嗎？
本文作者從一名架構(gòu)師的角度，詳細(xì)分析了7種現(xiàn)代編程語言的優(yōu)點與功能，你對哪門語言最感興趣呢？
作者 | Md Kamaruzzaman，軟件架構(gòu)師
譯者 | 彎月，責(zé)編 | 伍杏玲
封圖| CSDN 下載于視覺中國
出品 | CSDN（ID：CSDNnews）
以下為譯文：
如果我們把人類文明想象成汽車的話，那么軟件開發(fā)行業(yè)就相當(dāng)于汽車的引擎，而編程語言就像引擎的燃料。作為一名開發(fā)者，今年你應(yīng)該學(xué)習(xí)哪種編程語言呢？
學(xué)習(xí)一種新的編程語言無疑是時間、精力和智力上的巨大投資， 但是學(xué)習(xí)一種新的編程語言可以提升你的軟件開發(fā)技術(shù)力，促進(jìn)你的職業(yè)發(fā)展。
在這里，我將獻(xiàn)上一份現(xiàn)代編程語言的列表，這些語言不僅有助于提高你的生產(chǎn)力，而且還可以促進(jìn)你的職業(yè)發(fā)展，并讓你成長為更優(yōu)秀的開發(fā)人員。這份列表還涵蓋了非常廣泛的領(lǐng)域：系統(tǒng)編程、應(yīng)用程序開發(fā)、Web開發(fā)、科學(xué)計算等。
什么是現(xiàn)代編程語言？
“現(xiàn)代編程語言”這個說法本身就很含糊。許多人認(rèn)為Python和JavaScript等語言是現(xiàn)代編程語言，還認(rèn)為Java是一種古老的編程語言。實際上，這幾種語言大約在同一時間出現(xiàn)：1995年。
大多數(shù)主流編程語言是上個世紀(jì)開發(fā)的：七十年代（如C）、八十年代（如C ++）、九十年代（如Java、Python、JavaScript）。這些語言在設(shè)計上并沒有考慮現(xiàn)代軟件開發(fā)生態(tài)系統(tǒng)：多核CPU、GPU、快速的互聯(lián)網(wǎng)、移動設(shè)備、容器和云等。盡管許多語言中的許多功能都已進(jìn)行一些改進(jìn)，如并發(fā)等，而且在不斷調(diào)整自己以適應(yīng)時代，但它們依然保留了向后兼容性，無法拋棄那些過時的舊功能。
在這方面，Python就做得很好（某種意義上也未必是好事），Python 2和Python 3兩者之間有明確的分界線。很多語言常常會為解決同一個問題提供十余種的方法，同時又沒有顧及到開發(fā)人員的感受。根據(jù)StackOverflow的開發(fā)人員調(diào)查，大多數(shù)舊時的主流編程語言在“最可怕的語言”排名都名列前茅：
如果非要在新舊編程語言之間劃個界限的話，那么應(yīng)該是2007年6月29日，也就是第一臺iPhone發(fā)行的時候。在這之后，編程語言界發(fā)生了很大變化。因此，在本文的列表中，我只考慮2007年以后的編程語言。
為什么要學(xué)習(xí)新語言？
首先，現(xiàn)代編程語言充分利用現(xiàn)代計算機硬件（多核CPU、GPU、TPU）、移動設(shè)備、大量數(shù)據(jù)、高速互聯(lián)網(wǎng)、容器和云的優(yōu)勢。大多數(shù)現(xiàn)代編程語言會關(guān)注開發(fā)人員的體驗，比如：
簡潔明了的代碼（減少樣板代碼）
內(nèi)置的并發(fā)支持
空指針安全
類型推斷
簡潔的功能集
降低學(xué)習(xí)難度
融合所有編程范例的最佳功能
本文列表的許多編程語言都帶有革命性地變化，并將永久地改變軟件行業(yè)。一些已成為主流編程語言，還有一些則有望取得突破。因此選擇這些語言作為第二種編程語言是明智的做法。
Rust
一直以來，系統(tǒng)編程語言環(huán)境主要由靠近硬件的語言（如C、C ++等）主導(dǎo)。盡管它們可以完全控制程序和硬件，但是它們?nèi)狈?nèi)存安全性。即使它們支持并發(fā)，使用C/C ++編寫并發(fā)程序也很困難，因為沒有并發(fā)安全性。還有一些流行的編程語言是解釋性語言，例如Java、Python、Haskell。這些語言具備安全性，但需要龐大的運行時或虛擬機。由于它們的運行時間長，因此Java等語言不適合于系統(tǒng)編程。
許多人曾嘗試將C/C ++的功能與Java、Haskell的安全性相結(jié)合。然而，Rust才是第一個成功實現(xiàn)了這一點的編程語言。
Graydon Hoare在業(yè)余項目中開發(fā)出了Rust，他的靈感來自研究編程語言Cyclone。Rust是開源的，由Mozilla與許多其他公司和社區(qū)一起領(lǐng)導(dǎo)這門語言的開發(fā)。Rust于2015年首次發(fā)布，并很快引起了社區(qū)的關(guān)注。
主要特征：
通過所有權(quán)和借用概念提供內(nèi)存安全和并發(fā)安全。
內(nèi)存安全和并發(fā)安全在編譯時確保，即如果程序代碼可以編譯，那么內(nèi)存既安全又沒有數(shù)據(jù)競爭。這是Rust最吸引人的功能。
它還提供了Haskell中元編程的表現(xiàn)力。憑借不可變的數(shù)據(jù)結(jié)構(gòu)和功能編程功能，Rust提供了功能并發(fā)和數(shù)據(jù)并發(fā)。
Rust的速度非常快，純Rust的性能甚至優(yōu)于純C。
在沒有運行時的情況下，Rust可以完全控制現(xiàn)代硬件（TPU、GPU、多核CPU）。
Rust具有LLVM支持。因此，Rust提供一流的與WebAssembly的互操作性，而且Web代碼也非常快。
流行度：
自2015年首次亮相以來，Rust已被開發(fā)人員廣泛接受，并在StackOverflow開發(fā)人員調(diào)查中連續(xù)四年（2016、2017、2018、2019）被評選為最受歡迎的語言：
根據(jù)GitHub Octoverse的調(diào)查，Rust是運行速度第二快的語言，僅次于Dart：
此外，根據(jù)編程語言流行度排名網(wǎng)站PyPl的數(shù)據(jù)，Rust排名第18位，并呈上升趨勢：
對比Rust提供的功能集，我們就會明白為什么微軟、亞馬遜、Google等科技巨頭相繼宣布投資Rust作為一種長期的系統(tǒng)編程語言。
根據(jù)Google統(tǒng)計的趨勢，在過去的5年中，Rust的熱度每年都在增加。
主要用途：
系統(tǒng)編程
Serverless 計算
商業(yè)應(yīng)用
主要競爭對手：
C
C++
Go
Swift
Go
在本世紀(jì)初，Google面臨兩個擴展問題：開發(fā)擴展和應(yīng)用程序擴展。開發(fā)擴展問題指的是他們不能僅通過投入開發(fā)人員的方式來添加更多功能。應(yīng)用程序擴展問題則指他們無法開發(fā)出一款能夠擴展到Google級別的計算機集群的應(yīng)用程序。
所以在2007年左右，Google創(chuàng)建了一種新的編程語言，用于解決這兩個擴展問題。兩位才華橫溢的Google軟件工程師Rob Pike（UTF-8）和Ken Thompson（UNIX OS）創(chuàng)建了一種新語言。
2012年，Google正式發(fā)布了第一版的Go編程語言。Go是一種系統(tǒng)編程語言，但與Rust不同，它還具有Runtime和垃圾收集器（幾兆字節(jié)）。但是與Java或Python不同，這個Runtime包含了生成的代碼。最后，Go生成了一個本地的二進(jìn)制代碼，可以在沒有附加依賴項或運行時的情況下在計算機中運行。
主要特征：
Go具有一流的并發(fā)支持。Go不通過線程和鎖提供“共享內(nèi)存”并發(fā)性，因為編程難度太大。相反，它提供了基于CSP的消息傳遞并發(fā)性（基于Tony Hoare的論文）。Go使用“ Goroutine”（輕量級綠色線程）和“ Channel”進(jìn)行消息傳遞。
Go最大的殺手級功能是：簡單，它是最簡單的系統(tǒng)編程語言。新手軟件開發(fā)人員只需幾天就可以編寫高效的代碼，就像Python一樣。有些大規(guī)模的云原生項目（如Kubernetes、Docker）都是用Go編寫的。
Go還內(nèi)置了垃圾收集器，這意味著開發(fā)人員無需擔(dān)心C/C++中的內(nèi)存管理問題。
Google投入了大量資金打造Go。因此Go擁有大量的工具支持。新手Go開發(fā)人員擁有大量的工具生態(tài)系統(tǒng)。
一般，開發(fā)人員80%的時間都花在了維護(hù)現(xiàn)有代碼上，用于編寫新代碼的時間只占20%。由于其簡單性，Go在語言維護(hù)方面表現(xiàn)出色。如今，Go在業(yè)務(wù)應(yīng)用程序中大量使用。
流行度：
Go一問世就受到了軟件開發(fā)社區(qū)熱烈的歡迎。2009年-2018年，Go一直在TIOBE編程語言排行榜上徘徊。Go的成功為Rust等新一代編程語言鋪平了道路。
如今，Go已是主流編程語言。最近，Go團(tuán)隊宣布了有關(guān)“Go 2”的消息，這門編程語言的發(fā)展會更加穩(wěn)固。
幾乎在所有的流行編程語言排行榜中，Go的排名都很高，已超過許多現(xiàn)有的語言。自2019年12月以來，在TIOBE指數(shù)排名中，Go名列第15位：
根據(jù)StackOverFlow的調(diào)查，十大最受喜愛的編程語言中，Go也位列其中：
此外，根據(jù)GitHub的數(shù)據(jù)，Go也是十大發(fā)展最迅速的語言之一：
Google趨勢顯示，在過去的5年中，Go的熱度每年都在增加。
主要用途：
系統(tǒng)編程
Serverless 計算
商業(yè)應(yīng)用
云原生開發(fā)
主要競爭對手：
C
C++
Rust
Python
Java
Kotlin
Java 是企業(yè)軟件開發(fā)領(lǐng)域無可爭議的王者。近年來，Java受到了一些負(fù)面評論：過于冗長，大量樣板代碼，容易出現(xiàn)意外的復(fù)雜性。但是，關(guān)于Java虛擬機（JVM）的爭論卻很少。JVM是軟件工程的杰作，經(jīng)過了時間的考驗，提供了硬核的runtime。
多年來，Scala等JVM語言一直在努力克服Java的缺點，想成為更好的Java，但他們都失敗了。最終，這場提升Java的探索以Kotlin的誕生結(jié)束。Jet Brains（流行的IDE IntelliJ背后的公司）開發(fā)了Kotlin，它可以在JVM上運行，克服了Java的很多缺點，提供許多現(xiàn)代功能。
與Scala不同的是，Kotlin比Java更簡單，還可在JVM中提供與Go或Python開發(fā)人員同等的生產(chǎn)力。
Google宣布Kotlin是一流的Android應(yīng)用開發(fā)語言，因此Kotlin在社區(qū)中的接受度得到了大幅提高。自2017年以來，同樣受歡迎的Java Enterprise框架Spring也開始支持Kotlin。我曾嘗試結(jié)合Kotlin與Reactive Spring使用，體驗非常棒。
主要特征：
Kotlin的主要賣點在于其語言設(shè)計。我總是將Kotlin視為JVM上的Go/Python，因為它簡潔明了的代碼。因此，Kotlin的生產(chǎn)力很高。
與許多其他現(xiàn)代語言一樣，Kotlin提供了指針、安全性、類型推斷等功能。
由于Kotlin也運行在JVM中，因此現(xiàn)有Java庫龐大的生態(tài)系統(tǒng)都可供使用。
Kotlin是一流的Android應(yīng)用開發(fā)語言，并且已經(jīng)超過Java，成為開發(fā)Android應(yīng)用的首選。
Kotlin得到了JetBrains和Open Source的支持，因此具有出色的工具支持。
Kotlin有兩個有趣的項目：Kotlin Native（將Kotlin編譯為原生代碼）和kotlin.js（Kotlin到JavaScript）。如果成功，則可以在JVM外部使用Kotlin。
Kotlin還提供了一種簡單的方式來編寫DSL（域特定語言）。
流行度：
自2015年首次發(fā)布以來，Kotlin的知名度不斷飆升。根據(jù)Stack Overflow，Kotlin是2019年第四大最受歡迎的編程語言：
Kotlin還是增長最快的編程語言之一，排名第四：
在流行編程語言排名網(wǎng)站PyPl的排名中，Kotlin名列第十二名，并具有較高的上升趨勢：
自從Google宣布Kotlin是一流的Android應(yīng)用開發(fā)語言以來，Kotlin的流行趨勢出現(xiàn)了大幅上漲，如下所示：
主要用途：
企業(yè)應(yīng)用程序
Android應(yīng)用開發(fā)
主要競爭對手：
Java
Scala
Python
Go
TypeScript
JavaScript是一門優(yōu)秀的編程語言，在2015年之前，JavaScript有很多缺點。著名的軟件工程師Douglas Crockford寫了一本書名為《JavaScript: The Good Parts》，暗示了JavaScript有很糟的部分。無模塊化，還有“回調(diào)地獄”，因此開發(fā)人員都不喜歡維護(hù)特別大的JavaScript項目。
Google甚至還開發(fā)了一個平臺，可將Java代碼反編譯為JavaScript代碼（GWT）。許多公司和個人都曾嘗試開發(fā)更好的JavaScript，例如CoffeeScript、Flow、ClojureScript。最終，微軟的TypeScript取得了成功。
微軟的一隊工程師在著名的Anders Hejlsberg的帶領(lǐng)下，創(chuàng)建了JavaScript的靜態(tài)類型、模塊化超集——TypeScript。
TypeScript可以編譯為JavaScript。于2014年首次發(fā)布后，TypeScript很快引起了社區(qū)的關(guān)注。Google當(dāng)時還計劃開發(fā)JavaScript的靜態(tài)類型超集。Google對TypeScript青睞有加，以至于他們沒有開發(fā)新的語言，而是選擇與微軟合作改進(jìn)TypeScript。
Google選擇TypeScript作為其SPA框架Angular 2+的主要編程語言。此外，流行的SPA框架React也提供對TypeScript的支持。另一個流行的JavaScript框架Vue.js也宣布將使用TypeScript開發(fā)新的Vue.js 3：
另外，node.js的創(chuàng)建者Ryan Dahl已決定使用TypeScript來開發(fā)安全的Node.js替代品Deno。
主要特征：
與Go或Kotlin同樣，TypeScript的主要特征也是語言設(shè)計。TypeScript憑借其簡潔明快的代碼，成為了目前最優(yōu)雅的編程語言之一。就開發(fā)人員的生產(chǎn)力而言，它與JVM或Go/Python上的Kotlin并駕齊驅(qū)。TypeScript是生產(chǎn)力最高的JavaScript超集。
TypeScript是JavaScript的強類型超集，特別適合大型項目，而且可以稱為“可擴展的JavaScript”。
單頁應(yīng)用程序框架的“三巨頭”（Angular、React、Vue.js）為TypeScript提供了出色的支持。在Angular中，TypeScript是首選的編程語言。在React和Vue.js中，TypeScript越來越受歡迎。
最大的兩家技術(shù)巨頭：微軟和Google正在合作開發(fā)由活躍的開源社區(qū)支持的TypeScript。因此，TypeScript擁有最好的工具支持。
由于TypeScript是JavaScript的超集，因此凡是可以運行JavaScript的任何地方都可以運行TypeScript，包括瀏覽器、服務(wù)器、移動設(shè)備、物聯(lián)網(wǎng)設(shè)備和云。
流行度：
開發(fā)人員喜歡TypeScript的優(yōu)雅語言設(shè)計。在StackOverFlow最受歡迎的語言類別的調(diào)查中，TypeScript與Python并列第二名：
根據(jù)GitHub的排名，TypeScript是增長最快的編程語言之一，排名第五：
從GitHub的貢獻(xiàn)度來看，TypeScript排名第七，打進(jìn)了前十：
Google的趨勢表明，在過去的幾年中，TypeScript的熱度越來越高：
主要用途：
Web UI開發(fā)
服務(wù)器端開發(fā)
主要競爭對手：
JavaScript
Dart
Swift
當(dāng)初喬布斯拒絕在iOS中支持Java（和JVM），他認(rèn)為Java不再是主流編程語言。如今我們發(fā)現(xiàn)喬布斯當(dāng)初的估計是錯的，雖然iOS仍然不支持Java。蘋果選擇了Objective-C作為iOS中的首選編程語言。Objective-C是一門很難掌握的語言，它不支持現(xiàn)代編程語言所要求的高生產(chǎn)力。
后來，蘋果的Chris Lattner和其他人開發(fā)了一種多范例、通用的、編譯編程語言——Swift，來替代Objective-C。Swift的第一個穩(wěn)定版本于2014年發(fā)布。Swift還支持LLVM編譯器工具鏈（也由Chris Lattner開發(fā)）。Swift與Objective-C代碼庫具有出色的互操作性，并且已確立為iOS應(yīng)用開發(fā)中的主要編程語言。
主要特征：
Swift的殺手級功能之一是其語言設(shè)計。語言本身很簡單，語法簡潔，比Objective-C更高效。
Swift還提供了現(xiàn)代程序語言的功能：安全。此外，它還提供了語法糖來避免“厄運金字塔”。
作為一種編譯語言，Swift和C++一樣快。
Swift支持LLVM編譯器工具鏈。因此，我們可以在服務(wù)器端編程，甚至瀏覽器編程（使用WebAssembly）中使用Swift。
Swift提供了自動引用計數(shù)（ARC）支持，可抑制內(nèi)存管理的不善。
流行度：
開發(fā)人員對Swift的喜愛不亞于許多其他現(xiàn)代編程語言。根據(jù)StackOverflow的調(diào)查，Swift在最受歡迎的編程語言中排名第六：
2019年，在TIOBE的編程語言排名中，Swift的排名上升到了第10名。鑒于這種編程語言只有5年的歷史，可以說是成績斐然：
Google的趨勢表明，在過去的幾年中，Swift的熱度出現(xiàn)了激增：
主要用途：
iOS應(yīng)用開發(fā)
系統(tǒng)編程
客戶端開發(fā)（通過WebAssembly）
主要競爭對手：
Objective-C
Rust
Go
Dart
Dart是Google出品的第二大編程語言。Google是Web和Android領(lǐng)域的巨頭，因此Google在Web和應(yīng)用領(lǐng)域開發(fā)自己的編程語言也不足為奇。在丹麥軟件工程師Lars Bak（領(lǐng)導(dǎo)Chrome的 JavaScript V8引擎開發(fā)）的帶領(lǐng)下，Google于2013年發(fā)布了Dart。
Dart是一種通用編程語言，支持“強類型”和“面向?qū)ο蟆本幊獭art也可以轉(zhuǎn)編譯為JavaScript，凡是JavaScript可以運行的任何地方（例如Web、移動、服務(wù)器）幾乎都可以運行 Dart。
主要特征：
與Go一樣，Dart也非常注重開發(fā)人員的工作效率。由于Dart簡潔的語法，以及高效的生產(chǎn)力，受到開發(fā)人員的喜愛。
Dart還提供“強類型”和“面向?qū)ο蟆本幊獭?/p>
Dart是少數(shù)同時支持JIT編譯（運行時編譯）和AOT編譯（創(chuàng)建時編譯）的編程語言之一。因此，Dart可以針對JavaScript運行時（V8引擎），并且Dart可以編譯為快速的原生代碼（AOT編譯）。
跨平臺原生應(yīng)用程序開發(fā)平臺Flutter選擇了Dart作為開發(fā)iOS和Android應(yīng)用的編程語言。從那以后，Dart的流行度越來越高。
與Goog的Go編程語言一樣，Dart也具有出色的工具支持和龐大的Flutter生態(tài)系統(tǒng)。Flutter的日益普及也會推動Dart的采用率升高。
流行度：
根據(jù)GitHub Octoverse數(shù)據(jù)顯示，Dart是2019年增長最快的編程語言，去年它的流行度增長了五倍：
根據(jù)TIOBE指數(shù)顯示，Dart排名第23，僅用了4年時間就超過了很多其他的現(xiàn)代編程語言：
根據(jù)StackOverflow的調(diào)查，Dart在最受歡迎的編程語言中排名第12：
受Flutter的影響，Google的趨勢表明，在過去的兩年中，Dart的熱度急劇上升：
主要用途：
應(yīng)用開發(fā)
UI開發(fā)
主要競爭對手：
JavaScript
TypeScript
Julia
本文提及的大多數(shù)編程語言都是由大型公司開發(fā)的，但Julia是個例外。科技計算領(lǐng)域通常都會使用動態(tài)語言，例如Python、Matlab。雖然這些語言提供易于使用的語法，但不適用于大規(guī)模的科技計算。他們需要使用C/C ++庫執(zhí)行CPU密集型任務(wù)，因此這就產(chǎn)生了著名的“兩種語言”的問題，因為他們需要粘合代碼來綁定兩種語言。由于編寫的代碼需要在兩種語言之間來回切換，因此總是會損失部分性能。
為了解決這個問題，麻省理工學(xué)院的一隊研究人員計劃從頭開始創(chuàng)建一種新的語言，這種語言既可以利用現(xiàn)代硬件的優(yōu)勢，而且還結(jié)合其他語言的優(yōu)勢。于是，Julia誕生了。
Julia是一種動態(tài)的高級編程語言，提供一流的并發(fā)、并行和分布式計算支持。Julia的第一個穩(wěn)定版本于2018年發(fā)布，并很快受到社區(qū)和行業(yè)的關(guān)注。Julia可用于科學(xué)計算、人工智能和許多其他領(lǐng)域，而且還可以解決“兩種語言”的問題。
主要特征：
與Rust一樣，Julia的主要特征在于語言的設(shè)計。這種語言在不犧牲性能的情況下，將高性能和科學(xué)計算中現(xiàn)有編程語言的一些功能結(jié)合在一起。就目前的情況來看，Julia出色地完成了這項任務(wù)。
Julia是一種動態(tài)編程語言，支持類型系統(tǒng)但類型不是必須的。因此，Julia這種編程語言很容易學(xué)習(xí)，生產(chǎn)力很高。
Julia的核心是多調(diào)度編程范例。
Julia內(nèi)部支持并發(fā)、并行和分布式計算。
Julia為I/O密集型任務(wù)提供異步I/O。
Julia的運行速度非常快，可用于需要數(shù)百萬個線程的科學(xué)計算。
流行度：
Julia在許多領(lǐng)域主要與Python競爭。由于Python是最流行的編程語言之一，因此Julia想晉升主流還需要幾年的時間。
雖然Julia非常新（只有一歲），但仍在TIOBE指數(shù)中排到第43名：
Google趨勢顯示，在過去的一年中，Julia的熱度在穩(wěn)步增長：
但是考慮到Julia的功能集，以及NSF、DARPA、NASA、因特爾等公司的推動，相信Julia取得突破的進(jìn)展只是時間的問題。
主要用途：
科學(xué)計算
高性能計算
數(shù)據(jù)科學(xué)
可視化
主要競爭對手：
Python
Matlab
原文鏈接：https://towardsdatascience.com/top-7-modern-programming-language-to-learn-now-156863bd1eec
本文為 CSDN 翻譯，轉(zhuǎn)載請注明來源出處。
*請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
