Fyrirlestur 1 – JavaScript villur og regex

Vefforritun 1 — TÖL107G

Ólafur Sverrir Kjartansson, osk@hi.is

---

Villumeðhöndlun

• JavaScript hefur stuðning við try catch eða exceptions
• Kóði getur kastað villum: innbyggðum og okkar eigin
• Grípum villur og gerum eitthvað í þeim

---

Kasta villu

• Köstum villu með throw
  • Notum Error, innbyggðan hlut sem heldur utan um villur
  • throw Error('villa');
• Fáum stacktrace með villum, hvaðan þær koma upp

---

Grípa villu

• Ef við grípum ekki villu flýtur hún upp þar til hún veldur usla á efsta lagi
  • Í versta falli stoppar keyrslu
• Getum gripið villur og gert eitthvað við þær með try catch

---

try {
  // e-ð sem kastar villu
} catch (e) {
  // gera e-ð í villu
}

---

finally

• Með finally getum við keyrt kóða hvort sem við grípum villu eða ekki
• T.d. til að hreinsa upp, loka tengingum, logga

---

try {
  // e-ð sem kastar villu
} catch (e) {
  // gera e-ð í villu
} finally {
  // taka til
}

---

Algengar villur

Getum fengið upp villur þegar við köllum í innbyggð föll eða gerum eitthvað vitlaust

• TypeError – villa þegar gildi er ekki af þeirri tegund sem við gerum ráð fyrir
• ReferenceError – villa þegar reynt að eiga við óskilgreinda breytu
• o.fl.

---

Hvaða villa?

• Getum notað instanceof virkja sem athuga hvernig hlutur gildi er til að vita hvernig villa kom upp
• Almennt ekki mikið notað

---

try {
  /* ... */
} catch (e) {
  if (e instanceof TypeError) {
    console.log('TypeError', e);
  } else if (e instanceof ReferenceError) {
    console.log('ReferenceError', e);
  }
}

---

Notkun

• Þegar við notum kóða frá öðrum
• Köllum í vefþjónustur
• Verjast villum sem geta stoppað keyrslu
• Pössum okkur samt, getur falið villur og búið til erfiða bögga
  • Setjum utan um eins fáar línur í einu og við getum—felum ekki mögulega aðrar villur!

---

Ekki:

try {
  const setup = {};
  const result = willThrow(setup);
  const calc = result + 1;
} catch (e) {
  // gera e-ð í villu
}

---

frekar:

let result = 0; // ef það er í lagi
try {
  result = willThrow(setup);
} catch (e) {
  // gera e-ð í villu
}
const calc = result + 1;

---

Debugger

• Með debugger getum við stoppað á „unhandled exceptions“
• debugger er lykilorð sem við getum sett í kóðann okkar
• Ef inspector er opinn, mun stöðva keyrslu þegar keyra á þá línu og kveikir á debugger
• Sjáum stöðu forrits, oft betra en að nota console.log

---

• throw
• catch
• finally
• errors
• fetch try catch

---

Regular expressions

• Höfum stuðning við reglulegar segðir (regular expressions) í JavaScript
• Skilgreinum mynstur sem er borið saman við texta til að vinna með hann
  • Kraftmikið, flókið og oft óskiljanlegt

---

Reglulegar segðir

• Að skrifa og skilja reglulegar segðir er sér verkefni sem við ætlum ekki að fara djúpt í
• Skoðum aðeins nokkur dæmi sem geta verið handhæg
• Reglulegar segðir ber að varast, það eru yfirleitt betri leiðir í boði

---

Some people, when confronted with a problem, think “I know, I’ll use regular expressions.” Now they have two problems.

—Jamie Zawinski

---

• Skilgreindar með
  • let r = new RegExp('segð', flags);
  • let r = /segð/flags;
• segð er regluleg segð og flags er strengur sem stillir til hegðun

---

Segð

• Strengur skrifaður samkvæmt reglum
  • Myndar stöðuvél sem finnur og framkvæmir það sem segð biður um
• ^[0-9]{1,2}.*AB?C$
  • Strengur sem byrjar á einni eða tveim tölum, eftir fylgir einhver strengur og endar síðan á nákvæmlega “AC” eða “ABC”

---

Hagnýtir hlutir í segðum

• [] skilgreinir bil
  • [abcd], a, b, c eða d
  • [0-9], allar tölur
  • [a-z], ASCII lágstafir (unicode er vesen!)

---

• ^ – byrjun strengs
• $ – endi strengs
• [^] skilgreinir bil sem við viljum ekki
  • [^a-c] ekki a–c

---

• \s – whitespace, bil, tab, nýlína
• .+ – einu sinni eða oftar
• .* – núll sinnum eða oftar
• .{n,m} – n til m sinnum
• ? – Gæti verið eða ekki

---

Flags

• g - global, ekki stoppa eftir fyrstu niðurstöðu
• i - ignore case, ekki vera hástafanæm
• m - multiline, ^ og $ virka milli lína

---

Grúppur

• Þegar við keyrum regex fáum við niðurstöður til baka
• Hvaða strengur fannst
• Ef við notum sviga til að skilgreina subexpressions, fáum við í niðurstöðum hver þeirra fundust

---

Föll í JavaScript

• r.test(string)- athugar hvort ef r passi við string
• r.exec(string) - keyrir r og skilar niðurstöðum í fylki fyrir hvern hóp innan sviga
• string.match(r) - svipað exec en ef g er sett fáum við alla strengi sem finnast
• string.replace(r, newString) - skipta út öllum tilvikum þar sem r passar fyrir newString

---

/halló/.test('halló heimur');
/hæ/.test('halló heimur');

const re = /quick\s(brown).+?(jumps)/ig;
re.exec('The Quick Brown Fox Jumps Over The Lazy Dog');

'The Quick Brown Fox Jumps Over The Lazy Dog'
  .match(/quick\s(brown).+?(jumps)/ig);

'hæ hæ, hvað segiru? bæ!'
  .replace(/(h|b)æ/g, 'lol');

---

Getur verið mjög hentugt að nota tól til að smíða reglulegar segðir, t.d. regex101.com

---

• examples
• replace