JavaScript Interview Fragen & Antworten

Wie bereite ich mich auf ein JavaScript Developer Interview vor? Häufige Fragen und Antworten.

Interview Types

1. Phone Screen (15–30 Min)

Zweck: Screening, nicht aussieben

Typisch:

• "Tell me about yourself"
• "Why our company?"
• 1–2 Easy Coding Questions
• Your questions

Ziel: Wechsel zu Technical Interview

2. Technical Interview (45–90 Min)

Zweck: Assess Technical Skills

Typisch:

• JavaScript Concepts Questions
• Coding Challenge (LeetCode–style)
• Architecture/System Design (höhere Level)
• Live Coding + Explanation

Ziel: Show depth, but also communication

3. Take-Home Assignment (1–4 Stunden)

Zweck: Real-world scenario

Typisch:

• Build small feature oder fix bug
• Sie evaluieren: Code quality, Testing, Git history
• Do in your own time

Ziel: Show realistic work (not just competitive programming)

4. Behavioral Interview (30–45 Min)

Zweck: Culture fit, soft skills

Typisch:

• "Tell me about a conflict"
• "Your biggest learning"
• "How you handle pressure"
• Team questions

Ziel: Show communication, growth mindset

Technical Questions (Häufig)

Basic Concepts

1. Was ist Scope in JavaScript?

Scope definiert, wo Variablen accessible sind.

Types:

• Global Scope: Accessible everywhere
• Function Scope: Nur in Function
• Block Scope: Nur in Block (let/const)

let global = 1; // Global

function test() {
  let funcScoped = 2; // Function Scope
  
  if (true) {
    let blockScoped = 3; // Block Scope
    var globalScoped = 4; // Function Scoped (old!)
  }
  console.log(blockScoped); // Error: not defined
  console.log(globalScoped); // 4 (var hoisted)
}

2. Was ist Closure?

Function die auf Variablen außerhalb zugrieft.

function makeCounter() {
  let count = 0;
  return function() {
    return ++count;
  };
}

const counter = makeCounter();
console.log(counter()); // 1
console.log(counter()); // 2
// Closure preserves 'count'

3. This Keyword – Was ist es?

this refers to the object which it was called on.

const obj = {
  name: "John",
  greet: function() {
    console.log(this.name);
  }
};

obj.greet(); // "John" (this = obj)

const greet = obj.greet;
greet(); // undefined (this = window/global)

const boundGreet = greet.bind(obj);
boundGreet(); // "John" (this = obj)

Key: this depends on CALL SITE, not where defined.

4. Prototypes & Inheritance?

JavaScript ist prototype-basiert.

function Animal(name) {
  this.name = name;
}

Animal.prototype.speak = function() {
  console.log(this.name + " makes a sound");
};

function Dog(name) {
  Animal.call(this, name);
}

Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

const dog = new Dog("Rex");
dog.speak(); // "Rex makes a sound"

5. Async/Await vs. Promises?

Beide sind gleiche thing, aber syntaktische Sucker.

// Promise
function fetch(url) {
  return new Promise((resolve, reject) => {
    setTimeout(() => resolve("data"), 1000);
  });
}

// Using Promise
fetch("/api").then(data => console.log(data));

// Using async/await
async function getData() {
  const data = await fetch("/api");
  console.log(data);
}

getData();

Async/await ist cleaner, error handling easier.

Intermediate Questions

6. Event Loop – wie funktioniert es?

JavaScript ist Single-threaded, aber kann asynchrone Operationen handhaben.

Call Stack → Event Queue → Web APIs

console.log("1");

setTimeout(() => console.log("2"), 0);

console.log("3");

// Output: 1, 3, 2
// setTimeout goes to Event Queue, waits for Stack leer

7. Hoisting?

Deklarationen werden hochgezogen.

console.log(x); // undefined (hoisted, aber nicht initialized)
var x = 5;
console.log(x); // 5

// Mit let/const:
console.log(y); // ReferenceError
let y = 5;

let/const haben "Temporal Dead Zone" (hoisted aber nicht accessible).

8. Event Delegation?

Optimize: Nicht jeden Element einen Listener geben, sondern Parent.

// Without Delegation (inefficient)
document.querySelectorAll(".btn").forEach(btn => {
  btn.addEventListener("click", () => {
    console.log("Clicked");
  });
});

// With Delegation (efficient)
document.getElementById("container").addEventListener("click", (e) => {
  if (e.target.classList.contains("btn")) {
    console.log("Clicked");
  }
});

9. Callback Hell / Pyramid of Doom?

Nested callbacks are hard to read.

// Callback Hell
getUser(id, (user) => {
  getOrders(user.id, (orders) => {
    getDetails(orders[0].id, (details) => {
      console.log(details);
    });
  });
});

// Better: Promises
getUser(id)
  .then(user => getOrders(user.id))
  .then(orders => getDetails(orders[0].id))
  .then(details => console.log(details));

// Even Better: async/await
async function getData() {
  const user = await getUser(id);
  const orders = await getOrders(user.id);
  const details = await getDetails(orders[0].id);
  console.log(details);
}

10. Array Methods – Higher Order Functions?

Map, Filter, Reduce manipulieren Arrays functional.

const nums = [1, 2, 3, 4];

// Map: transform
const doubled = nums.map(n => n * 2); // [2, 4, 6, 8]

// Filter: select
const evens = nums.filter(n => n % 2 === 0); // [2, 4]

// Reduce: aggregate
const sum = nums.reduce((acc, n) => acc + n, 0); // 10

Coding Challenges

Easy Level

Challenge 1: Fibonacci

// Recursive (einfach, aber slow)
function fib(n) {
  return n <= 1 ? n : fib(n - 1) + fib(n - 2);
}

// Iterative (better)
function fib(n) {
  let a = 0, b = 1;
  for (let i = 0; i < n; i++) {
    [a, b] = [b, a + b];
  }
  return a;
}

// Memoized (best)
function fib(n, memo = {}) {
  if (n in memo) return memo[n];
  if (n <= 1) return n;
  memo[n] = fib(n - 1, memo) + fib(n - 2, memo);
  return memo[n];
}

Challenge 2: Reverse String

function reverseString(s) {
  return s.split('').reverse().join('');
  // oder
  return [...s].reverse().join('');
}

Challenge 3: Check Palindrome

function isPalindrome(s) {
  const clean = s.toLowerCase().replace(/[^a-z0-9]/g, '');
  const reversed = clean.split('').reverse().join('');
  return clean === reversed;
}

Intermediate Level

Challenge 4: Two Sum

// Find two numbers that sum to target
function twoSum(nums, target) {
  const seen = new Map();
  
  for (let i = 0; i < nums.length; i++) {
    const complement = target - nums[i];
    if (seen.has(complement)) {
      return [seen.get(complement), i];
    }
    seen.set(nums[i], i);
  }
  
  return [-1, -1];
}

Challenge 5: Remove Duplicates from Array

// With Set
function removeDuplicates(arr) {
  return [...new Set(arr)];
}

// With Filter
function removeDuplicates(arr) {
  return arr.filter((val, idx) => arr.indexOf(val) === idx);
}

Challenge 6: Flatten Nested Array

function flatten(arr) {
  return arr.reduce((acc, val) => {
    return acc.concat(Array.isArray(val) ? flatten(val) : val);
  }, []);
}

// oder mit flat()
function flatten(arr) {
  return arr.flat(Infinity);
}

Hard Level

Challenge 7: Implement Promise

class MyPromise {
  constructor(executor) {
    this.state = 'pending';
    this.value = null;
    
    const resolve = (val) => {
      if (this.state === 'pending') {
        this.state = 'fulfilled';
        this.value = val;
      }
    };
    
    executor(resolve, reject);
  }
  
  then(onFulfilled) {
    if (this.state === 'fulfilled') {
      return new MyPromise((resolve) => {
        resolve(onFulfilled(this.value));
      });
    }
  }
}

Challenge 8: Debounce Function

function debounce(func, delay) {
  let timeoutId;
  
  return function(...args) {
    clearTimeout(timeoutId);
    timeoutId = setTimeout(() => func(...args), delay);
  };
}

// Usage
const search = debounce((term) => {
  console.log("Searching for:", term);
}, 300);

// Wird nur nach 300ms Stille aufgerufen
input.addEventListener('input', (e) => search(e.target.value));

Challenge 9: Deep Clone Object

function deepClone(obj) {
  if (typeof obj !== 'object' || obj === null) {
    return obj;
  }
  
  if (obj instanceof Date) {
    return new Date(obj.getTime());
  }
  
  if (obj instanceof Array) {
    return obj.map(item => deepClone(item));
  }
  
  const cloned = {};
  for (let key in obj) {
    cloned[key] = deepClone(obj[key]);
  }
  return cloned;
}

Behavioral Questions

1. "Tell me about yourself"

Structure: Background → Interests → Why here

"I'm a JavaScript developer with 3 years of experience. 
I started learning to build interactive websites, 
and now I specialize in React. 
I'm particularly interested in your company because 
you work on [specific project], and I think 
the scale challenges would help me grow."

2. "Describe a conflict with a teammate"

Structure: Situation → Action → Result (STAR)

"My colleague proposed Solution A, I preferred Solution B. 
I listened to his reasoning, and I shared mine. 
We realized Solution B had performance benefits, 
but A had better maintainability. 
We compromised with a hybrid, learned a lot, 
and became better collaborators."

3. "Your biggest failure"

Structure: Challenge → Learning → How it changed you

"I once deployed code without proper testing. 
It broke in production. 
I learned the hard way why testing matters. 
Now I practice TDD, and I automated testing in my CI/CD. 
It's made me a better engineer."

4. "How do you handle stress?"

Show you have strategies:

"When stressed, I break problems into smaller chunks. 
I take short breaks to avoid fatigue. 
I communicate with my team early if I'm stuck. 
And I document what I learn so next time it's easier."

Interview Tipps

Vorbereitung

1. Practice Coding (LeetCode, HackerRank)
2. Know Your Resume (Alles was darauf steht)
3. System Design (Für Senior Levels)
4. Ask Smart Questions (Zeige Interesse)

Während Interview

1. Think Out Loud (Interviewer sieht deinen Prozess)
2. Ask for Clarification (Besser fragen als falsch verstehen)
3. Start Simple (Dann optimize)
4. Admit Mistakes (Better than hide them)
5. Test Your Code (Mental oder auf Papier)

Häufige Fehler

• ✗ Zu schnell coden (ohne Plan)
• ✗ Nicht denken out loud
• ✗ Nicht testen
• ✗ Arrogant sein
• ✗ Nicht auf Interview vorbereitet sein
• ✗ Keine Fragen stellen

Better:

• ✓ Plan first, code second
• ✓ Think out loud, alles explains
• ✓ Test before submit
• ✓ Humble, but confident
• ✓ Prepared & enthusiastic
• ✓ Ask thoughtful questions

Interview Timeline

1 Woche vor:

• Review Basics (Scope, This, Closures)
• Practice 1–2 Coding Challenges/Tag
• Research the company
• Prepare your stories (STAR format)

1 Tag vor:

• Leichte Practice (nicht zu viel)
• Gutes Schlafen
• Ausrüstung testen (Wenn remote)

Tag selbst:

• Komm früh
• Calm down
• Be yourself

Nach dem Interview

Immer sagen/tun:

1. "Danke für die Zeit" (Email)
2. "Wie geht es weiter?" (Fragen)
3. Lass sie wissen dein Interest (Ohne desperate)
4. Geduldig warten (Oft 1–2 Wochen)

Zusammenfassung

Interview Success Formula:

1. Technical Skills: Practice coding, know concepts
2. Communication: Explain your thinking
3. Problem Solving: Start simple, then optimize
4. Behavioral: STAR stories, growth mindset
5. Enthusiasm: Show interest in role + company

Häufigste Fragen:

• Closures, this, Async/Await, Hoisting, Event Loop
• Coding: Two Sum, Flatten, Debounce, Promises

Prepare well, stay calm, show who you are. Good luck!