Show tasks

The JavaScript language

• En introduktion
  • En introduktion til JavaScript
  • Manualer og specifikationer
  • Kodeeditorer
  • Udvikler konsollen
• Grundlæggende JavaScript
  • Hello, world!
    • Vis en advarsel
    • Vis en advarsel med gennem et eksternt script
  • Kodens struktur
  • Den 'moderne' metode, "use strict"
  • Variables
    • Arbejde med variable
    • Giv en variabel det rigtige navn
    • Uppercase const?
  • Datatyper
    • Tesktstrenge og citationstegn
  • Interaktion: alert, prompt, confirm
    • En simpel side
  • Konvertering mellem datatyper
  • Grundlæggende operatorer, matematik
    • Postfix- og præfiksformer
    • Tildelingsresultat
    • Typekonverteringer
    • Ret tilføjelsen
  • Sammenligning
    • Sammenligninger
  • Betinget forgrening: if, '?'
    • if (en tekststreng med nul)
    • Navnet på JavaScript
    • Vis tegnet
    • Omskriv 'if' til '?'
    • Omskriv 'if..else' til '?'
  • Logiske operatorer
    • Hvad er resultatet af OR?
    • Hvad er resultatet af OR mellem alert()?
    • Hvad er resultatet af AND?
    • Hvad er resultatet af AND mellem alert()?
    • Resultatet af OR AND OR
    • Check afstanden inden for intervallet
    • Check afstanden uden for intervallet
    • A question about "if"
    • Check login
  • Nullish coalescing operator '??'
  • Løkker: while og for
    • Sidste værdi i løkken
    • Hvilke værdier viser while-løkken?
    • Hvilken værdi vises af "for"-løkken?
    • Udskriv lige tal i løkken
    • Erstat "for" med "while"
    • Gentag indtil input er korrekt
    • Udskriv primtal
  • "switch" udtryk
    • Omskriv "switch" til "if"
    • Omskriv "if" til "switch"
  • Funktioner
    • Er "else" påkrævet?
    • Omskriv funktionen ved brug af '?' eller '||'
    • Funktionen min(a, b)
    • Funktionen pow(x,n)
  • Funktionsudtryk
  • Pilefunktioner (Arrow functions), grundlæggende
    • Omskriv med pilefunktioner
  • Særlige kendetegn ved JavaScript
• Kvalitet af kode
  • Debugging i browseren
  • Kodestil
    • Rodet kodestil
  • Kommentarer
  • Ninja code
  • Automatisk testning med Mocha
    • What's wrong in the test?
  • Polyfills og transpilers
• Objekter: grundlæggende
  • Objekter
    • Hej, object
    • Tjek for tomhed
    • Tæl summen af objektets egenskaber
    • Gang alle numeriske egenskabsværdier med 2
  • Objekt referencer og kopiering af objekter
  • Oprydning af affald (Garbage collection)
  • Objektmetoden, "this"
    • Brug af "this" i object literals
    • Lav en lommeregner
    • Kæder
  • Constructor, operatoren "new"
    • To funktioner – ét objekt
    • Opret en ny lommeregner
    • Opret en akkumulator
  • Valgfri sammenkædning '?.'
  • Datatypen Symbol
  • Konvertering fra objekt til primitiv
• Data typer
  • Metoder hos primitive typer
    • Kan du tilføje en egenskab til en streng?
  • Tal (Numbers)
    • Læg to tal sammen fra brugeren
    • Hvorfor er 6.35.toFixed(1) == 6.3?
    • Gentag indtil input er et tal
    • En lejlighedsvist uendeligt løkke
    • Et tilfældigt tal fra min til max
    • Et tilfældigt heltal fra min til max
  • Tekststrenge (Strings)
    • Stort begyndelsesbogstav
    • Tjek for spam
    • Afkort teksten
    • Udtræk beløbet
  • Arrays (rækker)
    • Bliver array kopieret?
    • Array operationer.
    • Kald i et array-kontekst
    • Opsummer indtastede tal
    • A maximal subarray
  • Array-metoder
    • Oversæt border-left-width til borderLeftWidth
    • Filtrer interval
    • Filtrer interval "in place"
    • Sorter i faldende rækkefølge
    • Kopier og sorter array
    • Opret en lommeregner, der kan udvides
    • Map til names
    • Map til objekter
    • Sorter brugere efter alder
    • Bland et array
    • Find gennemsnitsalderen
    • Filtrer unikke array-medlemmer
    • Opret objekt med nøgler fra array
  • Itererbare objekter
  • Map og Set
    • Filtrer unikke array-medlemmer
    • Filtrer anagrammer
    • Itererbare nøgler
  • WeakMap og WeakSet
    • Opbevar "ulæste" flag
    • Gem datoer for læsning
  • Object.keys, values, entries
    • Summen af egenskaberne
    • Tæl egenskaber
  • Deestrukturering
    • Destrukturering
    • Den maksimale løn
  • Dato og tid
    • Opret et dato objekt
    • Vis dagen i ugen
    • Europæiske ugedage
    • Hvad var dagen for mange dage siden?
    • Sidste dag i måned?
    • Hvor mange sekunder har gået i dag?
    • Hvor mange sekunder til morgen?
    • Formater den relative dato
  • JSON metoder, toJSON
    • Omdan et objekt til JSON og tilbage
    • Ekskluder cirkulære referencer
• Avanceret arbejde med funktioner
  • Rekursion og stak
    • Sammentæl alle tal op til et bestemt tal
    • Udregn faktorial
    • Fibonacci-tal
    • Udskriv en enkeltstrenget linked list
    • Udskriv en enkeltstrenget linked list i omvendt rækkefølge
  • Rest parameteren og spread syntaks
  • Variable scope, closure
    • Vil funktionen tage de seneste ændringer?
    • Hvilke variable er tilgængelige?
    • Er tællere uafhængige?
    • Counter objekt
    • Funktion i if
    • Sammentæl med closures
    • Er variablen synlig?
    • Filtrer gennem funktion
    • Sorter efter felt
    • En hær af funktioner
  • Den gamle "var"
  • Objektet Global
  • Funktion som objekt, NFE
    • Sæt og formindsk for counter
    • Tæl sammen med et vilkårligt antal parenteser
  • Syntaksen "new Function"
  • Planlægning: setTimeout og setInterval
    • Output hvert sekund
    • Hvad vil setTimeout vise?
  • Decorators og videresendelse, call/apply
    • Spy decorator
    • Forsinkelses decorator
    • Debounce decorator
    • Throttle decorator
  • Function binding
    • Bundet funktion som en metode
    • Anden binding
    • Funktionsegenskab efter binding
    • Fix en funktion der mister "this"
    • Partial application for login
  • Arrow funktioner genbesøgt
• Konfiguration af egenskaber for objekt
  • Flag og beskrivelser for objektegenskaber
  • Getters og setters for egenskaber
• Prototyper, nedarvning
  • Prototypal inheritance
    • Arbejde med en prototype
    • Søgealgoritme
    • Hvor skriver den?
    • Hvorfor er begge hamstere fyldte?
  • F.prototype
    • Ændring af "prototype"
    • Opret et objekt med samme konstruktør
  • Indbyggede prototyper (native prototypes)
    • Tilføj metoden "f.defer(ms)" til funktioner
    • Tilføj "defer()" til funktioner via decorator pattern
  • Prototype metoder, objekter uden __proto__
    • Tilføj toString til ordbogen
    • Forskellen mellem kald
• Klasser
  • Klasser: Grundlæggende syntaks
    • Omskriv til en klasse
  • Nedarvning af klasser
    • Fejl ved oprettelse af instans
    • Udvidet ur
  • Statiske egenskaber og metoder
    • Klasse udvider object?
  • Private og beskyttede egenskaber og metoder
  • Udvid indbyggede klasser
  • Tjek en klasse: "instanceof"
    • Underlig instanceof
  • Mixins
• Håndtering af fejl
  • Håndtering af fejl, "try...catch"
    • Finally or just the code?
  • Brugerdefinerede fejl, udvidelse af Error
    • Nedarv fra SyntaxError
• Promises, async/await
  • Introduktion: callbacks
  • Promise
    • Re-resolve et promise?
    • Forsinkelse med et promise
    • Animeret cirkel med promise
  • Sammenkædning af promises (chaining)
    • Promise: then versus catch
  • Håndtering af fejl med promises
    • Fejl i setTimeout
  • Promise API
  • Promisificering
  • Microtasks
  • Async/await
    • Omskriv ved brug af async/await
    • Omskriv "rethrow" med async/await
    • Kald async fra ikke-async
    • Farlig Promise.all
• Generators, avanceret iteration
  • Generatorer
    • Pseudo-random generator
  • Asynkron iteration og generatorer
• Moduler
  • Moduler, introduktion
  • Export og Import
  • Dynamisk import
• Miscellaneous
  • Proxy and Reflect
    • Error on reading non-existent property
    • Accessing array[-1]
    • Observable
  • Eval: run a code string
    • Eval-calculator
  • Currying
  • Reference Type
    • Syntax check
    • Explain the value of "this"
  • BigInt
  • Unicode, String internals
  • WeakRef and FinalizationRegistry

Browser: Dokumenter, Hændelser, brugergrænseflader

• Dokumentet
  • Browser miljø, specs
  • DOM træet
  • Gennemløbe DOM'en
    • DOM børn
    • Spørgsmålet om søskende
    • Vælg alle diagonale celler
  • Søgning: getElement*, querySelector*
    • Søg efter elementer
  • Node egenskaber: type, tag og contents
    • Tæl alle efterkommere
    • Hvad er der i nodeType?
    • Tag i kommentarer
    • Hvor er "document" i hierarkiet?
  • Attributter og egenskaber
    • Hent attributten
    • Gør eksterne links orange
  • Modificering af dokumentet
    • createTextNode vs innerHTML vs textContent
    • Slet et element
    • Hvorfor bliver "aaa" ved med at være synlig?
    • Opret en liste
    • OPret et træ fra objektet
    • Vis efterkommere i et træ
    • Opret en kalender
    • Farvet ud med setInterval
    • Indsæt HTML i listen
    • Sorter tabellen
  • Styles and classes
    • Create a notification
  • Element size and scrolling
    • What's the scroll from the bottom?
    • What is the scrollbar width?
    • Place the ball in the field center
    • The difference: CSS width versus clientWidth
  • Window sizes and scrolling
  • Coordinates
    • Find window coordinates of the field
    • Show a note near the element
    • Show a note near the element (absolute)
    • Position the note inside (absolute)
• Introduction to Events
  • Introduction to browser events
    • Hide on click
    • Hide self
    • Which handlers run?
    • Move the ball across the field
    • Create a sliding menu
    • Add a closing button
    • Carousel
  • Bubbling and capturing
  • Event delegation
    • Hide messages with delegation
    • Tree menu
    • Sortable table
    • Tooltip behavior
  • Browser default actions
    • Why "return false" doesn't work?
    • Catch links in the element
    • Image gallery
  • Dispatching custom events
• UI Events
  • Mouse events
    • Selectable list
  • Moving the mouse: mouseover/out, mouseenter/leave
    • Improved tooltip behavior
    • "Smart" tooltip
  • Drag'n'Drop with mouse events
    • Slider
    • Drag superheroes around the field
  • Pointer events
  • Keyboard: keydown and keyup
    • Extended hotkeys
  • Scrolling
    • Endless page
    • Up/down button
    • Load visible images
• Forms, controls
  • Form properties and methods
    • Add an option to select
  • Focusing: focus/blur
    • Editable div
    • Edit TD on click
    • Keyboard-driven mouse
  • Events: change, input, cut, copy, paste
    • Deposit calculator
  • Forms: event and method submit
    • Modal form
• Document and resource loading
  • Page: DOMContentLoaded, load, beforeunload, unload
  • Scripts: async, defer
  • Resource loading: onload and onerror
    • Load images with a callback
• Miscellaneous
  • Mutation observer
  • Selection and Range
  • Event loop: microtasks and macrotasks
    • What will be the output of this code?

Yderligere artikler

• Frames and windows
  • Popups and window methods
  • Cross-window communication
  • The clickjacking attack
• Binary data, files
  • ArrayBuffer, binary arrays
    • Concatenate typed arrays
  • TextDecoder and TextEncoder
  • Blob
  • File and FileReader
• Network requests
  • Fetch
    • Fetch users from GitHub
  • FormData
  • Fetch: Download progress
  • Fetch: Abort
  • Fetch: Cross-Origin Requests
    • Why do we need Origin?
  • Fetch API
  • URL objects
  • XMLHttpRequest
  • Resumable file upload
  • Long polling
  • WebSocket
  • Server Sent Events
• Storing data in the browser
  • Cookies, document.cookie
  • LocalStorage, sessionStorage
    • Autosave a form field
  • IndexedDB
• Animation
  • Bezier curve
  • CSS-animations
    • Animate a plane (CSS)
    • Animate the flying plane (CSS)
    • Animated circle
    • Animated circle with callback
  • JavaScript animations
    • Animate the bouncing ball
    • Animate the ball bouncing to the right
• Web components
  • From the orbital height
  • Custom elements
    • Live timer element
  • Shadow DOM
  • Template element
  • Shadow DOM slots, composition
  • Shadow DOM styling
  • Shadow DOM and events
• Regular expressions
  • Patterns and flags
  • Character classes
  • Unicode: flag "u" and class \p{...}
  • Anchors: string start ^ and end $
    • Regexp ^$
  • Multiline mode of anchors ^ $, flag "m"
  • Word boundary: \b
    • Find the time
  • Escaping, special characters
  • Sets and ranges [...]
    • Java[^script]
    • Find the time as hh:mm or hh-mm
  • Quantifiers +, *, ? and {n}
    • How to find an ellipsis "..." ?
    • Regexp for HTML colors
  • Greedy and lazy quantifiers
    • A match for /d+? d+?/
    • Find HTML comments
    • Find HTML tags
  • Capturing groups
    • Check MAC-address
    • Find color in the format #abc or #abcdef
    • Find all numbers
    • Parse an expression
  • Backreferences in pattern: \N and \k<name>
  • Alternation (OR) |
    • Find programming languages
    • Find bbtag pairs
    • Find quoted strings
    • Find the full tag
  • Lookahead and lookbehind
    • Find non-negative integers
    • Insert After Head
  • Catastrophic backtracking
  • Sticky flag "y", searching at position
  • Methods of RegExp and String

• © 2007—2026  Ilya Kantor
• om projektet
• kontakt os