App下載

學(xué)習(xí)JavaScript中的基本概念

萌夠才回家 2021-08-30 11:57:13 瀏覽數(shù) (2300)
反饋

對(duì)于初學(xué)者來說,Javascript 乍一看似乎很容易,因?yàn)樗念愃朴?C 的語法......

不管它的運(yùn)行方式如何,對(duì)語言 (ESNext) 及其框架所做的不斷變化可能會(huì)讓初學(xué)者不知所措。
我來這里是為了消除圍繞我認(rèn)為是一種美麗但最重要的是一種利潤豐厚的語言的困惑

利潤豐厚,因?yàn)?JS 幾乎可以輕松完成您今天想做的任何事情。

  • 想要構(gòu)建一個(gè) Web 應(yīng)用程序?沒問題。
  • 想要構(gòu)建 CLI 工具?沒問題。
  • 想要構(gòu)建桌面應(yīng)用程序?噗。做起來比說的容易!

每天提供的越來越多的包和庫表明 JS 在構(gòu)建軟件應(yīng)用程序時(shí)是多么抽象。

然而,JS 似乎受到了很多人的討厭,主要是因?yàn)榕c競爭對(duì)手相比,它是多么的非傳統(tǒng)。任何可能錯(cuò)過 JS 理論方面的人都會(huì)感到困惑。

許多人在深入研究 Javascript 之前忽略了 Javascript 的理論方面。這些概念幫助我們了解構(gòu)建 Javascript 應(yīng)用程序時(shí)所采用的不同路徑和模式。這些模式存在于 JS Land 的每個(gè)框架中,因此在學(xué)習(xí)語言本身之前了解這些概念很有意義。

代碼

JS的特點(diǎn)

(1) 多范式

Javascript 支持過程式、面向?qū)ο蠛褪录?qū)動(dòng)的函數(shù)式編程!
掌握 JS 的面向?qū)ο缶幊田L(fēng)格可以證明是非常有益的。

面向?qū)ο缶幊炭蓭椭绦騿T更輕松地可視化軟件應(yīng)用程序的組件。
此外,學(xué)習(xí) Typescript(Javascript with Types)可以讓程序員輕松實(shí)現(xiàn)行業(yè)中最好的設(shè)計(jì)模式。這些設(shè)計(jì)模式用于以最有效的方式解決軟件編程中遇到的最常見問題。

這種多功能性使 Javascript 非常平易近人,但也非常強(qiáng)大。

(2) 解釋

Javascript 與 C/C++ 不同,其中,不是一次讀取程序,而是逐行解釋。這就是說 JS 會(huì)比 C/C++ 等編譯語言慢。

警告: Javascript 在運(yùn)行時(shí)是一種非常被動(dòng)的語言而臭名昭著。對(duì)錯(cuò)誤進(jìn)行故障排除非常困難。

不過不要灰心。隨著時(shí)間和練習(xí),您將學(xué)會(huì)如何舒適地航行。最常見的錯(cuò)誤涉及你的變量返回NULL值。當(dāng)此類問題確實(shí)出現(xiàn)時(shí),請(qǐng)前往 Stack Overflow,因?yàn)槲蚁蚰惚WC,無論錯(cuò)誤多么小眾,你都不是第一個(gè)遇到錯(cuò)誤的人。然而,console.log()在你的項(xiàng)目進(jìn)行開發(fā)時(shí)自由地使用它總是一個(gè)好主意。這可以幫助你準(zhǔn)確找出程序生命周期中的時(shí)刻,你的變量可能已經(jīng)脫落。

(3) 單線程

Javascript 一次只能執(zhí)行一項(xiàng)任務(wù)。它根據(jù)類型將不同的任務(wù)排隊(duì)到不同的隊(duì)列中。
在最抽象的意義上,Javascript 基本上會(huì)將同步任務(wù)和異步任務(wù)分組,并將它們分開排隊(duì)。

同步任務(wù)是在遇到它們時(shí)立即處理的語句,即它們立即運(yùn)行。這些任務(wù)包括日志語句、變量聲明、條件檢查等。

異步任務(wù)涉及可能需要可變時(shí)間來返回輸出的任務(wù)。異步任務(wù)的一個(gè)示例可能是從 Web API 請(qǐng)求信息。

此外,Javascript 還有一個(gè) Job Queue,用于處理名為 Promises 的 JS Feature。

通過右鍵單擊此網(wǎng)頁并點(diǎn)擊檢查選項(xiàng)卡,實(shí)際上可以看到 Javascript 的單線程特性。接下來,轉(zhuǎn)到剛剛打開的窗口上的控制臺(tái)選項(xiàng)卡。輸入以下代碼并按回車鍵。

while(true) {}

您現(xiàn)在可以觀察到此頁面完全沒有響應(yīng)。這是因?yàn)榇隧撁嫔系?Javascript 現(xiàn)在正忙于運(yùn)行我們上面執(zhí)行的無限 while 循環(huán)。

(4) 非阻塞

我們之前已經(jīng)討論過異步任務(wù)。由于 JS 在單線程環(huán)境中運(yùn)行,默認(rèn)情況下,它不等待任何人!

異步代碼塊只有在所有同步代碼塊都執(zhí)行完后才會(huì)執(zhí)行,而不管代碼在程序中的位置如何。


console.log("I'm the first statement")

setTimeout(()=> {
console.log("I'm the second statement")
},1000)

console.log("I'm the third statement")

此處console.log()將其中的語句記錄到控制臺(tái)。
上述setTimeout()函數(shù)在一秒鐘后運(yùn)行第二條語句。

在檢查輸出時(shí)

I'm the first statement
I'm the third statement
I'm the second statement

我們可以看到第三條語句在第二條語句之前記錄。這是因?yàn)?JS 處理同步和異步代碼塊的固有方法。

替換文字

(5) 高層

JavaScript 是一種高級(jí)語言。高級(jí)語言可能只是意味著它們更接近人類所說的語言。高級(jí)語言能夠提供更多功能來幫助程序員更好地表達(dá)他們正在嘗試構(gòu)建的內(nèi)容。

Javascript 的這種高級(jí)特性有助于它最好地服務(wù)于 Web 的客戶端部分。過去 JS 的一個(gè)主要限制是它只能在客戶端提供服務(wù),而不能像大多數(shù)服務(wù)器端語言那樣進(jìn)行文件操作。

然而,這已經(jīng)改變了NodeJS,允許開發(fā)人員使用 Javascript 來構(gòu)建后端服務(wù)器。因此,只需使用一種語言,軟件開發(fā)人員就可以在服務(wù)器端和客戶端進(jìn)行操作。這導(dǎo)致全棧工程師變得突出。

(6) 動(dòng)態(tài)類型

Javascript 是一種動(dòng)態(tài)類型語言。這意味著與需要為變量指定數(shù)據(jù)類型的 C 不同,我們可以type-inference在 Javascript 中使用來自動(dòng)檢測數(shù)據(jù)的類型,變量保存。

// In C variables must have datatypes. In order to change datatypes from one type to //another , we need to use type-casting
int a = 5;
char b = "a";
float c = 7.036;

在 Javascript 中,我們使用letconst分別聲明變量或常量。

let a = 5
console.log(a) // 5
a = 'Hello World'
console.log(a) // Hello World

const b = 'JS is awesome' 
console.log(b) // JS is awesome

b = 'I changed my mind'
console.log(b) // Error: const cannot be changed

雖然類型推斷因其易于使用而看起來是一個(gè)加分點(diǎn),但對(duì)于需要類型安全作為功能的大型項(xiàng)目來說,它立即成為一個(gè)騙局。

出于這個(gè)原因,較大的項(xiàng)目使用 TypeScript,它只是 Javascript 的包裝器,提供類型、接口和各種其他功能。

學(xué)習(xí)策略

在 JS Land 中安頓下來需要一段時(shí)間,但我有一個(gè)簡單的清單,Minimum Requirements用于學(xué)習(xí) Express 或 ReactJS 等框架。

首先,不要急于學(xué)習(xí)這些框架。花點(diǎn)時(shí)間掌握 Vanilla Javascript。

基礎(chǔ)知識(shí)

  1. 變量和常量
  2. 條件塊(if-else)
  3. 循環(huán)(for、while、forEach)
  4. 開關(guān)盒
  5. 職能

這些是必不可少的編程基礎(chǔ)。

高級(jí)部分(最低要求)

  1. 異步/等待
  2. 承諾
  3. Javascript 中的類
  4. 休息/傳播語法
  5. 數(shù)組/對(duì)象迭代器
  6. 數(shù)組解構(gòu)
  7. 模塊(導(dǎo)入、導(dǎo)出)

在構(gòu)建項(xiàng)目時(shí)繼續(xù)學(xué)習(xí),很快,你就會(huì)對(duì)語言有很強(qiáng)的掌握。


0 人點(diǎn)贊