TIL 24.10.25

윤지·2024년 10월 25일
post-thumbnail

📚 TIL

호이스팅과 컨텍스트

💡 추가 학습 내용

자주 사용되는 메서드 리스트

  • reduce(): 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환함 (누산메서드, 누적메서드)
    • 예시코드
      // 배열의 모든 요소 합계 구하기
      const numbers = [1, 2, 3, 4, 5];
      const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
      console.log(sum); // 출력: 15
      
      // 객체 배열에서 특정 속성의 합계 구하기
      const items = [
        { name: 'Apple', price: 0.5 },
        { name: 'Banana', price: 0.3 },
        { name: 'Orange', price: 0.6 }
      ];
      const totalPrice = items.reduce((total, item) => total + item.price, 0);
      console.log(totalPrice); // 출력: 1.4
  • replace(): 문자열에서 특정 패턴을 다른 문자열로 대체함
    • 예시코드
      // 문자열에서 첫 번째로 발견되는 패턴만 대체
      const str = "Hello, World!";
      const newStr = str.replace("o", "0");
      console.log(newStr); // 출력: "Hell0, World!"
      
      // 정규표현식을 사용하여 모든 패턴 대체
      const str2 = "Hello, World!";
      const newStr2 = str2.replace(/o/g, "0");
      console.log(newStr2); // 출력: "Hell0, W0rld!"
  • includes(): 배열이나 문자열에 특정 요소나 부분 문자열이 포함되어 있는지 확인함
    • 예시 코드
      // 배열에 특정 요소가 포함되어 있는지 확인
      const arr = [1, 2, 3, 4, 5];
      const num = 3;
      
      if (arr.includes(num)) {
        console.log(`${num}은 배열에 포함되어 있음`);
      } else {
        console.log(`${num}은 배열에 포함되어 있지 않음`);
      }
      
      // 문자열에 특정 부분 문자열이 포함되어 있는지 확인
      const str = "Hello, World!";
      const sub = "World";
      
      if (str.includes(sub)) {
        console.log(`"${sub}"는 문자열에 포함되어 있음`);
      } else {
        console.log(`"${sub}"는 문자열에 포함되어 있지 않음`);
      }
  • length: 문자열의 길이를 반환함
  • toLowerCase(): 문자열을 소문자로 변환함
  • toUpperCase(): 문자열을 대문자로 변환함
  • trim(): 문자열의 앞뒤 공백을 제거함
  • split(): 문자열을 특정 구분자로 나누어 배열로 반환함
  • replaceAll(): 문자열 내의 모든 일치하는 부분을 새로운 문자열로 교체함
    • 예시코드
      "hello world".replaceAll("o","") //o를 찾아서 없앰
      //출력 hell wrld
  • reverse(): 배열이나 문자열의 순서를 반대로 뒤집음
    • 예시코드
      // 배열 뒤집기 예제
      const arr = [1, 2, 3, 4, 5];
      const reversed = arr.reverse();
      
      console.log(reversed);
      // 출력: [5, 4, 3, 2, 1]
      
      // 문자열 뒤집기 예제
      const str = "Hello, World!";
      const reversed = str.split('').reverse().join('');
      
      console.log(reversed);
      // 출력: "!dlroW ,olleH"
      배열의 경우 reverse() 메서드를 직접 사용할 수 있지만, 문자열의 경우 배열로 변환 후 뒤집고 다시 문자열로 결합하는 과정이 필요함

유클리드 호제법

유클리드 호제법: 최대공약수(GCD) 구하는 알고리즘.

두 수 a와 b의 최대공약수는 b가 0이 될 때까지 a를 b로 나눈 나머지 반복 계산하여 구함

function gcd(a, b) {
  if (b === 0) return a;
  return gcd(b, a % b);
}

// console.log(gcd(56, 98)); // 14

버블정렬

버블 정렬: 인접한 두 요소를 비교하여 더 큰 값을 오른쪽으로 이동시키는 간단한 정렬 알고리즘.

배열이 완전히 정렬될 때까지 이 과정 반복

// 버블 정렬
function bubbleSort(numArr) {
  for (let i = 0; i < numArr.length; i++) {
    for (let j = 0; j < numArr.length - 1 - i; j++) {
      // console.log(numArr[j], numArr[j + 1]);
      if (numArr[j] > numArr[j + 1]) {
        // 자리 바꿔줘야 함
        // swap 로직
        const temp = numArr[j];
        numArr[j] = numArr[j + 1];
        numArr[j + 1] = temp;
      }
    }
  }
  return numArr;
}
console.log(bubbleSort([5, 4, 8, 10, 2]));
// console.log(bubbleSort([5, 3, 8, 1, 2])); // [1, 2, 3, 5, 8]

주요 알고리즘 분류

  • 정렬: 퀵 정렬, 병합 정렬, 버블 정렬, 삽입 정렬, 선택 정렬
  • 탐색: 이진 탐색, 깊이 우선 탐색(DFS), 너비 우선 탐색(BFS)
  • 그래프: 다익스트라, 플로이드-워셜, 크루스칼, 프림
  • 동적 프로그래밍: 피보나치 수열, 배낭 문제, 최장 공통 부분 수열(LCS)
  • 문자열: KMP, 라빈-카프
  • 기타: 유클리드 호제법(GCD), 에라토스테네스의 체(소수 찾기)

💬 마치며

오늘은 연습문제 위주로 풀고 마지막에 호이스팅과 컨텍스트에 대해 배웠다. 이전에 자바스크립트를 배웠을 때는 단순히 "끌어올리는 것" 정도로만 이해하고 있었는데 전체적인 동작 원리를 알게 되었다

호이스팅은 단순히 끌어올리는 것이 아니라, 자바스크립트의 동작 특성상 함수와 변수가 메모리에 먼저 저장되는 과정이라는 것을 이해할 수 있었다.

그리고 var로 선언된 변수는 호이스팅 시 초기값이 undefined가 되고, let과 const로 선언된 변수는 단순히 선언만 된 상태로 초기화 전까지는 접근할 수 없도록 동작한다는 것도 알게 됐다.

예전에는 "var와 let, const의 차이가 뭐예요?"라는 질문에 단순히 "호이스팅"이라고만 대답할 수 있었는데, 이제는 그 빈 공간을 채울 수 있는 지식을 얻은 것 같다 👍

그리고 최대공약수를 유클리드 호제법으로 직접 풀지는 못했지만, 강사님의 풀이를 통해 이해할 수 있었다. 최대공약수를 이용해 최소공배수를 구하는 방법도 배웠고, "최대공약수 × 최소공배수 = a × b"라는 공식도 알게 되었다. 문제 풀 때 써먹어 보고 싶다 나오려나? 🤔

profile
프론트엔드 공부 기록 아카이빙🍁

0개의 댓글