efni vikna 11 og 12

namsefni/35.errors-regex/1.errors.regex.md

@@ -0,0 +1,269 @@
+---
+title: Fyrirlestur 1 – JavaScript villur og regex
+---
+
+# Fyrirlestur 1 – JavaScript villur og regex
+
+## Vefforritun 1 — TÖL107G
+
+### Ólafur Sverrir Kjartansson, [[email protected]](mailto:[email protected])
+
+---
+
+## Villumeðhöndlun
+
+* JavaScript hefur stuðning við [`try catch`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/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`
+
+***
+
+```javascript
+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
+
+***
+
+```javascript
+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ð
+
+***
+
+```javascript
+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!
+
+***
+
+<!-- eslint-disable no-undef, no-unused-vars -->
+Ekki:
+
+```javascript
+try {
+  const setup = {};
+  const result = willThrow(setup);
+  const calc = result + 1;
+} catch (e) {
+  // gera e-ð í villu
+}
+```
+
+***
+
+frekar:
+
+<!-- eslint-disable no-undef, no-unused-vars -->
+```javascript
+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](daemi/01.throw.js)
+* [catch](daemi/02.catch.js)
+* [finally](daemi/03.finally.js)
+* [errors](daemi/04.errors.js)
+* [fetch try catch](daemi/05.fetch.js)
+
+---
+
+## Regular expressions
+
+* Höfum stuðning við _reglulegar segðir_ ([regular expressions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/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](http://regex.info/blog/2006-09-15/247)
+
+***
+
+* 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)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)- athugar hvort ef `r` passi við `string`
+* [`r.exec(string)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec) - keyrir `r` og skilar niðurstöðum í fylki fyrir hvern hóp innan sviga
+* [`string.match(r)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match) - svipað `exec` en ef `g` er sett fáum við alla strengi sem finnast
+* [`string.replace(r, newString)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace) - skipta út öllum tilvikum þar sem `r` passar fyrir `newString`
+
+***
+
+```javascript
+/halló/.test('halló heimur');
+/hæ/.test('halló heimur');
+```
+
+```javascript
+const re = /quick\s(brown).+?(jumps)/ig;
+re.exec('The Quick Brown Fox Jumps Over The Lazy Dog');
+```
+
+```javascript
+'The Quick Brown Fox Jumps Over The Lazy Dog'
+  .match(/quick\s(brown).+?(jumps)/ig);
+```
+
+```javascript
+'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](https://regex101.com/r/rsmcG0/1)
+
+***
+
+* [examples](daemi/06.examples.js)
+* [replace](daemi/07.replace.js)

namsefni/35.errors-regex/daemi/.eslintrc.js

@@ -0,0 +1,13 @@
+module.exports = {
+  rules: {
+    // leyfum for of
+    'no-restricted-syntax': 0,
+
+    // helper.html dæmi
+    'function-paren-newline': 0,
+
+    'import/extensions': 0,
+
+    'max-len': [true, 100],
+  },
+};

namsefni/35.errors-regex/daemi/01.throw.js

@@ -0,0 +1,6 @@
+function throws() {
+  throw Error('Villa!');
+}
+
+throws();
+console.log('Ég keyri aldrei :(');

namsefni/35.errors-regex/daemi/02.catch.js

@@ -0,0 +1,10 @@
+function throws() {
+  throw Error('Villa!');
+}
+
+try {
+  throws();
+} catch (e) {
+  console.log('Greip villu!', e);
+}
+console.log('Ég keyri!');

namsefni/35.errors-regex/daemi/03.finally.js

@@ -0,0 +1,13 @@
+function iThrowErrorsSometimes() {
+  if (Math.random() > 0.5) {
+    throw new Error('Villa!');
+  }
+}
+
+try {
+  iThrowErrorsSometimes();
+} catch (e) {
+  console.log('Greip villu!', e);
+} finally {
+  console.log('Ég keyri alltaf');
+}

namsefni/35.errors-regex/daemi/04.errors.js

@@ -0,0 +1,21 @@
+function getResult() {
+  if (Math.random() > 0.5) {
+    return null;
+  }
+
+  return { s: 'hello' };
+}
+
+const result = getResult();
+try {
+  const { s } = result;
+  console.log(s.substr(1));
+} catch (e) {
+  console.log('Greip villu');
+
+  if (e instanceof TypeError) {
+    console.log('Villa er TypeError', e);
+  } else if (e instanceof ReferenceError) {
+    console.log('Villa er ReferenceError', e);
+  }
+}