建站
咨詢
售后
建站咨詢
新聞中心
[[269412]]
創(chuàng)新互聯(lián)建站專注于企業(yè)成都營銷網(wǎng)站建設(shè)、網(wǎng)站重做改版、東安網(wǎng)站定制設(shè)計(jì)、自適應(yīng)品牌網(wǎng)站建設(shè)、HTML5建站、商城網(wǎng)站定制開發(fā)、集團(tuán)公司官網(wǎng)建設(shè)、外貿(mào)網(wǎng)站制作、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁設(shè)計(jì)等建站業(yè)務(wù)，價(jià)格優(yōu)惠性價(jià)比高，為東安等各大城市提供網(wǎng)站開發(fā)制作服務(wù)。
對很多人來說，學(xué)寫代碼很難。本文將通過編寫與眾不同且富有詩意的代碼來克服學(xué)習(xí)代碼最初遇到的困難。如果你是個(gè)JavaScript新手，或者是在編程學(xué)習(xí)過程中遇到了困難，本文介紹的方法也許可以幫到你。
為什么學(xué)習(xí)編程這么難?
以下是人們對編程很難學(xué)及JavaScript(或任何編程語言)很枯燥的一些誤解：
- 代碼晦澀難懂令人望而生畏，只有實(shí)用功能毫無樂趣;
- 代碼僅適用于機(jī)器，人們無法與它交流或參與其中;
- 代碼不算一種語言，因?yàn)樗c一般語言的用法截然不同，形式上的差別也很大;
- 提到程序員，人們就會(huì)想到邪惡的黑客或黑客帝國的成員等刻板形象，因此沒有認(rèn)同感。
[[269413]]
未接觸編程的人
開發(fā)人員需要以一種非常特殊的方式看待代碼，甚至要以一種完全不同且高度邏輯化的方式來思考。編程語言非常嚴(yán)格，對錯(cuò)誤零容忍，單個(gè)字符就可能使機(jī)器無法理解人們的意思，并使應(yīng)用程序奔潰。學(xué)習(xí)編程時(shí)，應(yīng)將之前學(xué)習(xí)人類語言時(shí)的讀寫規(guī)則歸零(順便說一下，在學(xué)習(xí)一種新的人類語言時(shí)也是如此)。
但并非網(wǎng)上的編程語言、文檔或視頻教程都是針對“從人類語言到編程語言的轉(zhuǎn)換”這一思維而編寫的。當(dāng)然，他們也沒有必要這樣做。畢竟，寫代碼的主要是為了告訴機(jī)器要做什么。
鑒于此目的，沒有機(jī)會(huì)對這兩種語言進(jìn)行比較，因此人類的語言(包括詞匯和語法規(guī)則)似乎對學(xué)習(xí)編程語言毫無用處。JavaScript語言中沒有“愛”這個(gè)詞，“我愛你?！边@句話在其中也沒有意義。機(jī)器(或?yàn)g覽器)根本不理解愛。這種“聞所未聞”、“無從下手”的感覺可能會(huì)讓人感到害怕。
[[269414]]
***次接觸編程的人
這就是本文的意義所在，借助已掌握的人類語言知識(shí)，將JavaScript看作一種人類語言，以一種更容易、更具藝術(shù)性的方式來學(xué)習(xí)它。舉個(gè)小例子來說明吧!
一個(gè)有趣的事實(shí)是，一些編程語言實(shí)際上已經(jīng)從一種編程語言轉(zhuǎn)換到另一種編程語言。這就是為什么掌握多種編程語言變得簡單多了——只學(xué)一門編程語言就夠啦。
一個(gè)小例子
例如，在很多情況下，要想運(yùn)行JavaScript代碼，需要準(zhǔn)備好“文檔”(基本上是網(wǎng)站，用戶每次訪問時(shí)都在下載)，以便與HTML元素進(jìn)行交互。在純JavaScript語言中，可能會(huì)偶然發(fā)現(xiàn)以下內(nèi)容。
- (function() {
- // Your code goes here
- })();
或者有時(shí)像這樣：
- if (document.readyState === ‘complete’) {
- // Your code goes here
- }
上述***個(gè)代碼肯定需要加以解釋，而對第二個(gè)代碼(也許需要一些想象)，可以這樣理解：滿足了必需的某個(gè)條件后，后續(xù)步驟僅通過觀察就能進(jìn)行下去。
試想這樣的場景：
- onceUponATime(function () {
- // Your code (story) goes here
- })
連小孩都能理解“Once upon a time” (“曾幾何時(shí)”)這樣的內(nèi)容。這種內(nèi)容在與開發(fā)者對話(通過喚起他們的童年回憶)，同時(shí)在理論上也能做開發(fā)。這就是“讓人類語言轉(zhuǎn)換為編碼語言”的想法。
關(guān)于“functions(函數(shù))”的簡要說明：函數(shù)基本來說是一種技能，在調(diào)用之前處于休眠狀態(tài)?！癟o read”是function read() { …}}的一項(xiàng)技能，想讀取某內(nèi)容時(shí)就寫成這樣：read()，就會(huì)調(diào)用才會(huì)調(diào)用該函數(shù)。還有一種是“匿名函數(shù)”，即function(){ … }(沒有名字，就像上面的代碼片段那樣)，它基本上是“一次性的臨時(shí)操作”，甚至不算一種技能，例如“按下按鈕”。
扭轉(zhuǎn)乾坤：從信息到基礎(chǔ)
要更進(jìn)一步了解這個(gè)想法，可將上述的原因和誤解顛倒過來：
一首小詩，
用JavaScript語言編寫。
為人類而寫，
講述兩個(gè)人之間的愛。
- // Love at first sight
- if (me.getDistanceTo(you.position) < 200) {
- me.setFeelings({
- inLove: true,
- });
- }
它不具有功能性，目前也不適用于機(jī)器，只是方便人們閱讀和理解。
如果你能看懂這首詩，你實(shí)際上是理解了一段JavaScript代碼，也許你還會(huì)拿來與英語進(jìn)行比較。
現(xiàn)在你可能會(huì)問自己：我理解這一點(diǎn)，但它為什么這么寫呢?這種語言背后的規(guī)則(語法)是什么呢?“me”在技術(shù)層面是什么意思?為什么這段代碼看起來很像英語?
規(guī)則、詞匯和變量
學(xué)習(xí)編程語言時(shí)，最重要的事情之一就是理解變量的概念。
每一種人類語言都有其規(guī)則(語法)和大量詞匯(意思均已知)。顯然，只有先學(xué)習(xí)這兩點(diǎn)才會(huì)說這種語言。
與許多其它編程語言一樣，JavaScript也有一套規(guī)則(例如，單詞之間要加“.”或如何編寫“if”語句)和詞匯(if、document、window、Event等)。這些關(guān)鍵字由JavaScript(和瀏覽器)所有(或“預(yù)先定義”)，并且每個(gè)關(guān)鍵字都有其特定用途。
就像之前提到的那樣，似乎沒有機(jī)會(huì)去和英語中的單詞和句子做比較，因?yàn)镴avaScript中根本沒有對應(yīng)的詞和句子。
這就是引入變量這個(gè)概念的原因，開發(fā)人員可以(甚至必須)定義變量，以便讓機(jī)器和開發(fā)人員理解某些東西代表什么。變量可以采用多種形式(因此得名)：它們可以是一串單詞和字母(字符串)、數(shù)字、操作(函數(shù))、甚至集合(數(shù)組)，不勝枚舉。
在所有人類語言中，可能都有一個(gè)關(guān)于“l(fā)ove”的詞，你大概明白它是什么意思，但不太肯定，因?yàn)樗饔^了。但無論怎樣，還是有一個(gè)詞可以形容它。
但在JavaScript中，如果不定義“l(fā)ove”，就沒有與之對應(yīng)的表達(dá)，至于形式，則完全取決于你。
- var love = {
- color: ‘red’,
- duration: 365,
- loveTarget: ‘cats’,
- };
- // a simple variable expression,
- // where love is an object “{ … }”, a thing
- // with some properties (color, duration, loveTarget).
- const love2 = {
- color: ‘purple’,
- duration: ‘forever’,
- loveTarget: ‘dogs’,
- };
- // also a variable expression, where love2 (aconstant),
- // cannot be redefined / overwritten completely:
- // love2 = undefined; // => will not work
- // (“undefined” is a pre-defined javascriptkeyword,
- // basically saying “has no value”)
區(qū)分JavaScript中預(yù)定義的內(nèi)容(JavaScript規(guī)則和詞匯表)與開發(fā)人員實(shí)際自定義的內(nèi)容(也稱為“應(yīng)用程序邏輯”或“業(yè)務(wù)邏輯”)十分重要。
回到上面寫的詩：
- // Love at first sight
- if (me.getDistanceTo(you.position) < 200) {
- me.setFeelings({
- inLove: true,
- });
- }
這些表達(dá)式來自以下JavaScript詞匯表規(guī)則集：
- if (…) { … }
- // if statement: when … is met, do things in { … }
- {
- inLove: true,
- }
- // an “object” with some info, some thing in the world.
- // can contain other info, and “skills” (functions).
- // “inLove” is a custom property,
- // “true” is pre-defined in javascript, (meaning: “yes”)
- // and the value of “inLove”.
- .
- // needed to access an objects property “my name: me.name”
- getDistanceTo()
- // an expression to “call” a function (a “skill”).
- // getDistanceTo is custom (not JavaScript), and a function,
- // so it can be executed / called upon with the “()” after.
- // sometimes you can pass arguments in those brackets (like “position”)
- // to change the outcome of a function.
這些是變量，可以自定義它們的名稱和行為。
- me // an object, some thing in the world
- you // an object, some thing in the world
- position // an info about “you”, accessed by the “.”
- getDistanceTo // a skill of me, accessed by the “.”
- getDistanceTo() // the skill, with javascript grammar telling: do it.
- getDistanceTo(position) // same, but do it with “position”.
- setFeelings // another skill of me, accessed by the “.”
- setFeelings({ inLove: true }); // the skill, with some instructions (anobject).
假設(shè)這是一首人類讀得懂的詩，你可能已經(jīng)理解了其中的信息，也可能看到了需要遵循的JavaScript語言規(guī)則與需要提出的內(nèi)容(變量)之間有何區(qū)別。
但機(jī)器又會(huì)怎么做呢?
如果是機(jī)器(瀏覽器)讀取這首詩，那就會(huì)識(shí)別為錯(cuò)誤。機(jī)器需要一個(gè)“me”和“you”的定義，因?yàn)樗噲D訪問其屬性(通過在me.getDistanceTo()中的“.”來訪問)。有了上面提到的區(qū)分能力，實(shí)際上你可以設(shè)計(jì)“me”和“you”,讓計(jì)算機(jī)能夠執(zhí)行或讀取詩，如下所示：
- // This is how the definition of a being (me/you)could look like
- var me = {
- position: {x: 0, y: 0} // some coordinates, maybe
- getDistanceTo: function(position) {
- // calculate the distance, relative to own position
- },
- setFeelings: function(feelings) {
- // handle those feelings…
- }
- }
- var you = {
- position: {x: 0, y: 0} // some coordinates, maybe
- }
- // the poem itself
- if (me.getDistanceTo(you.position) < 200) {
- me.setFeelings({
- inLove: true,
- });
- }
那么在這里發(fā)生了什么?
- 為了讓人們理解，讀取一首用JavaScript“語法”編寫而成的JavaScript詩;
- 在理解信息之后，為理解詩的結(jié)構(gòu)(JavaScript的語法和基礎(chǔ)知識(shí))，對規(guī)則、詞匯和變量進(jìn)行了區(qū)分;
- 通過這種區(qū)分后，使用JavaScript規(guī)則設(shè)計(jì)了其余的詩歌變量，使其可以通過機(jī)器(在瀏覽器中)運(yùn)行。
這可以做到，因?yàn)樘幚鞪avaScript，就像處理英語語言一樣。
更大的例子：交互式代碼詩歌
LoveBits是一種代碼學(xué)習(xí)或用代碼講故事的體驗(yàn)。
LoveBits：基于JavaScript的代碼詩歌項(xiàng)目
它試圖通過以下方式讓人們對JavaScript或代碼感興趣：
- 將可讀性和人類語言放在***位;
- 將代碼與讀者可能熟知的藝術(shù)形式相結(jié)合。
故事情節(jié)與兩個(gè)比特(矩形狀)有關(guān);其中一個(gè)比特(blueBit)是浪漫主義者，為另一個(gè)比特(purpleBit)寫出JavaScript的愛情詩。
啟動(dòng)LoveBits時(shí)，可選擇其中一首愛情詩(由JavaScript代碼編寫而成)。每首詩都有一個(gè)代碼片段，不甚熟悉編程的人都能理解其中的編寫方式。這個(gè)項(xiàng)目唯一的要求就是要懂英語。
例如，“l(fā)ove at first sight”(實(shí)際上是LoveBits詩歌中的一首)講述的是這兩個(gè)比特之間的故事，詩中，blueBit大致是這么說的，“If I get close enough toyour position, I will ‘set my feelings’ to inLove: true.”
這些詩歌的特殊之處在于你可以通過點(diǎn)擊下面的“play”按鈕,“run”或“play”它們。在“Love at first sight”的詩中，你會(huì)見到一個(gè)藍(lán)色和紫色的矩形以及一個(gè)數(shù)字。正如你猜到的那樣，它們就是詩中提到的兩個(gè)比特，而blueBit下面的數(shù)字實(shí)際上是blueBit和purpleBit之間的距離。
正如詩歌所暗示的那樣，你可能想要通過減少它們之間的距離讓blueBit愛上purpleBit。那要怎么做呢?可以和blueBit互動(dòng)，把它拖來拖去，讓它墜入愛河。但要小心，有時(shí)結(jié)果可不只一種。
實(shí)際上有人可能會(huì)說程序員成為了這里的機(jī)器，但程序員才是需要解釋JavaScript代碼，并采取行動(dòng)幫助兩個(gè)數(shù)字生物墜入愛河的那個(gè)人。
未來將何去何從?
如果你是個(gè)奮力拼搏的開發(fā)者，試著將JavaScript視為人類語言吧，只了解需首先執(zhí)行的代碼片段就夠了，不必去考慮它們最終運(yùn)行的結(jié)果。
進(jìn)一步的建議：
- 永遠(yuǎn)優(yōu)先選擇能將規(guī)則、詞匯和變量組合在一起形成應(yīng)用程序邏輯的整個(gè)應(yīng)用程序;
- 應(yīng)用程序邏輯會(huì)講故事，這些故事將幫你填補(bǔ)上述代碼示例中的空白。代碼庫和實(shí)用程序(如lodash)只能提供新的詞匯表，在你能閱讀和理解JavaScript代碼后會(huì)有所幫助;
- 檢查現(xiàn)有代碼，并嘗試將其分解為具有反映其功能名稱的小函數(shù)。編寫適用于人和機(jī)器的代碼，編寫出可以像句子一樣閱讀的代碼，并在需要的地方加以注釋。思考：怎么用人類語言(向另一個(gè)開發(fā)者)表述這個(gè)代碼?
結(jié)論
將代碼視為人類語言而不是外星人發(fā)明的東西，學(xué)習(xí)代碼就會(huì)更容易。學(xué)習(xí)區(qū)分語言屬性(內(nèi)置)和應(yīng)用程序邏輯的變量/自定義代碼至關(guān)重要。理解了應(yīng)用程序邏輯，你就無需了解語言特征即可作出改進(jìn)和更改。
學(xué)習(xí)基礎(chǔ)知識(shí)前需明白：理解了任一代碼片段的信息，JavaScript的基礎(chǔ)知識(shí)自然就能隨之掌握。有多少次你聽到有人說：“我能看懂這種語言，但我還不會(huì)說?！边@是一個(gè)自然過程，能夠并可能適用于人類語言和編碼語言的學(xué)習(xí)。
此外，請牢記代碼有明確的功能性目的，但也并非總是如此。即使是人類語言，曾經(jīng)也只滿足純粹的功能性需求，后來才出現(xiàn)了詩歌甚至歌曲(說到這，有人對JavaScript歌曲感興趣嗎?)這些以截然不同方式使人們密切相聯(lián)的語言形式。這同樣適用于編程語言。
文章名稱：跨過編程入門門檻，從寫一首“代碼詩”開始
網(wǎng)頁URL：http://www.dlmjj.cn/article/dpjoohe.html
