Katsotaanpa, JavaScript ei ole aina ollut paras maine kehittäjien keskuudessa, ja koska CoffeeScript perustettiin vuonna 2009, tämä pieni kieli on ottanut maailmaan JavaScript-kehittäjien myrskyn; lähinnä siksi, että se voittaa, mitä jotkut voivat sanoa, on JavaScriptin huonoin näkökohta: sen koodin syntaksi.
Vaikka tämä on uusi kieli, se noutaa sen todella nopeasti lähinnä siksi, että se on uudistettu JavaScript; se on lähinnä kauniimpi ja yksinkertaisempi JavaScript.
Kahvitauluun kirjoittaessasi älä unohda, että kirjoitat koodia, joka ennen sen käyttöönottoa on tarkoitus koota JavaScript-toimintoon, joka noudattaa parhaita käytäntöjä ja kulkee JSLint-testiä, joten on yksi vähemmän asiaa, johon sinun on syytä huolestua. Tulostus on edelleen kelvollinen JavaScript, jolla selaimella ei ole lukemisen ongelmaa. CoffeeScript on JavaScript, mitä SASS on CSS: tapa kirjoittaa yksinkertaisempaa ja tuottavampaa koodia.
CoffeeScript on node.js-apuohjelma, joten sen asentamiseksi sinun täytyy olla asennettuna node.js sekä solmupaketin hallinta. Olettaen, että olet asentanut nämä kaksi pakettia, sinun tarvitsee vain mennä päätelaitteeseen ja asentaa kahvipaketti paketinhallintaohjelmaan käyttämällä koodia:
npm install -g coffee-scriptAivan, että sinulla on CoffeeScript asennettuna koneellesi. Voit täyttää .coffee-tiedoston JavaScript-tiedostoon kirjoittamalla:
coffee --compile script.coffeeTämä kokoaa tiedoston script.coffee script.js : iin samaan hakemistoon, mutta tekee sen vain, kun suoritat komennon, jos haluat, että se kokoaa kahvitiedostoon tekemäsi muutokset, sinun on lisättävä -watch ennen koota:
coffee --watch --compile script.coffeeTämän avulla JavaScript-koodisi kootaan joka kerta, kun teet muutoksen .coffee-tiedostoosi.
JavaScript-muuttujan kirjoittamisessa on varattava var-avainsana, sillä kaava-avainsana on poistettu, ja voit kirjoittaa muuttujan ja määrittää sen jotain. Toinen asia, jota kannattaa varoa, on se, että CoffeeScript käyttää paljon sisennysmenetelmiä puolipunkkien välttämiseksi ja kielen ymmärtämiseksi, että muuttuva lausuma on valmis, sinun tarvitsee vain siirtyä uuteen riviin:
age = 21country = "Portugal"JavaScriptissä sinun pitäisi kirjoittaa jotain:
var age = 21;var country = "Portugal";Se on pieni esimerkki, mutta voit alkaa nähdä, kuinka tehokas CoffeeScript on, kun koodisi yksinkertaistetaan.
Muistatko kaiken sen ajan, kun käytit JavaScript-operaattoreiden muistiinpanoa? Muista kysyä, miksi sinun tarvitsee käyttää === sijaan vain käyttää? No CoffeeScript myös huolehtii siitä. Se tarjoaa todella mukavia aliaksia operaattoreille:
Toinen asia, jolla CoffeeScript pääsee eroon, on kiharaiset telineet. Se käyttää sisennysmenetelmää ilmoittamaan, kun olet lausunnon sisällä, jos lausunnot toimivat kuten JavaScript, mutta sinun ei tarvitse olla kiharaa suluissa tai sulkeissa; vain syötä koodi, jota haluat käyttää, kun lausunto on totta:
if work > 24 and sleep < 8vacations()elsework()kokoaa JavaScriptin seuraavasti:
if (work > 24 && sleep < 8) {vacations();} else {work();}Toivon, että olet alkanut nähdä CoffeeScriptin edut vain näillä yksinkertaisilla esityksillä siitä, kuinka puhdas se voi tehdä koodisi ja puhtaampi koodi tarkoittaa pidempää koodia.
Looping through arrays on yksi niistä asioista, joita olet velvollinen tekemään jokaisessa JavaScript-sovelluksessa, jota kirjoitat ja syntaksi silmukoiden läpi JavaScriptissä ei ole yksinkertaisin tai puhtain, mielestäni tämä on silloin, kun CoffeeScript todella loistaa. Jos haluat silmukoittaa matriisin läpi, käytämme for ..in loopia, kuten:
tasks = ['Design','Code','Groceries']for task in tasksalert taskKaikki tämä koodikoodi on lukea kaikki taulukon asiat ja sitten ilmoittaa yksi kerrallaan, jotta asiat saataisiin jopa yksinkertaisemmiksi, voit jopa kirjoittaa ... silmukalle yhdellä rivillä, kuten:
tasks = ['Design','Code','Groceries']alert task for task in tasksSe on yksinkertaisesti paljon helpommin luettavissa ja ylläpidettävissä kuin vaniljan JavaScript, puhumalla siitä, mistä koodista Kahsimusi tuotti nämä kaksi riviä:
var task, tasks, _i, _len;tasks = ['Design', 'Code', 'Groceries'];for (_i = 0, _len = tasks.length; _i < _len; _i++) {task = tasks[_i];alert(task);}Vaikka silmukat ovat myös erittäin hyödyllisiä rakentaessasi JavaScript-sovellustasi, niin CoffeeScript ei myöskään ole helpompi lukea ja kirjoittaa, esimerkiksi:
while sleep < 8sleep()Tai voit kirjoittaa sen yhdelle riville, jos haluat:
while sleep < 8 then sleep()Tai:
sleep() until sleep > 8Puhtaassa JavaScript-muodossa tämä käännäisi:
//thenwhile (sleep < 8) {sleep();}Tai:
//untilwhile (!(sleep > 8)) {sleep();}Toiminnot ovat myös toinen tärkeä osa ohjelmointikieltä ja vaikka JavaScript-toiminnot eivät ole niin sotkuisia kuin jotkut muut osat, kahvikirjoitus yksinkertaistaa tätä myös max: iin, yksinkertainen toiminto, joka ottaa jonkun nimen ja ilmoittaa siitä, voidaan kirjoittaa näin :
sayHi = (name) ->return "Hello " + namealert sayHi('Sara')Sinun tarvitsee vain nimetä funktio, tässä tapauksessa funktioita kutsutaan sayHi, ja sitten tasa-arvon jälkeen sinun täytyy määrittää parametrit. Täällä nimi on yksittäinen parametri, kun toimintamme alusta on määritelty, meidän on kirjoitettava seuraava rivi seuraavalla rivillä, mitä haluamme toiminnon tekemiseksi, niin että kahvikirjoitus tietää, että olemme toiminnon sisällä. Tässä tapauksessa haluan vain palata "Hei" ja sitten henkilön nimi ja lopuksi käytän yksinkertaista hälytystä soittamaan toimintoa nimeltä. Voimme myös kirjoittaa tämän yhteen riviin poistamalla syötteen ja sisennyksen vain kirjoittamalla, mitä toiminto tekee sen jälkeen ->:
sayHi = (name) -> return "Hello " + nameTämä pieni koodikappale kootaan seuraaviin JavaScript-koodeihin:
var sayHi;sayHi = function(name) {return "Hello " + name;};alert(sayHi('Sara'));Tietenkin tämä oli todella yksinkertainen toiminto, mutta kuten näet, se tallensi meidät 3 riviä koodia ja tietysti JavaScriptin voisimme vain nimetä muuttuja kun julistamme toiminnon niin:
var sayHi = function(name) {return "Hello " + name;};alert(sayHi('Sara'));Esimerkit, jotka olen antanut täällä, ovat mitä CoffeeScript kootaan ja vaikka useimmissa tapauksissa on helpompi tapoja kirjoittaa jotain, kaikki JavaScript-koottu on kelvollinen ja semanttinen.
Tämä on vasta alkua mitä CoffeeScript voi antaa sinulle, kun asiat alkavat monimutkaisemmiksi, tämä pieni kieli antaa sinulle paljon hyötyä verrattuna JavaScript-koodiin, vähemmän koodia sinun täytyy kirjoittaa, enemmän ihmisen luettavia koodeja ja enemmän ylläpitävää , jotta voit palata verkkosivuille vuotta myöhemmin ja tietää, mitä JavaScriptissä tapahtuu.
Pysy kuulolla tämän sarjan toiselle osalle, jossa näytän sinulle, kuinka voit yhdistää CoffeeScriptin jQueryn ja LocalStoragein luomalla yksinkertaisen yhteystietoluettelosovelluksen.
Oletko käyttänyt CoffeeScript -ohjelmaa JavaScriptin yksinkertaistamiseen? Mitä osia kahvikirjasta haluat Javascriptin parissa? Kerro meille kommentit.