알아야 할 주요 JavaScript 인터뷰 질문-JS 튜토리얼-php.cn

알아야 할 주요 JavaScript 인터뷰 질문

王林

풀어 주다： 2024-09-10 20:32:18

원래의

676명이 탐색했습니다.

Top JavaScript Interview Questions You Need to Know

소개:

JavaScript는 웹 개발에서 가장 널리 사용되는 프로그래밍 언어 중 하나로 남아 있습니다. 주니어 개발자이든 노련한 전문가이든 JavaScript를 마스터하는 것은 인터뷰에 성공하는 데 중요합니다. 이 블로그에서는 모든 개발자가 대답해야 할 10가지 필수 JavaScript 인터뷰 질문을 다룰 것입니다.

1. JavaScript의 클로저란 무엇입니까?

클로저는 JavaScript의 기본 개념입니다. 이는 함수가 해당 범위 외부에서 실행되는 경우에도 함수가 해당 어휘 범위에 대한 액세스를 유지하는 경우 발생합니다.

function outerFunction() {
  let outerVariable = 'I am from outer scope';

  function innerFunction() {
    console.log(outerVariable); // Accesses outerVariable
  }

  return innerFunction;
}

const closureFunction = outerFunction();
closureFunction(); // Outputs: I am from outer scope

로그인 후 복사

중요한 이유: 클로저는 JavaScript의 데이터 캡슐화 및 함수 범위를 이해하는 데 핵심입니다.

2. 이벤트 루프와 작동 방식 설명

이벤트 루프는 JavaScript가 단일 스레드임에도 불구하고 비차단 작업을 수행할 수 있도록 하는 메커니즘입니다. 작업을 대기열에 배치하고 호출 스택이 비어 있을 때 실행하는 방식으로 작동합니다.

핵심 포인트:

Call Stack: 함수 실행을 처리합니다.
콜백 대기열: 실행할 준비가 된 콜백을 보관합니다.
이벤트 루프: 작업을 콜백 대기열에서 호출 스택으로 이동합니다.
중요한 이유: 효율적이고 반응성이 뛰어난 JavaScript 코드를 작성하려면 이벤트 루프를 이해하는 것이 필수적입니다.

3. ==와 ===의 차이점은 무엇인가요?

==(동등 연산자): 값을 유형 강제와 비교합니다.
===(엄격한 동등 연산자): 유형 강제 없이 값을 비교합니다(엄격한 동등).

console.log(5 == '5');  // true
console.log(5 === '5'); // false

로그인 후 복사

중요한 이유: ===를 사용하면 유형 강제로 인해 발생하는 예기치 않은 버그를 방지하여 코드를 더 예측 가능하고 안정적으로 만들 수 있습니다.

4. Promise란 무엇이며 어떻게 작동하나요?

Promise는 비동기 작업의 최종 완료 또는 실패를 나타내는 객체입니다. 콜백에 비해 비동기 코드를 처리하는 더 깔끔한 방법을 제공합니다.

주요 방법:

then(onFulfilled, onRejected): 해결 및 거부된 상태를 처리합니다.
catch(onRejected): 오류를 처리합니다.
finally(onFinally): Promise의 결과에 관계없이 코드를 실행합니다.

const promise = new Promise((resolve, reject) => {
  setTimeout(() => resolve('Resolved!'), 1000);
});

promise.then(result => console.log(result)); // Outputs: Resolved!

로그인 후 복사

5. JavaScript에서 이 키워드는 무엇입니까?

this 키워드는 현재 기능을 실행하는 개체를 나타냅니다. 그 값은 함수가 호출되는 상황에 따라 달라집니다.

일반적인 사용 사례:

전역 컨텍스트: 전역 개체를 나타냅니다.
객체 메소드: 객체를 나타냅니다.
생성자 함수: 생성된 인스턴스를 나타냅니다.

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

obj.greet(); // Outputs: Alice

로그인 후 복사

6. 화살표 함수란 무엇이며 일반 함수와 어떻게 다릅니까?

화살표 함수는 더욱 간결한 구문을 제공하고 어휘 바인딩을 가집니다. 즉, 주변 컨텍스트에서 이를 상속받습니다.

const add = (a, b) => a + b;

로그인 후 복사

차이:

정규 함수: 자체 this가 있습니다.
화살표 함수: 상위 범위에서 이를 상속합니다.

중요한 이유: 화살표 함수는 코드를 단순화하고 콜백에서 이 바인딩과 관련된 일반적인 문제를 방지합니다. 화살표 함수는 코드를 단순화하고 콜백에서 이 바인딩과 관련된 일반적인 문제를 방지합니다.

7. JavaScript에서 프로토타입 상속은 어떻게 작동하나요?

프로토타입 상속을 통해 객체는 다른 객체의 속성과 메서드를 상속받을 수 있습니다. JavaScript는 프로토타입을 사용하여 상속을 구현합니다.

const animal = {
  speak() {
    console.log('Animal speaks');
  }
};

const dog = Object.create(animal);
dog.bark = function() {
  console.log('Woof');
};

dog.speak(); // Outputs: Animal speaks
dog.bark();  // Outputs: Woof

로그인 후 복사

8. null과 정의되지 않은 것의 차이점은 무엇입니까?

null: 의도적인 값 부재를 나타냅니다.

정의되지 않음: 선언되었지만 초기화되지 않은 변수를 나타냅니다.

let a;
console.log(a); // Outputs: undefined

let b = null;
console.log(b); // Outputs: null

로그인 후 복사

9. 맵, 필터, 축소 방법이란 무엇인가요?

다음은 배열 조작에 사용되는 고차 함수입니다.

map: 각 요소에 함수를 적용하여 새로운 배열을 생성합니다.
필터: 테스트를 통과한 요소로 새 배열을 생성합니다.
축소: 함수를 적용하여 배열을 단일 값으로 줄입니다.

const numbers = [1, 2, 3, 4, 5];

const doubled = numbers.map(n => n * 2);
const evens = numbers.filter(n => n % 2 === 0);
const sum = numbers.reduce((total, n) => total + n, 0);

console.log(doubled); // [2, 4, 6, 8, 10]
console.log(evens);   // [2, 4]
console.log(sum);     // 15

로그인 후 복사