Live Coding

자바스크립트 객체가 비어 있는지 어떻게 확인합니까?

설명: 객체는 자체적인 열거 가능한 속성이 없으면 비어 있는 것입니다. 주어진 객체의 자체 열거 가능한 속성 이름 배열을 반환하는 Object.keys(obj)를 사용할 수 있습니다. 이 배열의 길이가 0이면 객체는 비어 있는 것입니다.

function isEmpty(obj) {
  return Object.keys(obj).length === 0;
}

console.log(isEmpty({})); // true
console.log(isEmpty({ a: 1 })); // false

주어진 문자열을 뒤집는 함수를 작성하십시오.

설명: 가장 간단한 방법은 문자열을 문자 배열로 변환하고, 배열의 내장 reverse() 메서드를 사용한 다음, 문자를 다시 문자열로 결합하는 것입니다.

function reverseString(str) {
  return str.split('').reverse().join('');
}

console.log(reverseString('hello')); // 'olleh'

주어진 문자열이 회문인지 확인하는 함수를 작성하십시오.

설명: 회문은 앞에서 뒤로 읽으나 뒤에서 앞으로 읽으나 같은 단어 또는 구입니다. 문자열을 뒤집어서 (더 견고한 검사를 위해 대소문자와 비영숫자 문자를 무시하지만, 여기서는 간단한 검사를 수행합니다) 원본과 비교하여 이를 확인할 수 있습니다.

function isPalindrome(str) {
  const reversed = str.split('').reverse().join('');
  return str === reversed;
}

console.log(isPalindrome('racecar')); // true
console.log(isPalindrome('hello')); // false

숫자 배열에서 가장 큰 숫자를 찾는 함수를 작성하십시오.

설명: 배열을 반복하면서 지금까지 찾은 가장 큰 숫자를 추적할 수 있습니다. 또는 스프레드 문법(...)과 함께 Math.max() 함수를 사용하여 배열 요소를 인수로 전달할 수 있습니다.

function findMaxNumber(arr) {
  if (arr.length === 0) return undefined; // 또는 오류 발생
  return Math.max(...arr);
}

console.log(findMaxNumber([1, 5, 2, 9, 3])); // 9

1부터 n까지 숫자를 출력하는 프로그램을 작성하십시오. 하지만 3의 배수에는 숫자 대신 'Fizz'를 출력하고, 5의 배수에는 'Buzz'를 출력하십시오. 3과 5의 공배수에는 'FizzBuzz'를 출력하십시오.

설명: 이 고전적인 문제는 기본적인 루프 및 조건 논리를 테스트합니다. 1부터 n까지 반복하고 모듈로 연산자(%)를 사용하여 3과 5로 나누어 떨어지는지 확인해야 합니다.

function fizzBuzz(n) {
  for (let i = 1; i <= n; i++) {
    if (i % 3 === 0 && i % 5 === 0) {
      console.log('FizzBuzz');
    } else if (i % 3 === 0) {
      console.log('Fizz');
    } else if (i % 5 === 0) {
      console.log('Buzz');
    } else {
      console.log(i);
    }
  }
}

fizzBuzz(15);

배열에서 중복 요소를 제거하는 함수를 작성하십시오.

설명: 이를 달성하는 현대적이고 간결한 방법은 Set을 사용하는 것입니다. Set은 고유한 값만 저장합니다. 배열을 Set으로 변환한 다음 다시 배열로 변환할 수 있습니다.

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

console.log(removeDuplicates([1, 2, 2, 3, 4, 4, 5])); // [1, 2, 3, 4, 5]

두 문자열이 서로 애너그램인지 확인하는 함수를 작성하십시오.

설명: 애너그램은 다른 단어의 글자를 재배열하여 형성된 단어입니다. 확인하려면 문자열을 정리하고, 정렬하고, 비교할 수 있습니다. 정리에는 비영숫자 문자를 제거하고 일관된 대소문자로 변환하는 것이 포함됩니다.

function isAnagram(str1, str2) {
  const clean = (str) => str.replace(/[^a-z0-9]/gi, '').toLowerCase();
  const sorted = (str) => clean(str).split('').sort().join('');
  
  return sorted(str1) === sorted(str2);
}

console.log(isAnagram('listen', 'silent')); // true
console.log(isAnagram('hello', 'world')); // false

음이 아닌 정수의 팩토리얼을 계산하는 함수를 작성하십시오.

설명: 숫자의 팩토리얼(n!)은 1부터 n까지의 모든 양의 정수를 곱한 값입니다. 1부터 n까지 숫자를 곱하여 반복적으로 계산할 수 있습니다.

function factorial(n) {
  if (n < 0) return undefined; // 팩토리얼은 음수에 대해 정의되지 않습니다.
  if (n === 0) return 1;
  let result = 1;
  for (let i = 1; i <= n; i++) {
    result *= i;
  }
  return result;
}

console.log(factorial(5)); // 120

배열의 모든 숫자의 합계를 반환하는 함수를 작성하십시오.

설명: reduce 메서드를 사용할 수 있습니다. 이 메서드는 배열에서 단일 값을 누적하는 데 이상적입니다. 콜백 함수와 초기값(합계를 위한 0)을 사용합니다.

function sumArray(arr) {
  return arr.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
}

console.log(sumArray([1, 2, 3, 4])); // 10

중첩 배열을 평탄화하는 함수를 작성하십시오. 단순화를 위해 한 수준의 중첩만 있다고 가정하십시오.

설명: 한 수준의 중첩의 경우 스프레드 연산자 또는 flat() 메서드(ES2019)와 함께 Array.prototype.concat()을 사용할 수 있습니다.

function flattenArray(arr) {
  // flat() 사용 (ES2019+가 괜찮다면 더 간단함)
  // return arr.flat();

  // reduce 및 concat 사용
  return arr.reduce((acc, val) => acc.concat(val), []);
}

console.log(flattenArray([1, [2, 3], 4, [5]])); // [1, 2, 3, 4, 5]

주어진 문자열에서 모음(a, e, i, o, u)의 개수를 세는 함수를 작성하십시오.

설명: 문자열을 반복하면서(대소문자 구분 없이) 각 문자가 모음인지 확인합니다. 카운터를 유지합니다.

function countVowels(str) {
  const vowels = 'aeiou';
  let count = 0;
  for (let char of str.toLowerCase()) {
    if (vowels.includes(char)) {
      count++;
    }
  }
  return count;
}

console.log(countVowels('Hello World')); // 3

문장을 제목 대문자로 변환하는 함수를 작성하십시오(각 단어의 첫 글자 대문자).

설명: 문장을 단어로 분할한 다음, 각 단어를 반복하면서 첫 글자를 대문자로 만들고 나머지는 소문자로 만듭니다. 마지막으로 단어를 다시 결합합니다.

function titleCase(str) {
  return str.toLowerCase().split(' ').map(word => {
    return word.charAt(0).toUpperCase() + word.slice(1);
  }).join(' ');
}

console.log(titleCase('i am a little tea pot')); // 'I Am A Little Tea Pot'

정수 배열 nums와 정수 target이 주어졌을 때, 합이 target이 되는 두 숫자의 인덱스를 반환하십시오.

설명: 일반적인 접근 방식은 반복하면서 숫자와 해당 인덱스를 해시 맵(또는 자바스크립트 객체)에 저장하는 것입니다. 각 숫자에 대해 target - 현재_숫자가 맵에 존재하는지 확인합니다.

function twoSum(nums, target) {
  const map = {};
  for (let i = 0; i < nums.length; i++) {
    const complement = target - nums[i];
    if (map[complement] !== undefined) {
      return [map[complement], i];
    }
    map[nums[i]] = i;
  }
  return []; // 또는 null, 또는 해결책이 없으면 오류 발생
}

console.log(twoSum([2, 7, 11, 15], 9)); // [0, 1]

카운터 함수를 반환하는 함수를 생성하십시오. 반환된 함수가 호출될 때마다 카운트를 증가시키고 반환해야 합니다.

설명: 이것은 클로저를 보여줍니다. 내부 함수는 외부 함수가 실행을 마친 후에도 외부 함수의 스코프에 있는 count 변수에 접근할 수 있습니다.

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

const counter1 = createCounter();
console.log(counter1()); // 1
console.log(counter1()); // 2
const counter2 = createCounter();
console.log(counter2()); // 1

문자열에서 첫 번째 반복되지 않는 문자를 찾는 함수를 작성하십시오.

설명: 해시 맵을 사용하여 문자 빈도를 계산할 수 있습니다. 먼저, 문자열을 반복하여 빈도 맵을 만듭니다. 그런 다음, 문자열을 다시 반복하고 개수가 1인 첫 번째 문자를 반환합니다.

function firstNonRepeatingChar(str) {
  const charCount = {};
  for (const char of str) {
    charCount[char] = (charCount[char] || 0) + 1;
  }
  for (const char of str) {
    if (charCount[char] === 1) {
      return char;
    }
  }
  return null; // 또는 모두 반복되는 경우를 위한 어떤 지표
}

console.log(firstNonRepeatingChar('aabbcdeeff')); // 'c'
console.log(firstNonRepeatingChar('swiss')); // 'w'

배열을 지정된 크기의 그룹으로 분할하는 함수를 작성하십시오.

설명: 배열을 반복하면서 지정된 크기의 슬라이스를 가져와 새 배열에 푸시합니다. 마지막 청크가 더 작을 수 있는 경우를 처리합니다.

function chunkArray(arr, size) {
  const chunked = [];
  let index = 0;
  while (index < arr.length) {
    chunked.push(arr.slice(index, index + size));
    index += size;
  }
  return chunked;
}

console.log(chunkArray([1, 2, 3, 4, 5, 6, 7], 3)); // [[1, 2, 3], [4, 5, 6], [7]]

주어진 숫자가 소수인지 확인하는 함수를 작성하십시오.

설명: 소수는 1보다 큰 자연수로, 1과 자기 자신 외에는 양의 약수가 없습니다. 2부터 숫자의 제곱근까지 반복하여 나누어 떨어지는지 확인합니다. 1과 2와 같은 예외적인 경우를 처리합니다.

function isPrime(num) {
  if (num <= 1) return false;
  if (num <= 3) return true;

  if (num % 2 === 0 || num % 3 === 0) return false;

  for (let i = 5; i * i <= num; i = i + 6) {
    if (num % i === 0 || num % (i + 2) === 0) return false;
  }

  return true;
}

console.log(isPrime(7)); // true
console.log(isPrime(10)); // false

문장에서 가장 긴 단어를 찾는 함수를 작성하십시오.

설명: 문자열을 단어 배열로 분할합니다. 그런 다음, 배열을 반복하면서 지금까지 찾은 가장 긴 단어(또는 그 길이)를 추적합니다.

function findLongestWord(str) {
  const words = str.split(' ');
  let longestWord = '';
  for (const word of words) {
    // 필요한 경우 단어 정리 (예: 구두점 제거)
    if (word.length > longestWord.length) {
      longestWord = word;
    }
  }
  return longestWord;
}

console.log(findLongestWord('The quick brown fox jumped over the lazy dog')); // 'jumped'

Array.prototype.map 함수의 자체 버전을 구현하십시오.

설명: map 함수는 콜백을 받아들이고 원본 배열의 각 요소에 콜백을 적용하여 새 배열을 만듭니다. 함수는 배열을 반복하고 새 배열을 구축해야 합니다.

function myMap(arr, callback) {
  const mappedArray = [];
  for (let i = 0; i < arr.length; i++) {
    mappedArray.push(callback(arr[i], i, arr));
  }
  return mappedArray;
}

const numbers = [1, 4, 9];
const roots = myMap(numbers, Math.sqrt);
console.log(roots); // [1, 2, 3]

Array.prototype.filter 함수의 자체 버전을 구현하십시오.

설명: filter 함수는 콜백을 받아들이고 제공된 콜백 함수에 의해 구현된 테스트를 통과하는 모든 요소로 새 배열을 만듭니다.

function myFilter(arr, callback) {
  const filteredArray = [];
  for (let i = 0; i < arr.length; i++) {
    if (callback(arr[i], i, arr)) {
        filteredArray.push(arr[i]);
    }
  }
  return filteredArray;
}

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const result = myFilter(words, word => word.length > 6);
console.log(result); // ['exuberant', 'destruction', 'present']

Array.prototype.reduce 함수의 자체 버전을 구현하십시오.

설명: reduce 함수는 배열의 각 요소에 사용자 제공 '리듀서' 콜백 함수를 실행하고, 이전 요소에 대한 계산에서 반환된 값을 전달합니다. 배열의 모든 요소를 가로질러 리듀서를 실행한 최종 결과는 단일 값입니다. 초기값 인수를 처리하십시오.

function myReduce(arr, callback, initialValue) {
  let accumulator = initialValue;
  let startIndex = 0;

  if (initialValue === undefined) {
      if (arr.length === 0) throw new TypeError('Reduce of empty array with no initial value');
      accumulator = arr[0];
      startIndex = 1;
  }

  for (let i = startIndex; i < arr.length; i++) {
    accumulator = callback(accumulator, arr[i], i, arr);
  }
  return accumulator;
}

const array1 = [1, 2, 3, 4];
const sum = myReduce(array1, (acc, curr) => acc + curr, 0);
console.log(sum); // 10

성능 최적화를 위해 메모이제이션을 사용하여 피보나치 함수를 구현하십시오.

설명: 피보나치 수열은 반복적인 계산을 포함합니다. 메모이제이션은 비용이 많이 드는 함수 호출의 결과를 저장하고 동일한 입력이 다시 발생할 때 캐시된 결과를 반환합니다.

function memoizedFib() {
  const cache = {};

  function fib(n) {
    if (n in cache) {
      return cache[n];
    }
    if (n <= 1) {
      return n;
    }
    const result = fib(n - 1) + fib(n - 2);
    cache[n] = result;
    return result;
  }
  return fib;
}

const fibonacci = memoizedFib();
console.log(fibonacci(10)); // 55
console.log(fibonacci(40)); // 102334155 (메모이제이션되지 않은 것보다 훨씬 빠름)

괄호 {}[]()를 포함하는 문자열이 균형 잡혀 있는지 확인하는 함수를 작성하십시오.

설명: 스택을 사용하십시오. 여는 괄호를 만나면 스택에 푸시합니다. 닫는 괄호를 만나면 스택이 비어 있는지 또는 스택의 맨 위 요소가 일치하는 여는 괄호인지 확인합니다. 일치하면 스택을 팝합니다. 그렇지 않거나 스택이 비어 있으면 불균형입니다. 마지막에 스택이 비어 있으면 균형 잡힌 것입니다.

function isBalanced(str) {
  const stack = [];
  const map = { '(': ')', '{': '}', '[': ']' };

  for (let char of str) {
    if (map[char]) {
      stack.push(char);
    } else if (Object.values(map).includes(char)) {
      if (stack.length === 0) return false;
      const lastOpen = stack.pop();
      if (map[lastOpen] !== char) return false;
    }
  }
  return stack.length === 0;
}

console.log(isBalanced('({[]})')); // true
console.log(isBalanced('([)]')); // false

enqueue(뒤에 추가) 및 dequeue(앞에서 제거) 메서드를 사용하여 큐 데이터 구조를 구현하십시오.

설명: 큐는 FIFO(First-In, First-Out) 원칙을 따릅니다. 배열을 사용하여 enqueue에는 push, dequeue에는 shift를 사용할 수 있습니다.

class Queue {
  constructor() {
    this.items = [];
  }

  enqueue(element) {
    this.items.push(element);
  }

  dequeue() {
    if (this.isEmpty()) return 'Underflow';
    return this.items.shift();
  }

  front() {
    if (this.isEmpty()) return 'No elements in Queue';
    return this.items[0];
  }

  isEmpty() {
    return this.items.length === 0;
  }
}

const q = new Queue();
q.enqueue(10);
q.enqueue(20);
console.log(q.dequeue()); // 10
console.log(q.front()); // 20

push(맨 위에 추가) 및 pop(맨 위에서 제거) 메서드를 사용하여 스택 데이터 구조를 구현하십시오.

설명: 스택은 LIFO(Last-In, First-Out) 원칙을 따릅니다. 배열을 사용하여 push 및 pop 메서드를 사용할 수 있습니다.

class Stack {
  constructor() {
    this.items = [];
  }

  push(element) {
    this.items.push(element);
  }

  pop() {
    if (this.isEmpty()) return 'Underflow';
    return this.items.pop();
  }

  peek() {
    return this.items[this.items.length - 1];
  }

  isEmpty() {
    return this.items.length === 0;
  }
}

const s = new Stack();
s.push(10);
s.push(20);
console.log(s.pop()); // 20
console.log(s.peek()); // 10

0, 1, 2, ..., n에서 가져온 n개의 고유한 숫자를 포함하는 배열이 주어졌을 때, 배열에서 누락된 숫자를 찾으십시오.

설명: 0부터 n까지의 숫자의 합은 n*(n+1)/2 공식을 사용하여 계산할 수 있습니다. 배열 요소의 실제 합계를 계산할 수 있습니다. 이 두 합계의 차이가 누락된 숫자가 됩니다.

function findMissingNumber(nums) {
  const n = nums.length;
  const expectedSum = n * (n + 1) / 2;
  const actualSum = nums.reduce((sum, num) => sum + num, 0);
  return expectedSum - actualSum;
}

console.log(findMissingNumber([3, 0, 1])); // 2
console.log(findMissingNumber([9, 6, 4, 2, 3, 5, 7, 0, 1])); // 8

디바운스 함수를 구현하십시오. 디바운싱은 함수가 호출되지 않은 채 특정 시간이 지날 때까지 다시 호출되지 않도록 합니다.

설명: setTimeout과 clearTimeout을 사용하십시오. 디바운스된 함수가 호출될 때마다 이전 타임아웃을 지우고 새 타임아웃을 설정합니다. 실제 함수 호출은 타임아웃이 완료될 때만 발생합니다.

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

// 사용 예시:
const sayHello = () => console.log('Hello!');
const debouncedHello = debounce(sayHello, 1000);
debouncedHello(); // 1초 후 호출 (다시 호출되지 않으면)
debouncedHello(); // 타이머 재설정
debouncedHello(); // 타이머 재설정, 이 호출 후 1초 후에 실제로 실행됩니다.

쓰로틀 함수를 구현하십시오. 쓰로틀링은 함수가 지정된 시간 간격 내에 최대 한 번만 호출되도록 합니다.

설명: 호출이 허용되는지 여부를 나타내는 플래그를 사용하십시오. 호출될 때 허용되면 함수를 실행하고, 플래그를 false로 설정하고, setTimeout을 사용하여 간격 후에 플래그를 재설정합니다.

function throttle(func, limit) {
  let inThrottle = false;
  return function(...args) {
    if (!inThrottle) {
      func.apply(this, args);
      inThrottle = true;
      setTimeout(() => inThrottle = false, limit);
    }
  };
}

// 사용 예시:
const logScroll = () => console.log('Scrolling...');
const throttledScroll = throttle(logScroll, 1000);
// window.addEventListener('scroll', throttledScroll); // 1초에 한 번만 기록됩니다.

두 인수를 받는 함수를 받아 커링된 버전을 반환하는 함수를 작성하십시오.

설명: 커링은 여러 인수를 가진 함수를 각 인수를 하나씩 받는 일련의 함수로 변환합니다. f(a, b)는 f(a)(b)가 됩니다.

function curry(fn) {
  return function(a) {
    return function(b) {
      return fn(a, b);
    };
  };
}

function add(a, b) {
  return a + b;
}

const curriedAdd = curry(add);
const add5 = curriedAdd(5);
console.log(add5(3)); // 8
console.log(curriedAdd(10)(20)); // 30

자바스크립트 객체의 깊은 복사를 수행하는 함수를 작성하십시오.

설명: 얕은 복사는 최상위 속성만 복사합니다. 깊은 복사는 중첩된 객체와 배열을 포함하여 모든 속성을 재귀적으로 복사합니다. 간단한 방법(제한 사항 있음, 예: 함수, 날짜, 정규식 등은 잘 처리하지 못함)은 JSON.parse(JSON.stringify(obj))를 사용하는 것입니다. 재귀적 접근 방식이 더 견고합니다.

function deepClone(obj) {
  // 간단한 버전 (제한 사항 있음)
  try {
      return JSON.parse(JSON.stringify(obj));
  } catch (e) {
      console.error("복사 실패:", e);
      return null;
  }
  
  // 더 견고한 재귀적 (기본 예시):
  /*
  if (obj === null || typeof obj !== 'object') {
      return obj;
  }
  let clone = Array.isArray(obj) ? [] : {};
  for (let key in obj) {
      if (Object.prototype.hasOwnProperty.call(obj, key)) {
          clone[key] = deepClone(obj[key]);
      }
  }
  return clone;
  */
}

const original = { a: 1, b: { c: 2 } };
const cloned = deepClone(original);
cloned.b.c = 3;
console.log(original.b.c); // 2 (깊은 복사임을 증명)
console.log(cloned.b.c); // 3

객체에서 키 배열을 가져오는 방법은 무엇입니까?

설명: Object.keys(obj)를 사용하십시오.

function getKeys(obj) {
  return Object.keys(obj);
}
console.log(getKeys({a: 1, b: 2})); // ['a', 'b']

객체에서 값 배열을 가져오는 방법은 무엇입니까?

설명: Object.values(obj)를 사용하십시오.

function getValues(obj) {
  return Object.values(obj);
}
console.log(getValues({a: 1, b: 2})); // [1, 2]

배열에 특정 값이 포함되어 있는지 확인하는 방법은 무엇입니까?

설명: Array.prototype.includes(value)를 사용하십시오.

function checkIncludes(arr, val) {
  return arr.includes(val);
}
console.log(checkIncludes([1, 2, 3], 2)); // true

두 배열을 하나로 병합하는 방법은 무엇입까?

설명: 스프레드 문법(...) 또는 Array.prototype.concat()을 사용하십시오.

function mergeArrays(arr1, arr2) {
  return [...arr1, ...arr2];
}
console.log(mergeArrays([1, 2], [3, 4])); // [1, 2, 3, 4]

브라우저의 전역 스코프에서 this는 무엇을 참조합니까?

설명: 전역 실행 컨텍스트(어떤 함수 외부)에서 this는 전역 객체를 참조하며, 웹 브라우저에서는 window입니다.

console.log(this === window); // true (브라우저 환경에서)

객체 메서드 내에서 사용될 때 this는 무엇을 참조합니까?

설명: 함수가 객체의 메서드로 호출될 때, this는 메서드가 호출되는 객체를 참조합니다.

const myObject = {
  prop: 'Hello',
  greet() {
    return this.prop;
  }
};
console.log(myObject.greet()); // 'Hello'

화살표 함수는 this를 어떻게 처리합니까?

설명: 화살표 함수는 자체적인 this 컨텍스트를 갖지 않습니다. 대신, 정의된 주변(어휘적) 스코프에서 this를 상속받습니다.

function MyClass() {
  this.value = 42;
  setTimeout(() => {
    console.log(this.value); // 'this'가 상속되므로 42를 로깅합니다.
  }, 100);
}
new MyClass();

let, const, var의 주요 차이점은 무엇입니까?

설명: var는 함수 스코프이며 호이스팅됩니다. let과 const는 블록 스코프이며 호이스팅되지만 선언될 때까지 '시간적 사각지대'에 있습니다. const는 초기화되어야 하며 재할당될 수 없습니다.

function scopeTest() {
  var a = 1;
  let b = 2;
  const c = 3;
  if (true) {
    var a = 10; // 바깥 'a'를 재선언하고 영향을 줍니다.
    let b = 20; // 블록 내의 새로운 'b'
    // const c = 30; // 새로운 'c'가 될 것입니다.
    console.log(a, b, c); // 10, 20, 3
  }
  console.log(a, b, c); // 10, 2, 3
}
scopeTest();

자바스크립트에서 Promise란 무엇인지 설명하십시오.

설명: Promise는 비동기 작업의 최종 완료(또는 실패) 및 그 결과 값을 나타내는 객체입니다. pending, fulfilled, rejected의 세 가지 상태 중 하나에 있을 수 있습니다.

const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('성공!');
    // reject('오류!');
  }, 1000);
});

myPromise
  .then(result => console.log(result))
  .catch(error => console.error(error));

async와 await는 Promise 작업을 어떻게 간소화합니까?

설명: async/await는 Promise에 대한 문법적 설탕을 제공하여 비동기 코드를 동기 코드처럼 보이게 하고 동작하게 합니다. async 함수는 항상 Promise를 반환하고, await는 Promise가 해결될 때까지 실행을 일시 중지합니다.

function delay(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

async function run() {
  console.log('시작 중...');
  await delay(1000);
  console.log('1초 대기했습니다.');
  await delay(500);
  console.log('추가로 0.5초 대기했습니다.');
  return '완료!';
}

run().then(console.log);

문자열을 숫자로 변환하는 방법은 무엇입니까?

설명: parseInt(), parseFloat(), 또는 단항 더하기 연산자(+)를 사용하십시오.

const str = '123.45';
console.log(parseInt(str)); // 123
console.log(parseFloat(str)); // 123.45
console.log(+str); // 123.45

숫자를 문자열로 변환하는 방법은 무엇입까?

설명: String(), number.toString(), 또는 문자열 연결을 사용하십시오.

const num = 123;
console.log(String(num)); // '123'
console.log(num.toString()); // '123'
console.log('' + num); // '123'

JSON.stringify는 무엇을 합니까?

설명: 자바스크립트 객체 또는 값을 JSON 문자열로 변환합니다.

const obj = { name: 'Alice', age: 30 };
const jsonString = JSON.stringify(obj);
console.log(jsonString); // '{"name":"Alice","age":30}'

JSON.parse는 무엇을 합니까?

설명: JSON 문자열을 파싱하여 문자열로 설명된 자바스크립트 값 또는 객체를 구성합니다.

const jsonString = '{"name":"Alice","age":30}';
const obj = JSON.parse(jsonString);
console.log(obj.name); // 'Alice'

배열에서 스프레드 연산자는 어떻게 사용됩니까?

설명: 이터러블(배열과 같은)이 0개 이상의 인수 또는 요소가 예상되는 위치에서 확장될 수 있도록 합니다. 복사, 병합, 요소 추가에 유용합니다.

const arr1 = [1, 2];
const arr2 = [3, 4];
const combined = [...arr1, ...arr2]; // [1, 2, 3, 4]
const copy = [...arr1]; // [1, 2]

객체에서 스프레드 연산자는 어떻게 사용됩니까?

설명: 객체 속성을 복사하고 병합할 수 있도록 합니다.

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };
const merged = { ...obj1, ...obj2 }; // { a: 1, b: 3, c: 4 }
const copy = { ...obj1 }; // { a: 1, b: 2 }

예시와 함께 배열 구조 분해 할당을 설명하십시오.

설명: 배열에서 값을 개별 변수로 풀 수 있게 해주는 구문입니다.

const [a, b] = [10, 20];
console.log(a); // 10
console.log(b); // 20

const [x, , z] = [1, 2, 3];
console.log(z); // 3

예시와 함께 객체 구조 분해 할당을 설명하십시오.

설명: 객체에서 속성을 개별 변수로 풀 수 있게 해줍니다.

const person = { name: 'Bob', age: 25 };
const { name, age } = person;
console.log(name); // 'Bob'
console.log(age); // 25

const { name: personName } = person;
console.log(personName); // 'Bob'

Function.prototype.call의 기본 버전을 어떻게 구현할 수 있습니까?

설명: call은 지정된 this 값과 개별적으로 제공된 인수로 함수를 호출합니다. 함수를 this 컨텍스트에 첨부하고, 호출한 다음, 제거할 수 있습니다.

Function.prototype.myCall = function(context, ...args) {
  context = context || window;
  const uniqueId = Symbol(); // 고유 키 사용
  context[uniqueId] = this;
  const result = context[uniqueId](...args);
  delete context[uniqueId];
  return result;
}

function greet(greeting, punctuation) {
  console.log(`${greeting}, ${this.name}${punctuation}`);
}

greet.myCall({ name: 'Charlie' }, 'Hi', '!'); // Hi, Charlie!

Function.prototype.apply의 기본 버전을 어떻게 구현할 수 있습니까?

설명: apply는 call과 유사하지만, 인수를 배열로 받습니다.

Function.prototype.myApply = function(context, argsArray) {
  context = context || window;
  const uniqueId = Symbol();
  context[uniqueId] = this;
  const result = context[uniqueId](...(argsArray || []));
  delete context[uniqueId];
  return result;
}

function greet(greeting, punctuation) {
  console.log(`${greeting}, ${this.name}${punctuation}`);
}

greet.myApply({ name: 'David' }, ['Hello', '.']); // Hello, David.

JavaScript 이벤트 루프를 간략하게 설명하세요.

설명: JavaScript는 단일 스레드이지만, 이벤트 루프를 사용하여 동시성을 달성합니다. 호출 스택은 동기 코드를 처리합니다. Web API는 비동기 작업(예: setTimeout, fetch)을 처리합니다. 비동기 작업이 완료되면 해당 콜백은 콜백 큐(또는 Promise의 경우 마이크로태스크 큐)로 이동합니다. 이벤트 루프는 호출 스택이 비어 있는지 지속적으로 확인하며, 비어 있으면 큐에서 다음 콜백을 스택으로 이동하여 실행합니다.

console.log('Start');

setTimeout(() => {
  console.log('Timeout Callback'); // 콜백 큐로 이동
}, 0);

Promise.resolve().then(() => {
  console.log('Promise Resolved'); // 마이크로태스크 큐로 이동
});

console.log('End');

// 출력 순서: Start, End, Promise Resolved, Timeout Callback
// (마이크로태스크는 매크로태스크/콜백보다 먼저 실행됩니다)

정렬된 배열에 대한 이진 탐색 함수를 구현하세요.

설명: 이진 탐색은 탐색 간격을 반복적으로 절반으로 나누어 정렬된 배열에서 항목을 효율적으로 찾습니다. 탐색 키의 값이 간격 중간의 항목보다 작으면 간격을 아래쪽 절반으로 좁힙니다. 그렇지 않으면 위쪽 절반으로 좁힙니다. 값이 찾아지거나 간격이 비워질 때까지 이 작업을 수행합니다.

function binarySearch(sortedArray, key) {
  let start = 0;
  let end = sortedArray.length - 1;

  while (start <= end) {
    let middle = Math.floor((start + end) / 2);

    if (sortedArray[middle] === key) {
      return middle; // 찾음
    } else if (sortedArray[middle] < key) {
      start = middle + 1; // 오른쪽 절반 탐색
    } else {
      end = middle - 1; // 왼쪽 절반 탐색
    }
  }
  return -1; // 찾지 못함
}

console.log(binarySearch([1, 3, 5, 7, 9, 11], 7)); // 3
console.log(binarySearch([1, 3, 5, 7, 9, 11], 2)); // -1

병합 정렬 알고리즘을 구현하세요.

설명: 병합 정렬은 분할 정복 알고리즘입니다. 입력 배열을 두 개의 절반으로 나누고, 두 절반에 대해 자신을 호출한 다음, 두 정렬된 절반을 병합합니다. 병합 함수는 두 개의 정렬된 하위 배열을 하나의 정렬된 배열로 결합하는 데 중요합니다.

function mergeSort(arr) {
  if (arr.length <= 1) return arr;

  const mid = Math.floor(arr.length / 2);
  const left = mergeSort(arr.slice(0, mid));
  const right = mergeSort(arr.slice(mid));

  return merge(left, right);
}

function merge(left, right) {
  let result = [];
  let leftIndex = 0;
  let rightIndex = 0;

  while (leftIndex < left.length && rightIndex < right.length) {
    if (left[leftIndex] < right[rightIndex]) {
      result.push(left[leftIndex]);
      leftIndex++;
    } else {
      result.push(right[rightIndex]);
      rightIndex++;
    }
  }

  return result.concat(left.slice(leftIndex)).concat(right.slice(rightIndex));
}

console.log(mergeSort([38, 27, 43, 3, 9, 82, 10])); // [3, 9, 10, 27, 38, 43, 82]

퀵 정렬 알고리즘을 구현하세요.

설명: 퀵 정렬 또한 분할 정복 알고리즘입니다. 피벗으로 요소를 선택하고, 선택된 피벗을 중심으로 주어진 배열을 분할합니다. 피벗보다 작은 요소는 왼쪽으로, 큰 요소는 오른쪽으로 이동합니다. 그런 다음 재귀적으로 하위 배열을 정렬합니다.

function quickSort(arr) {
  if (arr.length <= 1) return arr;

  const pivot = arr[arr.length - 1];
  const left = [];
  const right = [];

  for (let i = 0; i < arr.length - 1; i++) {
    if (arr[i] < pivot) {
      left.push(arr[i]);
    } else {
      right.push(arr[i]);
    }
  }

  return [...quickSort(left), pivot, ...quickSort(right)];
}

console.log(quickSort([10, 8, 2, 1, 6, 3, 9, 4, 7, 5])); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

버블 정렬 알고리즘을 구현하세요.

설명: 버블 정렬은 인접한 요소를 비교하고 잘못된 순서인 경우 교환하는 작업을 반복적으로 수행하는 간단한 정렬 알고리즘입니다. 목록을 정렬할 때까지 목록을 통한 통과가 반복됩니다.

function bubbleSort(arr) {
  let n = arr.length;
  let swapped;
  do {
    swapped = false;
    for (let i = 0; i < n - 1; i++) {
      if (arr[i] > arr[i + 1]) {
        [arr[i], arr[i + 1]] = [arr[i + 1], arr[i]]; // 교환
        swapped = true;
      }
    }
    n--; // 최적화: 마지막 요소는 이미 제자리에 있습니다
  } while (swapped);
  return arr;
}

console.log(bubbleSort([64, 34, 25, 12, 22, 11, 90])); // [11, 12, 22, 25, 34, 64, 90]

문자열이 주어지면 반복되지 않는 가장 긴 부분 문자열의 길이를 찾으세요.

설명: 슬라이딩 윈도우 기술을 사용하세요. 윈도우(부분 문자열)와 해당 윈도우에 있는 문자 집합을 유지하세요. 오른쪽 포인터를 이동하여 윈도우를 확장하세요. 반복되는 문자가 발견되면 반복되는 문자가 제거될 때까지 왼쪽에서 윈도우를 축소하세요.

function lengthOfLongestSubstring(s) {
  let maxLength = 0;
  let start = 0;
  const charMap = {};

  for (let end = 0; end < s.length; end++) {
    const char = s[end];
    if (charMap[char] >= start) {
        start = charMap[char] + 1;
    }
    charMap[char] = end;
    maxLength = Math.max(maxLength, end - start + 1);
  }
  return maxLength;
}

console.log(lengthOfLongestSubstring('abcabcbb')); // 3 ('abc')
console.log(lengthOfLongestSubstring('bbbbb')); // 1 ('b')
console.log(lengthOfLongestSubstring('pwwkew')); // 3 ('wke')

add 및 print 메서드가 있는 단일 연결 리스트를 구현하세요.

설명: 연결 리스트는 요소가 연속된 메모리 위치에 저장되지 않는 선형 데이터 구조입니다. 각 요소(노드)는 다음 요소를 가리킵니다. 헤드를 관리하고 새 노드를 추가하려면 Node 클래스와 LinkedList 클래스가 필요합니다.

class Node {
  constructor(data, next = null) {
    this.data = data;
    this.next = next;
  }
}

class LinkedList {
  constructor() {
    this.head = null;
  }

  add(data) {
    const newNode = new Node(data);
    if (!this.head) {
      this.head = newNode;
    } else {
      let current = this.head;
      while (current.next) {
        current = current.next;
      }
      current.next = newNode;
    }
  }

  print() {
    let current = this.head;
    let list = '';
    while (current) {
      list += current.data + ' -> ';
      current = current.next;
    }
    console.log(list + 'null');
  }
}

const list = new LinkedList();
list.add(10);
list.add(20);
list.add(30);
list.print(); // 10 -> 20 -> 30 -> null

insert 및 find 메서드가 있는 이진 탐색 트리를 구현하세요.

설명: BST는 다음 속성을 가진 노드 기반 이진 트리 데이터 구조입니다. 노드의 왼쪽 하위 트리는 노드의 키보다 작은 키를 가진 노드만 포함합니다. 노드의 오른쪽 하위 트리는 노드의 키보다 큰 키를 가진 노드만 포함합니다. 두 하위 트리 모두 이진 탐색 트리여야 합니다.

class Node {
  constructor(data) {
    this.data = data;
    this.left = null;
    this.right = null;
  }
}

class BST {
  constructor() {
    this.root = null;
  }

  insert(data) {
    const newNode = new Node(data);
    if (!this.root) {
      this.root = newNode;
      return;
    }
    this._insertNode(this.root, newNode);
  }

  _insertNode(node, newNode) {
    if (newNode.data < node.data) {
      if (!node.left) node.left = newNode;
      else this._insertNode(node.left, newNode);
    } else {
      if (!node.right) node.right = newNode;
      else this._insertNode(node.right, newNode);
    }
  }

  find(data) {
    return this._findNode(this.root, data);
  }

  _findNode(node, data) {
    if (!node) return null;
    if (data < node.data) return this._findNode(node.left, data);
    else if (data > node.data) return this._findNode(node.right, data);
    else return node;
  }
}

const bst = new BST();
bst.insert(10);
bst.insert(5);
bst.insert(15);
bst.insert(7);
console.log(bst.find(7)); // Node { data: 7, left: null, right: null }
console.log(bst.find(12)); // null

배열을 k 단계만큼 오른쪽으로 회전시키는 함수를 작성하세요.

설명: 배열을 회전시킨다는 것은 요소를 이동시키는 것을 의미합니다. 오른쪽 회전의 경우 마지막 요소가 첫 번째 요소가 됩니다. 이 작업을 k번 반복하는 것은 비효율적입니다. 더 나은 방법은 배열 조작을 사용하거나 새 위치를 계산하는 것입니다.

function rotateArray(nums, k) {
  k = k % nums.length; // k > length인 경우 처리
  if (k === 0) return nums;

  const partToMove = nums.splice(nums.length - k);
  nums.unshift(...partToMove);
  return nums;
}

console.log(rotateArray([1, 2, 3, 4, 5, 6, 7], 3)); // [5, 6, 7, 1, 2, 3, 4]

두 배열이 주어지면 두 배열의 교집합(두 배열에 공통으로 있는 요소)을 계산하는 함수를 작성하세요.

설명: 한 배열을 Set으로 변환하여 평균 시간 O(1) 조회 속도를 얻는 것이 좋습니다. 그런 다음 두 번째 배열을 반복하고 각 요소가 Set에 있는지 확인합니다. 일치하는 요소를 수집합니다.

function intersection(nums1, nums2) {
  const set1 = new Set(nums1);
  const resultSet = new Set();

  for (const num of nums2) {
    if (set1.has(num)) {
      resultSet.add(num);
    }
  }

  return [...resultSet];
}

console.log(intersection([1, 2, 2, 1], [2, 2])); // [2]
console.log(intersection([4, 9, 5], [9, 4, 9, 8, 4])); // [9, 4]

문자열 배열이 주어지면 아나그램을 함께 그룹화하세요.

설명: 핵심은 각 아나그램 그룹에 대한 고유한 서명을 찾는 것입니다. 일반적인 방법은 각 단어를 알파벳순으로 정렬하는 것입니다. 동일하게 정렬된 문자열이 되는 단어는 아나그램입니다. 키는 정렬된 단어이고 값은 원본 단어의 배열인 해시 맵을 사용하세요.

function groupAnagrams(strs) {
  const map = {};
  for (const str of strs) {
    const sortedStr = str.split('').sort().join('');
    if (!map[sortedStr]) {
      map[sortedStr] = [];
    }
    map[sortedStr].push(str);
  }
  return Object.values(map);
}

console.log(groupAnagrams(['eat', 'tea', 'tan', 'ate', 'nat', 'bat'])); 
// 출력: [['eat', 'tea', 'ate'], ['tan', 'nat'], ['bat']]

nums 배열이 주어지면, 0이 아닌 요소의 상대적인 순서를 유지하면서 모든 0을 끝으로 이동시키는 함수를 작성하세요.

설명: '두 포인터' 또는 '스노우볼' 접근 방식을 사용하세요. 한 포인터는 다음 0이 아닌 요소가 들어갈 위치를 추적합니다. 배열을 반복하여 요소가 0이 아니면 포인터 위치에 놓고 포인터를 증가시킵니다. 마지막으로 나머지를 0으로 채웁니다.

function moveZeroes(nums) {
  let nonZeroIndex = 0;

  // 모든 0이 아닌 요소를 앞으로 이동
  for (let i = 0; i < nums.length; i++) {
    if (nums[i] !== 0) {
      nums[nonZeroIndex] = nums[i];
      nonZeroIndex++;
    }
  }

  // 나머지를 0으로 채움
  for (let i = nonZeroIndex; i < nums.length; i++) {
    nums[i] = 0;
  }

  return nums;
}

console.log(moveZeroes([0, 1, 0, 3, 12])); // [1, 3, 12, 0, 0]

정수 배열 nums가 주어지면, 가장 큰 합을 가지는 연속적인 부분 배열(최소 하나의 숫자를 포함)을 찾아 그 합을 반환하세요.

설명: Kadane의 알고리즘은 이 문제를 해결하는 효율적인 방법입니다. 배열을 반복하면서 현재 위치에서 끝나는 currentMax 합과 지금까지 찾은 globalMax 합을 추적합니다. currentMax가 음수가 되면 0으로 재설정합니다(또는 현재 요소로).

function maxSubArray(nums) {
  let globalMax = -Infinity;
  let currentMax = 0;

  for (let i = 0; i < nums.length; i++) {
    currentMax = Math.max(nums[i], currentMax + nums[i]);
    if (currentMax > globalMax) {
      globalMax = currentMax;
    }
  }
  return globalMax;
}

console.log(maxSubArray([-2, 1, -3, 4, -1, 2, 1, -5, 4])); // 6 (from [4, -1, 2, 1])