1 line
29 KiB
HTML
1 line
29 KiB
HTML
<!doctype html><html lang="en" itemscope itemtype="https://schema.org/Article"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Front-end interview vragen ★ Front-end Job Interview Questions</title><meta name="description" content="A list of helpful front-end related questions you can use to interview potential candidates, test yourself or completely ignore."><meta name="keywords" content="front-end, interview questions, css questions, js questions, html questions, performance questions, interview test"><meta name="author" content="Front-end Job Interview Questions"><meta itemprop="author" content="Front-end Job Interview Questions"><meta itemprop="name" content="Front-end interview vragen ★ Front-end Job Interview Questions"><meta itemprop="description" content="A list of helpful front-end related questions you can use to interview potential candidates, test yourself or completely ignore."><meta itemprop="image" content="https://h5bp.github.io/Front-end-Developer-Interview-Questions/assets/images/og-image.png"><meta property="og:title" content="Front-end interview vragen ★ Front-end Job Interview Questions"><meta property="og:description" content="A list of helpful front-end related questions you can use to interview potential candidates, test yourself or completely ignore."><meta property="og:url" content="https://h5bp.github.io/Front-end-Developer-Interview-Questions/translations/dutch/"><meta property="og:site_name" content="Front-end Job Interview Questions"><meta property="og:image" content="https://h5bp.github.io/Front-end-Developer-Interview-Questions/assets/images/og-image.png"><meta property="og:image:secure_url" content="/assets/images/og-image.png"><meta property="og:type" content="website"><meta property="og:locale" content="en_US"><meta name="twitter:card" content="summary"><meta name="twitter:title" content="Front-end interview vragen ★ Front-end Job Interview Questions"><meta name="twitter:description" content="A list of helpful front-end related questions you can use to interview potential candidates, test yourself or completely ignore."><meta name="twitter:site" content="@h5bp"><meta name="twitter:image" content="https://h5bp.github.io/Front-end-Developer-Interview-Questions/assets/images/og-image.png"><meta name="twitter:creator" content="@h5bp"><link type="image/png" rel="apple-touch-icon" href="/assets/images/apple-touch-icon.png"><link type="image/png" sizes="32x32" rel="icon" href="/assets/images/favicon-32x32.png"><link type="image/png" sizes="16x16" rel="icon" href="/assets/images/favicon-32x32.png"><link type="image/png" color="#181818" rel="mask-icon" href="/assets/images/favicon-96x96.png"><meta name="mobile-web-app-capable" content="yes"><meta name="robots" content="index,follow"><style>code[class*=language-],pre[class*=language-]{color:#c5c8c6;text-shadow:0 1px rgba(0,0,0,.3);font-family:Inconsolata,Monaco,Consolas,'Courier New',Courier,monospace;direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto;border-radius:.3em}:not(pre)>code[class*=language-],pre[class*=language-]{background:#1d1f21}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#7c7c7c}.token.punctuation{color:#c5c8c6}.namespace{opacity:.7}.token.keyword,.token.property,.token.tag{color:#96cbfe}.token.class-name{color:#ffffb6;text-decoration:underline}.token.boolean,.token.constant{color:#9c9}.token.deleted,.token.symbol{color:#f92672}.token.number{color:#ff73fd}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#a8ff60}.token.variable{color:#c6c5fe}.token.operator{color:#ededed}.token.entity{color:#ffffb6}.token.url{color:#96cbfe}.language-css .token.string,.style .token.string{color:#87c38a}.token.atrule,.token.attr-value{color:#f9ee98}.token.function{color:#dad085}.token.regex{color:#e9c062}.token.important{color:#fd971f}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}:root{--font-family-heading:sans-serif;--font-family-body:Georgia,serif;--font-family-code:Menlo,Monaco,'Courier New',monospace;--color-primary:#835EFF;--color-secondary:#FF008D;--color-safe:#8338EC;--color-gradient:linear-gradient(to right, var(--color-primary), var(--color-secondary));--color-highlight:var(--color-primary);--color-gray-opacity:rgba(39,39,39,0.04);--color-heading:#23231A;--color-text:#23231A;--background-default:#F9F9F9;--border-radius-default:5px;--box-shadow-default:0 2rem 4rem rgba(0,0,0,.15);--transition-duration:0.27s}*{margin:0;padding:0;box-sizing:border-box;outline-color:var(--color-primary)}::selection{background:var(--color-primary);color:var(--background-default)}::-moz-selection{background:var(--color-primary);color:var(--background-default)}.nav{padding:1rem 0;margin-bottom:1rem}.navigation{list-style:none;display:flex;font-size:1rem}.navigation-item-emoji{margin-right:.8rem}.navigation-item-emoji a{text-decoration:none;display:inline-block;vertical-align:middle}.navigation-item:not(:last-of-type){margin-right:.8rem}.topbar{width:100%;height:.18rem;background:var(--color-gradient)}.skip-link{position:absolute;top:0;left:0;padding:.5rem 1rem;background-color:var(--color-primary);color:#fff;text-decoration:none;transform:translateY(-100%)}.skip-link:focus{transform:none}.header{margin-bottom:2rem}.header-big-title{font-size:6.9rem;line-height:1.06;margin:2.1rem 0;color:var(--color-primary);word-break:break-word}@supports (mix-blend-mode:lighten){.header-big-title{display:inline-block;position:relative;color:#000;background:#fff;mix-blend-mode:multiply}.header-big-title::before{content:'';display:block;position:absolute;top:0;right:0;bottom:0;left:0;background-image:url(/assets/images/gradient.svg);pointer-events:none}.header-big-title::before{mix-blend-mode:screen}}.header-heading{font-size:2.3rem;text-transform:uppercase}.header-big-description{font-size:1.8rem;line-height:1.4;padding:1rem 0}.header-description{padding-top:1rem}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:var(--font-family-body);font-weight:400;font-size:1.2rem;line-height:1.5;color:var(--color-text)}section+section{padding-top:2rem}h1,h2,h3,h4,h5,h6{font-family:var(--font-family-heading);color:var(--color-heading);font-style:normal;line-height:1.2;font-weight:600}section+section{padding-top:2rem}a{color:inherit;text-decoration:none;color:var(--color-secondary);transition:color ease-out var(--transition-duration)}a:focus:not(.skip-link),a:hover:not(.skip-link){color:var(--color-primary)}a[rel~=external]{text-decoration:overline}ul:not(.navigation):not(.inline-list){list-style:none}ul:not(.navigation):not(.inline-list) li::before{content:"\25A0";color:var(--color-primary);font-weight:700;display:inline-block;width:1em;margin-left:-1em}li{margin-bottom:.6rem}b,strong{font-weight:600}time{display:inline-block;color:var(--color-gray-70)}[tabindex='-1']{outline:0}img,svg{vertical-align:middle}img{display:block;max-width:100%;border-radius:var(--border-radius-default)}code{font-family:var(--font-family-code);color:var(--color-code);font-style:normal;font-size:1rem}blockquote:not([class]){padding-left:1rem;margin-left:-1rem;border-left:2px solid var(--color-primary);color:var(--color-gray-70);font-style:italic}code[class*=language-],pre[class*=language-]{font-size:.9rem;font-style:normal}p+pre[class*=language-]{margin-bottom:1.8rem}mark{color:var(--color-highlight);background-color:transparent}dt{font-weight:700}dd+dt{padding-top:.5rem}abbr[title],acronym[title]{text-decoration:overline;background:var(--color-gray-opacity);border:1px solid var(--color-gray-opacity);cursor:help}.container{max-width:54rem;padding:3rem 4rem 4rem;margin-right:auto;margin-left:auto}.content li:not(:last-of-type){margin-bottom:.5rem}.content h2{max-width:33rem}.content>:not(:last-child){margin-bottom:2rem}.content :not(hr)+h2,.content :not(hr)+h3{padding-top:1rem}.content ol:not(.inline-list),.content ul:not(.inline-list){padding-left:1.2rem}.content-simple li:not(:last-of-type){margin-bottom:.5rem}.content-edit{text-align:right;margin-top:2rem}.inline-list{padding:0;list-style:none}.inline-list li{padding:0;display:inline-block;vertical-align:middle;text-align:center}.inline-list li::before{content:'';margin-left:0}.inline-list li img{display:block;margin:auto;margin-bottom:.6rem}.inline-list li a{display:inline-block;vertical-align:middle;margin:0 .15rem}.avatar{max-width:12rem}.footer{padding-top:3rem}.footer-text{font-size:.8rem}</style></head><body><div class="topbar"></div><div class="container"><a class="skip-link" href="#main-content">Skip to main content</a><nav class="nav"><ul class="navigation"><li class="navigation-item"><span class="navigation-anchor">Questions:</span></li><li class="navigation-item"><a class="navigation-anchor" href="/questions/coding-questions/" title="Coding Questions">Coding</a></li><li class="navigation-item"><a class="navigation-anchor" href="/questions/css-questions/" title="CSS Questions">CSS</a></li><li class="navigation-item"><a class="navigation-anchor" href="/questions/fun-questions/" title="Fun Questions">Fun</a></li><li class="navigation-item"><a class="navigation-anchor" href="/questions/general-questions/" title="General Questions">General</a></li><li class="navigation-item"><a class="navigation-anchor" href="/questions/html-questions/" title="HTML Questions">HTML</a></li><li class="navigation-item"><a class="navigation-anchor" href="/questions/javascript-questions/" title="JavaScript Questions">JavaScript</a></li><li class="navigation-item"><a rel="external noreferrer noopener" target="_blank" class="navigation-anchor" href="https://scottaohara.github.io/accessibility_interview_questions/" title="Accessibility Questions (external link)">A11y</a></li><li class="navigation-item"><a class="navigation-anchor" href="/questions/network-questions/" title="Network Questions">Network</a></li><li class="navigation-item"><a class="navigation-anchor" href="/questions/performance-questions/" title="Perfomance Questions">Perfomance</a></li><li class="navigation-item"><a class="navigation-anchor" href="/questions/testing-questions/" title="Testing Questions">Testing</a></li><li class="navigation-item">|</li><li class="navigation-item-emoji"><a class="navigation-anchor" href="/" title="Home">🏠</a></li><li class="navigation-item-emoji"><a class="navigation-anchor" href="/translations" title="Translations">🌐</a></li></ul></nav><main id="main-content" tabindex="-1"><header class="header"><h1 class="header-big-title">Front-end interview vragen</h1></header><div class="content"><h1>Front-end interview vragen</h1><p>@version 2.0.0</p><p>Deze repo bevat een aantal front-end interview vragen die je kunnen helpen om ervaren kandidaten te vinden. Het is uiteraard niet aangeraden om elke vraag aan een sollicitant te stellen (dat zou ook uren in beslag nemen). Maar als je er een paar gebruikt is het mogelijk om het gewenste skillniveau te vinden dat je zoekt.</p><p><a href="http://rmurphey.com/">Rebecca Murphey</a>’s <a href="http://rmurphey.com/blog/2012/04/12/a-baseline-for-front-end-developers/">Baseline For Front-End Developers</a> is ook een geweldige bron om je in te lezen voordat je aan een interview begint.</p><p><strong>Let op:</strong> Houd er rekening mee dat deze vragen meestal een open einde hebben en dat zou kunnen leiden tot interessante discussies die je meer over de persoon zelf kan vertellen dan een standaard antwoord.</p><p>####Originele Bijdragers</p><p>De meerderheid van deze vragen is geplukt uit een <a href="http://oksoclap.com/">oksoclap</a> thread origineel gemaakt door <a href="http://paulirish.com">Paul Irish</a> (<a href="http://twitter.com/paul_irish">@paul_irish</a>) en aan bijgedragen door de volgende individuen:</p><ul><li><a href="http://twitter.com/bentruyman">@bentruyman</a> - <a href="http://bentruyman.com">http://bentruyman.com</a></li><li><a href="http://twitter.com/cowboy">@cowboy</a> - <a href="http://benalman.com">http://benalman.com</a></li><li><a href="http://ajpiano">@ajpiano</a> - <a href="http://ajpiano.com">http://ajpiano.com</a></li><li><a href="http://twitter.com/slexaxton">@SlexAxton</a> - <a href="http://alexsexton.com">http://alexsexton.com</a></li><li><a href="http://twitter.com/boazsender">@boazsender</a> - <a href="http://boazsender.com">http://boazsender.com</a></li><li><a href="http://twitter.com/miketaylr">@miketaylr</a> - <a href="http://miketaylr.com">http://miketaylr.com</a></li><li><a href="http://twitter.com/vladikoff">@vladikoff</a> - <a href="http://vladfilippov.com">http://vladfilippov.com</a></li><li><a href="http://twitter.com/gf3">@gf3</a> - <a href="http://gf3.ca">http://gf3.ca</a></li><li><a href="http://twitter.com/jon_neal">@jon_neal</a> - <a href="http://twitter.com/jon_neal">http://twitter.com/jon_neal</a></li><li><a href="http://twitter.com/wookiehangover">@wookiehangover</a> - <a href="http://wookiehangover.com">http://wookiehangover.com</a></li><li><a href="http://twitter.com/darcy">@darcy</a> - <a href="http://darcyclarke.me">http://darcyclarke.me</a></li><li><a href="http://twitter.com/iansym">@iansym</a></li></ul><h3>Algemene Vragen:</h3><ul><li>Praat over je favoriete ontwikkelomgeving. (OS, Editor, Browsers, Tools etc.)</li><li>Kan je jouw workflow beschrijven als je een nieuwe web pagina maakt?</li><li>Kan je het verschil beschrijven tussen progressieve verbeteringen en gracieuse degradatie?<ul><li>Bonus punten voor het beschrijven van feature detection</li></ul></li><li>Leg uit wat “Semantische HTML” betekent.</li><li>Hoe zou je website assets/resources optimaliseren?<ul><li>Kijk naar een aantal oplossingen zoals:<ul><li>Bestands concatenatie</li><li>Betands minificatie</li><li>Content Delivery Network</li><li>Caching</li><li>etc.</li></ul></li></ul></li><li>Waarom is het beter om website resources van meerdere domeinen te laden?<ul><li>Hoeveel resources kan een browser tegelijkertijd downloaden van een domein?</li></ul></li><li>Noem 3 manieren om pagina laadtijd te verminderen. (waargenomen of gemeten tijd)</li><li>Als je op een project kwam te werken waar ze tabs gebruiken en jij gebruikt spaties, wat zou je doen?<ul><li>Suggereren dat het project misschien iets als [EditorConfig] (<a href="http://editorconfig.org">http://editorconfig.org</a>) kan gebruiken.</li><li>Je aanpassen aan de conventie (consistent blijven)</li><li><code>issue :retab! command</code></li></ul></li><li>Schrijf een simpele slideshow pagina<ul><li>Bonus punten als het geen JS gebruikt.</li></ul></li><li>Welke tools gebruik je om je je code performance te testen?<ul><li>Profiler, JSPerf, Dromaeo</li></ul></li><li>Als je dit jaar één techniek zou willen beheersen, wat zou het zijn?</li><li>Kan je de verschillen tussen Long-Polling, Websockets en SSE benoemen?</li><li>Leg het belang uit van standaards en standaards organisaties.</li><li>Wat is FOUC? Hoe voorkom je FOUC?</li></ul><h3>HTML-Specifieke Vragen:</h3><ul><li>Wat doet een <code>doctype</code>?</li><li>Wat is het verschil tussen standaard modus en quirks modus?</li><li>Wat zijn de beperkingen als je XHTML pagina’s serveert?<ul><li>Zijn er problemen als je ze serveert als <code>application/xhtml+xml</code>?</li></ul></li><li>Hoe serveer je een pagina met content in meerdere talen?<ul><li>Wat voor dingen moet je voor op passen als je designt of ontwikkelt voor meertalige sites?</li></ul></li><li>Waar zijn <code>data-</code> attributen goed voor?</li><li>Stel je HTML5 voor als een open web platform. Wat zijn dan de bouwstenen van HTML5?</li><li>Beschrijf het verschil tussen cookies, sessionStorage en localStorage.</li></ul><h3>JS-Specifieke Vragen:</h3><ul><li>Beschrijf event delegatie</li><li>Leg uit hoe <code>this</code> werkt in JavaScript</li><li>Leg uit prototypal inheritance werkt</li><li>Hoe kan je je JavaScript testen?</li><li>AMD vs. CommonJS?</li><li>Wat is een hashtable?</li><li>Wat zijn <code>undefined</code> en <code>undeclared</code> variabelen?</li><li>Wat is een closure, en hoe/waarom zou je het gebruiken?<ul><li>Je favoriete pattern om deze te gebruiken? argyle (Alleen toepasbaar bij IIFEs)</li></ul></li><li>Wat is een typische use case voor anonieme functies?</li><li>Leg de “JavaScript module pattern” uit wanneer je het zou gebruiken.<ul><li>Bonus punten voor het noemen van clean namespacing.</li><li>Wat als je modules namespace-loos zijn?</li></ul></li><li>Hoe organiseer je je code? (module pattern, classical inheritance?)</li><li>Wat is het verschild tussen host objects en native objects?</li><li>Verschil tussen:</li></ul><pre class="language-javascript"><code class="language-javascript"><div class="highlight-line"><span class="token keyword">function</span> <span class="token function">Person</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span><span class="token punctuation">}</span> <span class="token keyword">var</span> person <span class="token operator">=</span> <span class="token function">Person</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token keyword">var</span> person <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Person</span><span class="token punctuation">(</span><span class="token punctuation">)</span></div></code></pre><ul><li>Wat is het verschil tussen <code>.call</code> en <code>.apply</code>?</li><li>Leg uit <code>Function.prototype.bind</code>?</li><li>Wanneer optimaliseer je je code?</li><li>Kan je uitleggen hoe overerving werkt in JavaScript?</li><li>Wanneer zou je <code>document.write()</code> gebruiken?<ul><li>Veel ads gebruiken nog steeds <code>document.write()</code> ookal wordt dit meestal afgekeurd</li></ul></li><li>Wat is het verschil tussen feature detection, feature inference en het gebruiken van een UA string</li><li>Leg AJAX zo gedetailleerd mogelijk uit</li><li>Leg uit hoe JSONP werkt (en hoe het niet echt AJAX is)</li><li>Heb je ooit JavaScript templating gebruikt?<ul><li>Zo ja, welke libraries heb je gebruikt? (Mustache.js, Handlebars etc.)</li></ul></li><li>Leg “hoisting” uit.</li><li>Beschrijf event bubbling.</li><li>Wat is het verschil tussen een “attribuut” en een “property”?</li><li>Waarom is het uitbreiden van built-in JavaScript objects geen goed idee?</li><li>Waarom is het uitbreiden van built ins een goed idee?</li><li>Wat is het verschil tussen document load en document ready?</li><li>Wat is het verschil tussen <code>==</code> en <code>===</code>?</li><li>Leg uit hoe je een query string parameter uit een browsers window URL kan halen.</li><li>Leg de same-origin policy met betrekking tot JavaScript uit.</li><li>Beschrijf overerving patronen in JavaScript.</li><li>Maak dit werkend:</li></ul><pre class="language-javascript"><code class="language-javascript"><div class="highlight-line"><span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">2</span><span class="token punctuation">,</span><span class="token number">3</span><span class="token punctuation">,</span><span class="token number">4</span><span class="token punctuation">,</span><span class="token number">5</span><span class="token punctuation">]</span><span class="token punctuation">.</span><span class="token function">duplicate</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// [1,2,3,4,5,1,2,3,4,5]</span></div></code></pre><ul><li>Beschrijf een strategie voor memoization (ontwijken van berekening repetitie) in JavaScript.</li><li>Waarom heet het een Ternary expression, waar doelt het woord “Ternary” op?</li><li>Wat is de ariteit van een functie?</li><li>Wat is <code>"use strict";</code>? Wat zijn de voor- en nadelen om dit te gebruiken?</li></ul><h3>JS-Code Voorbeelden:</h3><pre class="language-javascript"><code class="language-javascript"><div class="highlight-line"><span class="token operator">~</span><span class="token operator">~</span><span class="token number">3.14</span></div></code></pre><p>Vraag: Welke waarde wordt terug gegeven bij de bovenstaande code?<br><strong>Antwoord: 3</strong></p><pre class="language-javascript"><code class="language-javascript"><div class="highlight-line"><span class="token string">"ik hou van lasagna"</span><span class="token punctuation">.</span><span class="token function">split</span><span class="token punctuation">(</span><span class="token string">""</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">reverse</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">join</span><span class="token punctuation">(</span><span class="token string">""</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div></code></pre><p>Vraag: Welke waarde wordt terug gegeven bij de bovenstaande code?<br><strong>Antwoord: "angasal nav uoh ki"</strong></p><pre class="language-javascript"><code class="language-javascript"><div class="highlight-line"><span class="token punctuation">(</span> window<span class="token punctuation">.</span>foo <span class="token operator">||</span> <span class="token punctuation">(</span> window<span class="token punctuation">.</span>foo <span class="token operator">=</span> <span class="token string">"bar"</span> <span class="token punctuation">)</span> <span class="token punctuation">)</span><span class="token punctuation">;</span></div></code></pre><p>Vraag: What is the value of window.foo?<br><strong>Antwoord: "bar"</strong><br>Alleen als window.foo falsy was, anders leverde het zijn waarde op.</p><pre class="language-javascript"><code class="language-javascript"><div class="highlight-line"><span class="token keyword">var</span> foo <span class="token operator">=</span> <span class="token string">"Hallo"</span><span class="token punctuation">;</span> <span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">var</span> bar <span class="token operator">=</span> <span class="token string">" Wereld"</span><span class="token punctuation">;</span> <span class="token function">alert</span><span class="token punctuation">(</span>foo <span class="token operator">+</span> bar<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">alert</span><span class="token punctuation">(</span>foo <span class="token operator">+</span> bar<span class="token punctuation">)</span><span class="token punctuation">;</span></div></code></pre><p>Vraag: Wat is de uitkomst van de twee alerts?<br><strong>Antwoord: “Hallo Wereld” & ReferenceError: bar is not defined</strong></p><pre class="language-javascript"><code class="language-javascript"><div class="highlight-line"><span class="token keyword">var</span> foo <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">;</span></div><div class="highlight-line">foo<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><div class="highlight-line">foo<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span><span class="token number">2</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div></code></pre><p>Vraag: Wat is de waarde van foo.length?<br>**Antwoord: <code>2</code></p><pre class="language-javascript"><code class="language-javascript"><div class="highlight-line"><span class="token keyword">var</span> foo <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">;</span></div><div class="highlight-line">foo<span class="token punctuation">.</span>bar <span class="token operator">=</span> <span class="token string">'hello'</span><span class="token punctuation">;</span></div></code></pre><p>Vraag: Wat is de waarde van foo.length?<br>**Antwoord: <code>undefined</code></p><h3>jQuery-Specifieke Vragen:</h3><ul><li>Leg “chaining” uit.</li><li>Leg “deferreds” uit.</li><li>Wat zijn een paar jQuery specifieke optimalisaties die jij kan implementeren?</li><li>Wat doet <code>.end()</code>?</li><li>Hoe en waarom zou je een bound event handler namespacen?</li><li>Noem 4 verschillende waardes die je aan een jQuery methode kan geven.<ul><li>Selector (string), HTML (string), Callback (function), HTMLElement, object, array, element array, jQuery Object etc.</li></ul></li><li>Wat is de effecten (fx) queue?</li><li>Wat is het verschil tussen <code>.get()</code>, <code>[]</code>, en <code>.eq()</code>?</li><li>Wat is het verschil tussen <code>.bind()</code>, <code>.live()</code>, en <code>.delegate()</code>?</li><li>Wat is het verschil tussen <code>$</code> en <code>$.fn</code>? Of sowieso, wat is <code>$.fn</code>.</li><li>Optimaliseer deze selector:</li></ul><pre class="language-javascript"><code class="language-javascript"><div class="highlight-line"><span class="token function">$</span><span class="token punctuation">(</span><span class="token string">".foo div#bar:eq(0)"</span><span class="token punctuation">)</span></div></code></pre><ul><li>Wat is het verschil tussen ‘delegate()’ en ‘live()’?</li></ul><h3>CSS-Specifieke Vragen:</h3><ul><li>Beschrijf wat een “reset” CSS bestand doet en hoe dit bruikbaar is.</li><li>Beschrijf Floats en hoe ze werken.</li><li>Wat zijn de verschillende clearing technieken en welke is toepasselijk voor welke context?</li><li>Leg CSS sprites uit en hoe je ze kan implementeren op een pagina.</li><li>Wat zijn jouw favoriete image replacement technieken en welke gebruik je wanneer?</li><li>CSS property hacks, conditionele ingeladen .css files, of… iets anders?</li><li>Hoe serveer je je pagina’s voor feature-constrained browsers?<ul><li>Welke technieken/processen gebruik je?</li></ul></li><li>Wat zijn de verschillende manieren om content visueel te verbergen (en het alleen zichtbaar te houden voor screenreaders)?</li><li>Heb je ooit een grid-systeem gebruikt en zo ja, wat is je voorkeur?</li><li>Heb je ooit media queries of mobiel specifieke layouts/CSS gebruikt of geïmplementeerd?</li><li>Ben je bekend met SVG styling?</li><li>Hoe optimaliseer je je pagina’s voor printen?</li><li>Wat zijn sommige van de “gotchas” voor het schrijven van efficiënte CSS?</li><li>Wat zijn de voor- en nadelen van CSS preprocessors? (SASS, Compass, Stylus, LESS)<ul><li>Wat vind je wel en niet fijn aan diegene die jij hebt gebruikt.</li></ul></li><li>Hoe zou je een website design implementeren dat gebruik maakt van non-standard fonts?<ul><li>Webfonts (font services zoals: Google Webfonts, Typekit etc.)</li></ul></li><li>Leg uit hoe een browser beslists welke elementen hij moet matchen met een CSS selector?</li></ul><h3>Optionele Losse Vragen:</h3><ul><li>Wat is het coolste dat je ooit gemaakt hebt. Waar ben je trots op?</li><li>Wat zijn de favoriete dingen van de ontwikkeltools die je gebruikt?</li><li>Heb je hobbyprojecten? Zo ja, wat voor?</li><li>Wat is je favoriete feature van Internet Explorer?</li></ul></div><div class="content-edit"><a rel="external noreferrer noopener" target="_blank" href="https://github.com/h5bp/Front-end-Developer-Interview-Questions/tree/master/src/translations/dutch/index">Edit this page</a></div></main><footer class="footer"><p class="footer-text">Copyright (c) 2012 - 2018. Contributors to <a href="https://github.com/h5bp/Front-end-Developer-Interview-Questions">Front-end-Developer-Interview-Questions.</a><br>This project is maintained by <a href="https://github.com/cezaraugusto" target="_blank" rel="noreferrer noopener">Cezar Augusto</a>, <a href="https://github.com/roblarsen" target="_blank" rel="noreferrer noopener">Rob Larsen</a> and <a href="https://github.com/vvscode" target="_blank" rel="noreferrer noopener">Vasiliy Vanchuk</a> .<br>Curious about the project? <a href="/about/">Read more about here</a>.</p></footer></div><script>console.log("%cA black belt is a white belt that didn't quit.","color: #fff; font-size: 80px; text-shadow: 1px 1px 1px #000; font-family: serif;");</script></body></html> |