어떠한 것을 정의할 때 자기 자신을 참조하는 것을 뜻한다. 즉, 자기 자신을 호출하는 절차

1. 재귀가 쓰이는 곳

1. 재귀는 큰 목표 작업 하나를 동일하면서 간단한 작업 여러 개로 나눌 수 있을 때
2. javascript 내부에서는?

• JSON.parse / JSON.stringify
• document.getElementById, querySelector and DOM 탐색 알고리즘(*DOM은 요소가 중첩된 트리 구조)

3. 객체 순회
4. 복잡한 데이터 구조 (데이터 구조, 트리, 그래프)를 순회, 그 안에 있는 요소 검색 하는 경우

✋ 잠깐! 재귀를 이해하려면 Call Stack에 대해 알아야함

• JavaScript는 단일 스레드 프로그래밍 언어이므로, 단일 호출 스택이 존재. =>한 번에 하나의 일(Task)만 처리할 수 있다
• 함수를 실행하면 해당 함수의 기록을 스택 맨 위에 추가(Push) , 함수를 결과 값을 반환(함수가 종료)하면 스택에 쌓여있던 함수는 제거(Pop)되며 동작한다.

** 지금은 간단히 기록, 따로 콜스텍과 자바스크립트 엔진이 돌아가는 원리에 대해서 정리해 볼 예정이다!!!**

2. 재귀 함수 (Recursion Function)

동일한 함수를 계속 호출하면서 하나의 함수가 자신을 재귀적으로 호출 (중단 포인트를 만날 때 까지 같은 함수를 계속 호출)

 * 중단 조건 필수 -> stack overflow 현상이 일어남

 * 매번 다른 input을 통해 호출되어야한다.

2-1. 재귀 함수의 잠재적 위험성을 초래하는 문제점

*1. 종료 조건이 없거나 잘못 되는 경우 *

• 함수가 종료되지 않고 stack overflow로 종료됨 (엔진마다 호출 스택 크기가 정해져 있기 때문에)

  return 으로 확실한 break point(base case)를 설정해줘야 한다.

** 2. 값을 반환하는 걸 잊는 것 **

• call stack의 경우 모든 항목이 서로에게 의존적이며 연결되어 있다 마지막에는 어떤 값을 도출해서 그 값을 돌려보내야 한다

3. 잘못된 값을 반환 하는 것

💻 예제1

num까지의 합을 리턴하는 함수 sumRange를 작성하시오

const sumRange = (num) => {
  if (num === 1) return 1; //base case (중단 조건)
  return num + sumRange(num - 1); // 재귀호출 : 매번 더 작은 값으로 input 값을 받음
};

💡 예제1 실행순서

실행순서 3 >> return 3 + sumRange(2) 실행순서 2 >> ................... return 2 + sumRange(1) 실행순서 1 >> ............................................ return 1

call stack의 상단의 연산부터 시작해 sumRage(1)의 리턴값 (재귀 종료)인 1부터 순서대로 ((1) + 2)+ 3 순서대로 sum 후 리턴

💻 예제2

Factorial 구하는 함수

팩토리얼 = 계승 : 1부터 n까지의 자연수를 모두 곱하는 것

** 풀어보기 전 **

1. num이 1이 되면 멈춘다 (0이되면 어떤 수든 리턴 값이 0이 됨)
2. 숫자를 1씩 줄여가면서 재귀 함수 호출 * 인자로 받은 num 곱해줌 => num이 1이 될 때 까지 재귀 호출

const getFactorial = (num) => {
  if (num === 1) return 1;
  return num * getFactorial(num - 1);
};

3. Helper Method Function

재귀적이지 않은 외부 함수가 재귀적인 내부 함수(inner function)을 호출하는 패턴이다. 문제 해결을 위한 하나의 접근법이다.

1. 헬퍼 함수 혹은 헬퍼 메소드 재귀라고 부른다.
2. 메인 외부 함수를 개발자가 외부에서 호출한다.
3. 이 외부 함수를 호출할 때 인자를 내부로 전달해 줄 수 있다.
4. 이 외부 함수 내부에는 또 다른 내부 함수가 정의되어 있다. 내부함수는 호출되고 재귀적으로 자기자신을 호출한다.
5. 결과를 컴파일할 때 흔히 사용 결과는 배열과 다른 형태의 데이터 구조이다.

기본형태

const outer = (input) => {
  const outerScopedVar = []; // array or list of data

  const helper = (helperInput) => {
    //outerScopedVar 변경
    helper(helperInput--); // 인풋 값 감소
  };

  helper(input);

  return outerScopedVar;
};

💻 사용 예

어느 배열에서 홀수 값을 구하는 것 같은 작업

const collectOddValues = (arr) => {
  const result = [];

  const helper = (helperInput) => {
    if (helperInput.length === 0) return;

    if (helperInput[0] % 2 !== 0) result.push(helperInput[0]);

    helper(helperInput.slice(1));
  };

  helper(arr);

  return result;
};



//재귀 함수를 내부 호출히서 쓰는 위의 패턴이 아닌 재귀만 사용해서 풀이

const collectOddValues2 = (arr) => {
  let newArr = []; // 내부에 요소를 추가해주는 게 아닌 배열을 합쳐서 새 배열을 할당해야 하므로 let으로 선언

  if (arr.length === 0) return newArr;

  if (arr[0] % 2 !== 0) {
    newArr.push(arr[0]);
  }
  console.log(newArr);
  newArr = newArr.concat(collectOddValues2(arr.slice(1)));

  return newArr;
};

collectOddValues2([1,2,3,4,5]) 재귀 동작 방식

실행완료순서6 >> [1].concat(collectOddValues2([2,3,4,5])) 실행완료순서5 >> ...... [].concat(collectOddValues2([3,4,5])) 실행완료순서4 >> ............ [3].concat(collectOddValues2([4,5])) 실행완료순서3 >> .................. [].concat(collectOddValues2([5])) 실행완료순서2 >> ........................ [5].concat(collectOddValues2([])) 실행완료순서1 >> ................................ []

3. 순수하게 재귀 함수만 사용하여 구성할 때 사용하는 Method

자료형에 맞게 복사본을 만들어 진행 => 변경 할 필요 없음 , 결과를 축적할 수 있음

1. array : array.slice(), spread operator , array.concat()와 같은 배열을 복사하는 메서드를 사용

2. String : immutable(변경할 수 없음)하기에 slice, substr, substring 같은 메서드를 통해 문자열의 사본을 만들어 진행

3. Object : Object.assign , spread operator를 이용해 복사본 만들어 사용

ReactNative로 날씨 어플 만들기.. ReactNative로 만들어 보고 싶은 어플이 있기 때문에 처음부터 차근차근 배워보고자 시작했다.

인강은 with 니꼬쌤!😎

개발 플랫폼 : Expo-CLI third party : Expo SDK 51 사용

//package.json
   "dependencies": {
    "expo": "~51.0.28",
    "expo-status-bar": "~1.12.1",
    "react": "18.2.0",
    "react-native": "0.74.5",
    "expo-location": "~17.0.1"
  },

🤢 맞닥뜨린 문제

import { useEffect, useState } from 'react';
import * as Location from 'expo-location';

export default function App() {
  const [location, setLocation] = useState(null);
  const [city, setCity] = useState('...loading');
  const [placeId, setPlaceID] = useState(null);
  const [ok, setOk] = useState(false);

    const { status } = await Location.requestForegroundPermissionsAsync();

    if (status !== 'granted') {
      return;
    }

    setOk((prev) => !prev);

    const {
      coords: { latitude, longitude },
    } = await Location.getCurrentPositionAsync({ accuracy: 5 });

    setLocation({ latitude, longitude });

//...코드는 일부만 가져옴

• 현재 기기의 위치를 갖고 오기 위해 Location.requestForegroundPermissionsAsync() 을 사용해서 권한을 먼저 요청 후 Location.getCurrentPositionAsync()을 이용해 현재 기기 기준의 위치값을 가져와 필요한 위도(latitude) 경도(longitude) 값을 불러온다.
  • accuracy 옵션 (1~6까지의 수치로 설정 가능)을 이용해 위치정확성을 조절할 수 있다.

• 그리고 그 위도와 경도 값을 Location.reverseGeocodeAsync() 이용 해 지역명(주소지)을 아래와 같이 가져오려 했다.

const response = await Location.reverseGeocodeAsync({location.latitude,location.longitude},{useGoogleMaps:false});

옵션을 사용하지 않는다 했음에도 불러와지지 않는 오류.. 이거 나의 문제일까..?

그래서 다시 찾아봤다.

Location.reverseGeocodeAsync()

Geocoding web api를 더 이상 지원하지 않는단다;; 좀 제대로 읽어볼 걸.. Place Autocomplete를 대신 쓰라는데 일단 들어가봄

Place Autocomplete 서비스는 장소를 반환하는 웹 서비스입니다. HTTP 요청에 대한 응답으로 요청은 검색 문자열과 선택적 지리적 경계가 있습니다. 이 서비스는 텍스트 기반 지역 검색을 위한 자동 완성 기능을 제공합니다. 업체, 주소 및 관심 장소 같은 장소를 확인할 수 있다.

꼭 필요한 파라미터 값이 input -> 텍스트 스트링을 받는다. 그런데 우리는 받아 넘길 값이 위도 경도 숫자다.

물론 Place API를 활용할 일이 있어 보인다. 매우 유용해 보인다. 장소 세부 정보 및 상소 사진, 주변 지역도 검색 가능하고, 후에 해당 API를 활용할 토이플젝도 해보고 싶다. (딱 기다려..)

아무튼 그래서 찾은게 역지오코딩(Reverse geocoding) 가보자고.

요약하자면 사람이 읽을 수 있는 지도 주소로 변환해 준다. 필요한 파라미터도 latlng, key

내가 원하던거다..!

🌏 역지오코딩(Reverse geocoding) 써보자

1. 키 발급

역지오코딩(Reverse geocoding) 공식문서 링크

공식 문서 링크로 들어가면 상단에 시작하기 버튼 눌러 들어가 api를 발급하자 그래야지 key 파라미터로 전달해 api를 호출할 수 있다.

2. 써보자

1) 요청 base Url

//json형태 응답
https://maps.googleapis.com/maps/api/geocode/json

//xml형태 응답
https://maps.googleapis.com/maps/api/geocode/xml

2) parameters

필수 옵션

• latlng :위도 및 경도 가장 가까운 위치를 지정하는 좌표

  ex)latlng=위도(latitude),경도(longitude) 
          ->  `,`(콤마)로 구분

• key : 발급받은 내 key

선택적 옵션

• language : 결과 반환 언어 지원되는 언어 참고! 한국 - ko 영어 - en

• region : ccTLD로 지정된 지역 코드

  ccTLD...? 뭔데..?

  국제적으로 나라 또는 특정 지역 그리고 국제 단체 등을 나타내는 인터넷의 도메인 이름에 배당한 고유 부호

  feat.위키피디아 코드가 궁금하다면 클릭

• result_type : 하나 이상의 주소 유형 필터입니다. 파이프 (|)로 구분 ->검색 후 필터 역할 (아니면 전부 다 불러와서 쓸데없이 불러 오는 데이터의 크기가 커진다..)

  • street_address 는 정확한 상세 주소를 나타냅니다.

  • route 는 이름이 지정된 경로(예: 'US 101')

  • intersection은 일반적으로 두 주요 도로의 주요 교차로

  • political은 정치적 독립체

  • country는 전국적인 정치적 독립체를 나타내고 일반적으로 지오코더에서 반환하는 순위가 가장 높은 유형

  • administrative_area_level_1은 국가 수준 아래 첫 번째 행정 독립체를 나타냅니다. 미국에서 이 행정 구역 수준은 주입니다. 모든 국가에 이러한 행정 구역 수준이 표시되지는 않습니다. 대부분의 경우 거의 일치하지만 지오코딩 결과는 다양한 신호와 위치 데이터를 기반으로 하기 때문에 이러한 일치가 보장되지는 않음

    • level은 administrative_area_level_1~administrative_area_level_7까지 있음 자세한 부분은 공식 문서 참고

  • colloquial_area는 일반적으로 사용되는 독립체의 대체 이름을 나타냅니다.

  • locality는 도시 또는 마을로 통합된 정치적 독립체를 나타냅니다. sublocality는 지역 아래 첫 번째 행정 독립체를 나타냅니다.

** 그 외에도 값이 많으니 필요한건 공식문서를 참고!**

3) 코드 수정

불러오는 응답 값의 구조를 보면 (값은 보기 편하게 삭제했다) 원하는 데이터는 results에 담기며 그 배열의 첫 번째 요소인 address_components의 첫 번째 요소 long_name이 내가 원하는 값이다

{
    "plus_code": {
        "compound_code",
        "global_code"
    },
    "results": [
        {
            "address_components": [
                {
                    "long_name",
                    "short_name",
                    "types": []
                },
                {
                    "long_name" ,
                    "short_name",
                    "types": []
                }
            ],
            "formatted_address",
            "geometry",
            "place_id",
            "types": []
        }
    ],
    "status"
}

코드 추가

import { useEffect, useState } from 'react';
import * as Location from 'expo-location';

export default function App() {
  const [location, setLocation] = useState(null);
  const [city, setCity] = useState('...loading');
  const [placeId, setPlaceID] = useState(null);
  const [ok, setOk] = useState(false);

  const { status } = await Location.requestForegroundPermissionsAsync();

  if (status !== 'granted') {
    return;
  }

  setOk((prev) => !prev);

  const {
    coords: { latitude, longitude },
  } = await Location.getCurrentPositionAsync({ accuracy: 5 });

  setLocation({ latitude, longitude });

  //추가

  try {
        const response = await fetch(
      `https://maps.googleapis.com/maps/api/geocode/json?latlng=${latitude},${longitude}&key=${process.env.EXPO_PUBLIC_GOOGLE_MAP_API}&result_type=administrative_area_level_1&language=en`);
     const { results } = await response.json();
     setPlaceID(results[0].place_id);
     setCity(results[0].address_components[0]?.long_name);

  } catch (error) {
     console.error(error);
  }

... 아래 코드 생략

추가

1) Expo 에서 환경변수 사용 방법 root 경로에 .env 파일 생성 후 EXPO_PUBLIC_[NAME]=VALUE 형태로 생성 후 아래 변수 형태로 불러와 서 쓰면 된다.

process.env.EXPO_PUBLIC_MY_API

부족한 내용이 있을 수 있으니 더 살펴보고 첨삭해야지...!

1. 10진수(decimal number)

• 일반적인 진법 체계
• 한 자리 숫자는 10가지(0~9) 존재
• 자릿수가 올라갈 때마다 $$10^n$$을 곱함

2. 2진수(bunary number)

• 0과 1의 두 가지 숫자로 수를 표현
• 자릿수가 올라갈 때마다 $$2^n$$을 곱함

3. 8진수(octal number)

• 한 자리 숫자 8가지(0~7) 존재
• 자릿수가 올라갈 때마다 $$8^n$$을 곱함

4. 16진수(hexadecimal number)

• 한 자리 숫자 09 (10가지 숫자)와 알파벳 AF 총 16개의 존재
• 자릿수가 올라갈 때마다 $$16^n$$을 곱함
• 표기가 사용되는 예 1) 색상표현 (RGB) 2) 컴퓨터 하드웨어 주소 3) 메모리에 저장 된 값
• C언어에서는 prefix를 붙여 표현 : 0x ex) 0xf 16진수 F -> (2진수 : 1111 , 10진수 : 15) 0x3f 16진수 3F -> 2진수: 111111, 10진수:(3*16+15)

5. 2진수,16진수 변환

• 4bit는 16진수 한 자리 숫자
• 16진수는 09, AF 까지 한 자리에 씀

1. 데이터셋을 작은 부분으로 나누고 데이터의 하위집합으로 프로세스를 반복
2. 시간복잡도를 크게 줄일 수 있다
3. 퀵 정렬, 병합 정렬, 이진 탐색

💻 예제 1

정렬된 숫자 배열과 검색하려는 숫자를 인자로 받아 해당 위치의 인덱스를 반환하는 함수 search를 작성하시오 (단, 값이 없을 경우 -1을 리턴한다)

  search([1,2,3,4,5,6],4) // 3
  search([1,2,3,4,5,6],6)  // 5
  search([1,2,3,4,5,6],11) // -1

🔎 내가 했던 풀이

🔸 풀이 전 어떻게 구성할지 생각해봤다

1. 배열을 순회하면서 비교 후 검색 할 num과 같으면 해당 인덱스 리턴 없으면 -1리턴

const search = (arr, num) => {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] === num) return i;
  }
  return -1;
};

O(N)의 시간 복잡도를 가진다. -> 배열에 있는 첫번째 원소부터 n번째 원소까지 하나하나 탐색하므로

🔎 해답

1. Binary Search 이진탐색 : 정렬되어 있는 리스트에서 탐색 범위를 절반씩 좁혀가며 데이터를 탐색하는 방법이다. (정렬되어 있지 않으면 쓸 수 없음!)

   => 시간복잡도 log(N) : 정렬된 배열에서 범위를 반씩 줄여가면서 탐색하기 때문에!

🔸 풀이의 경우 주석으로 내가 이해 한 부분을 작성해봤다.

const search = (arr, num) => {
  //서치 할 범위 초기에는 전체로 잡는다
  let min = 0;
  let max = arr.length - 1;

  while (min <= max) {
    let mid = Math.floor((min + max) / 2); //중간 인덱스값을 구한다
    let currentElem = arr[mid];

    if (currentElem < num) {
      min = mid + 1; // 중간 값이 검색 할 num보다 작다? 그 중간값 이전 값은 비교 할 필요 없으므로 min 값(비교군 첫번째 인덱스)에 비교 했던 mid값 다음인 [mid+1 ]을 할당한다
    } else if (currentElem > num) {
      max = mid - 1; // 중간 값이 검색 할 num보다 크다? 그 중간값 이후 부터는 비교 할 필요 없으므로 max값(비교군 마지막 인덱스)에 mid값 이전인 [mid-1]을 할당한다
    } else {
      return mid; //같다면? 해당 인덱스 mid 값을 리턴한다.
    }
  }
  return -1; //없으면 -1리턴
};

*🤨이진탐색..너란 녀석 나중에 따로 정리해보겠어... *

1. 한 위치에서 다른 위치로 이동 할 수 있는 window(고정된 사이즈-특정 범위)를 생성, 내부 요소의 값을 이용하는 패턴
   • window : 단일 변수, 하위 배열 또는 필요한 경우 다른 문자열도 될 수 있음
     • 이동은 보통 왼쪽에서 오른쪽, 즉 요소의 시작 위치, 또는 배열이나 문자열의 시작 위치에서 끝나는 위치로 이동
2. 특정 조건에 따라 window는 증가하거나 닫히거나 새로 생성 될 수 있다
3. 배열과 문자열에서 데이터의 하위 집합을 추적하는데 유용함
4. 투 포인터와 비슷한 부분이 있다

💻 예제 1

정수 배열과 n이라는 숫자를 받아 해당 배열에서 n만큼 연속된 요소의 합의 최대값을 계산하는 maxSubArraySum이라는 함수를 작성하시오.

maxSubArraySum([1,2,5,2,8,1,5],2) // 10 maxSubArraySum([1,2,5,2,8,1,5],4) // 17 maxSubArraySum([4,2,1,6],1) //6 maxSubArraySum([4,2,1,6,2],4) // 13 maxSubArraySum([],4) // null

🔎 내가 했던 풀이

🔸 풀이 전 어떻게 구성할지 생각해봤다

1. 빈 배열 또는 조건에 맞지 않을 경우 null을 리턴한다 -> 배열의 길이보다 n의 숫자가 클때
2. 결과 값으로 쓸 result와 비교를 위해 임시로 비교를 위한 temp 변수 선언
3. temp변수에 첫 비교 값인 n-1 인덱스까지의 값의 합(처음부터 n개 요소의 합) 할당
4. window는 고정값이므로 한칸씩 이동하므로 이전 첫 요소 빼고 다음 요소 더함 (하나의 인덱스만큼 이동하며 n개의 합을 유지한다) => 그리고 temp 값과 result를 비교해서 둘 중 큰 숫자를 result에 할당한다.
   • for문의 시작은 n부터 시작(배열의 인덱스는 0부터 시작하므로)
   • 배열 모두 비교 후 끝나면 비교하며 저장된 가장 큰 합의 값인 result를 할당한다.

const maxSubarraySum = (arr, n) => {
  if (arr.length < n) return null;

  let result = 0;
  let temp = 0;

  for (let i = 0; i < n; i++) { 
    result += arr[i];
  }

  temp = result;

  for (let j = n; j < arr.length; j++) {
    temp = temp - arr[j - n] + arr[j];
    result = Math.max(result, temp);
  }

  return result;
};

🔎 해답

위 풀이와 동일 시간 복잡도는 O(N)

1. 인덱스 또는 위치 해당하는 포인터와 값을 생성하고 특정 조건 기준으로 처음 끝 중간으로 이동. -> 공간 복잡성을 최소화하면서 문제를 해결하는데 효율적
2. 한 쌍의 값이나 조건을 충족시키는 것을 찾는 방식 (보통은 한 쌍을 찾는데 사용)
3. 두 개의 포인터를 생성 -> 투 포인터라고도 부름

💻 예제 1

정렬된 정수의 배열를 받아 합이 0이 되는 한쌍의 숫자를 배열 형태로 리턴하는 sumZero 함수를 작성하시오. (합이 0인 한 쌍이 존재하지 않으면 undefined 리턴)

sumZero([-3,-2,-1,0,1,2,3]) // [-3,-3] sumZero([-2,0,1,3]) // undefined sumZero([1,2,3]) // undefined

🔎 내가 했던 풀이

🔸 풀이 전 어떻게 구성할지 생각해봤다

1. 다중포인터 -> 한쌍의 값을 찾으므로 포인터를 두 개 사용 한다?
2. 처음 끝 양쪽에서부터 이동하며 비교
   • 합이 0 이면 한쌍의 배열 리턴
   • 합이 양수 끝 포인터 -- (오른쪽 양수가 더 크니까)
   • 합이 음수 시작 포인터 ++ (왼쪽 음수가 더 크니까)
   • 끝 포인터 - 시작 포인터 => 음수라면 비교 끝 return

🔸 위의 내용을 코드로 구성해보면

const sumZero = (intArr) => {


  let left = 0; //첨
  let right = intArr.length - 1; //끝
  while (left < right) {
    const sum = intArr[left] + intArr[right];
    if (sum === 0) return [intArr[left], intArr[right]];
    else if (sum > 0) right--;
    else left++;
  }
};

시간 복잡도 O(N), 공간 복잡도 O(1) => 해답도 내가 했던 풀이와 동일했다 🤓

시간 복잡도를 생각하지 않고 nested loop를 사용한 코드는 어떤걸까? 아래와 같다!

아래의 코드의 성능의 경우 시간복잡도 O(n^2) , 공간 복잡도 O(1)와 같다.

const sumZeroUseNL = (intArr) => {
  for (let i = 0; i < intArr.length; i++) {
    for (let j = j + 1; j < intArr.length; j++) {
      if (intArr[i] + intArr[j] === 0) {
        return [intArr[i], intArr[j]];
      }
    }
  }
};

🔎 풀이

내가 했던 풀이와 동일~!

💻 예제 2

정렬된 정수의 배열을 받아 배열의 고유값의 갯수를 리턴하는 countUniqueValues 함수를 작성하시오 (음수가 올 수 있다, 배열은 항상 sort된 상태이다)

countUniqueValues([1,1,1,1,1,2])//2 countUniqueValues([1,2,3,4,4,4,5,5,12,12,13]) //7 countUniqueValues([])//0 countUniqueValues([-2,-1,-1,0,1]) //3

🔎 내가 했던 풀이

🔸 풀이 전 어떻게 구성할지 생각해봤다

• 음수가 배열의 요소로 올 수 있음 -> ex) [-1,1] => -1과 1 고유값 2가지
  • 포인터 2개 선언
  • 두개의 포인터를 증가 시키면서 서로 비교,
  • 선증가된 비교값의 포인터가 배열의 마지막 인덱스가 되면 종료 후 갯수 반환
  • 빈 배열을 받으면 무조건 0 리턴 => 따라서 count의 초기값은 1

처음에 음수를 고려하지 않는 절대값을 비교하는 줄 알고 삽질했었다.. 해당 문제의 의도를 다시 잘 파악해보자...ㅋ..😩

🔸 위의 내용을 코드로 구성해보면

const countUniqueValues = (intArr) => {

  if (intArr.length === 0) return 0;

  let basis = 0;
  let round = 1;
  let count = 1;

  while (round < intArr.length) {
    const baseElem = intArr[basis];
    const roundElem = intArr[round];

    if (baseElem !== roundElem) count++;

    basis++;
    round++;
  }

  return count;
};

🔎 풀이

while을 사용한 풀이 => 알고리즘 풀이 과정만 보고 다시 구성해 봄!

const solCountuniqueValues = (intArr) => {
  if (intArr.length === 0) return 0; // 빈 배열은 비교 할 필요 없으니 바로 0 리턴

  let basis = 0;
  let round = 1;

  while (round < intArr.length) {

    if (intArr[basis] !== intArr[round]) {
      basis++;
      intArr[basis] = intArr[round];
    }

    round++;
  }

  return basis + 1;
};

1)변수선언 basis : 기준점 round : index를 증가시키며 비교하는 값 2)과정 basis와 round 위치의 같으면 round 인덱스 증가 basis와 round 위치의 값이 다르면 basis 인덱스 증가 후 해당 자리에 비교값 할당, round 인덱스 증가 3)리턴값 해당 작업 반복 후 round의 인덱스가 배열 마지막 인덱스가 되면 basis 의 index+1(인덱스는 0부터 시작하므로) 리턴

위의 내용을 for loop를 이용해 다시 리팩토링😎

• 불필요한 변수 할당 줄이기 , 필요한 변수 1개만 선언

//풀이

const solCountuniqueValues = (intArr) => {
  if (intArr.length === 0) return 0; // 빈 배열은 비교 할 필요 없으니 바로 0 리턴
  let i = 0;
  for (let j = 0; j < intArr.length; j++) {
      if(intArr[i] !== intArr[j]) {
      i++;
      intArr[i] = intArr[j];
      }
  }

  return i + 1;
};

1. Frequency Counter
2. Multiple Pointers
3. Sliding Window
4. Divide and Conquer
5. Dynamic Programming
6. Greedy Algorithms
7. Backtracking 등등...

✔️ 1. Frequency Counter

1. object 또는 data set를 이용해서 다양한 값과 빈도를 수집
2. 서로 비슷한 값으로 구성 되어 있는지, 서로 간의 애너그램(서로 같은 철자로 구성된건지), 값이 다른 값이 포함되는지 여부, 두 개 이상 또는 특정하게 발생하는 빈도 확인
3. 배열과 문자열의 중첩 루프 또는 O(N^2) 연산을 대신할 수 있음

💻 예제 1

두 배열을 받아 , 요소의 갯수가 같으면서 두번째 인자의 배열이 첫번째 인자의 배열의 제곱의 값을 갖고 있는 함수 same을 작성하시오. (단, 순서는 상관 없다.)

same([1,2,3],[4,1,9]); // true same([1,2,3],[1,9]); // false same([1,2,1],[4,4,1]); // false (must be same frequency)

🔎 내가 했던 풀이

const same = (arr1, arr2) => {
  // 배열의 크기가 같지 않으면 비교 할 필요 없이 return false
  if (arr1.length !== arr2.length) return false;
  // arr1 배열 순회
  for (const arr1Elem of arr1) {
    //arr1 요소의 인덱스
    const idx = arr2.indexOf(Math.pow(arr1Elem, 2));
    if (idx > -1) {
      // 인덱스가 있으면 arr2에서 제거해서 중복으로 확인 되는 것 방지
      arr2.splice(idx, 1);
    } else {
      //없으면 바로 false 리턴
      return false;
    }
  }
  return true; //모든 조건 만족하면 true
  //
};


//문제 예제의 케이스의 답은 만족 하므로 큰 배열의 값으로 한번 더 테스트
const t1 = performance.now();
console.log(
  same(
    [
      1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2,
      3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100,
    ],
    [
      1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 10000, 1, 4, 9, 16, 1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 10000, 25, 36, 49,
      64, 81, 100, 10000, 1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 10000,
    ]
  )
);
const t2 = performance.now();
console.log(`same 걸린 시간 : ${(t2 - t1) / 1000}s`);
//same 걸린 시간 : 0.010898541000000008s

뭔가 문제 없이 잘 돌아간다. 뭔가 중첩 루프도 없어보였다.

하지만.. 위의 해결책의 경우 하나의 for문을 사용한 것 같지만 그 자체가 loop인 indexOf를 사용했다.

게다가 배열의 splice 메서드 또한 요소가 마지막에 있다면 constant time인 O(1)의 시간 복잡도를 가지지만, 요소가 중간이나 앞에 있다면 linear time O(n) 의 시간 복잡도를 가진다.

위의 해답은 시간복잡도 = O(N^2)의 복잡도를 가지게 된다...

🔎 Frequency Conter 이용한 답 => 시간복잡도 O(n)

• 두 개의 중첩 루프보다 개별 루프가 낫다

** 객체를 사용 ** : 객체를 사용하여 구성하는 것은 배열이나 문자열의 내용을 분석하는 방법으로 두 개의 배열을 객체로 세분화 하여 각 배열의 요소들 분류 후 각 배열을 비교 가능하다

const same = (arr1, arr2) => {
  if (arr1.length !== arr2.length) return false;
  // 중첩 for루프 없이 개별 배열의 빈도수를 count
  const frequencyCounter1 = {};
  const frequencyCounter2 = {};
  for (const val of arr1) {
    frequencyCounter1[val] = (frequencyCounter1[val] || 0) + 1;
  }
  for (const val of arr2) {
    frequencyCounter2[val] = (frequencyCounter2[val] || 0) + 1;
  }
  for (const key in frequencyCounter1) { 
    // 객체의 키로 접근하는 것은 O(1)의 시간 복잡도를 가진다!
    // 제곱이 되는 값이 있는지 먼저 확인
    if (!(key ** 2 in frequencyCounter2)) return false;

    //제곱의 값이 있다면 서로 그 갯수가 동일한지 확인
    if (frequencyCounter2[key ** 2] !== frequencyCounter1[key]) return false;
  }

  return true;
};

const t3 = performance.now();
console.log(
  same(
    [
      1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2,
      3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100,
    ],
    [
      1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 10000, 1, 4, 9, 16, 1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 10000, 25, 36, 49,
      64, 81, 100, 10000, 1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 10000,
    ]
  )
);
const t4 = performance.now();
console.log(`same 걸린 시간 : ${(t4 - t3) / 1000}s`); 
//same 걸린 시간 : 0.000051708000000004974s

객체는 순서 없는 데이터 집합으로 key값으로 접근한다 따라서 키를 통해 값에 접근 하는 것은 O(1)의 시간을 가지므로 배열을 순회하는 것 보다 더 시간이 적다.

수행시간 비교하면 내가 했던 방식은 약 0.0108985s frequency counter 사용 시 약 0.0.0000517s 입력 값의 배열의 크기가 클 수록 시간 차이가 컸다.

💻 예제 2

두 개의 문자열을 받아 서로의 애너그램인지 확인 후 true/false 리턴하는 함수 validAnagram을 작성하시오

validAnagram('',''); // true validAnagram('aaz','zza'); // false validAnagram('anagram','nagaram'); //true validAnagram('rat','car'); //false validAnagram('awesome','awesom'); //false validAnagram('qwerty','qeywrt'); //true validAnagram('texttwisttime','timetwisttext'); //true

🔎 내가 했던 풀이

const validAnagram = (str1, str2) => {
  //문자열의 길이가 다르다면 비교 할 필요 없이 false 리턴
  if (str1.length !== str2.length) return false;
  // 빈문자열끼리는 true
  if (str1 === '' && str2 === '') return true;

  const str1Counter = {};
  const str2Counter = {};

  //각각 str1과 str2의 문자열 안의 글자 수의 빈도수를 각각의 object에 할당
  for (const char of str1) {
    str1Counter[char] = (str1Counter[char] || 0) + 1;
  }
  for (const char of str2) {
    str2Counter[char] = (str2Counter[char] || 0) + 1;
  }

  // 서로 객체 키가 다르면 서로의 애너그램이 될 수 없으므로 false 리턴
  for (const char in str1Counter) {
    if (str1Counter[char] !== str2Counter[char]) {
      return false;
    }
  }
  return true;
};

중첩 루프를 사용하지 않으면서 시간 복잡도 O(n)의 방식으로 해결 했다. 하지만 리팩토링 필요

• count를 위한 obejct 하나만 선언
• 해당 char이 존재하는 지 확인, 만약 이미 count 된 경우는 -1 : 갯수가 같다면 0이 된다 그 이후 동일 문자가 있다면 if (!strCounter[char]) 에서 0값, 즉 true가 되므로 false리턴하게된다

const validAnagramRefact = (str1, str2) => {
  if (str1.length !== str2.length) return false;
  if (str1 === '' && str2 === '') return true;
  const strCounter = {};
  for (const char of str1) {
    strCounter[char] ? (strCounter[char] += 1) : (strCounter[char] = 1);
  }
  for (const char of str2) {
    if (!strCounter[char]) {
      return false;
    } else {
      strCounter[char] -= 1;
    }
  }
  return true;
};

후자의 코드가 불필요한 object 추가 선언 없이 더 깔끔해 보인다.🤓

문제 해결 방법을 정의한 '일련의 단계적 절차'이자 어떠한 문제를 해결하기 위한 '동작들의 모임'이다 출처 : wiki

즉, 문제 해결 위해 수행해야 하는 일련의 과정 및 단계

🧐 어떻게 접근해야 할까?

1. 문제 해결을 위한 계획 수립
2. 일반적 문제 해결 패턴 파악

🔎 문제 해결 단계

EX) 문자열을 받아 각각의 문자의 갯수를 출력하는 charCount 함수를 작성하시오 (단, 대소문자 구분 없음)

1️⃣STEP 01 - 문제 이해

1. 자신만의 방식으로 바꿔서 이해 가능한가?
2. 그 문제의 입력값(input)이 무엇인가? ->입력값의 형태 등등
3. 문제 해결을 위한 결과(output)는 무엇인가? -> 출력 값의 형태 등등
4. 입력값이 출력값을 결정할 수 있는가? ->문제 해결을 위한 충분한 정보를 알고,갖고 있는가?
5. 문제의 중요한 부분이 무엇인지 아는가? 해당 부분을 어떻게 명칭하는가?

2️⃣STEP 02 - 구체적인 예시

1. 간단한 예제로 시작 해서 복잡한 예제로
2. 빈 입력값 -> 유효하지 않는 입력값이 주어진 상황 유용
3. 유효하지 않은 입력값

charCount('aaaA'); // {a:4}
charCount('Hi~ Hello World! 1223');
/*
{
  h: 2,
  i: 1,
  e: 1,
  l: 3,
  o: 2,
  w: 1,
  r: 1,
  d: 1,
  1: 1,
  2: 2,
  3: 1
}
*/

3️⃣STEP 03 - 문제의 세분화

1. 기본적 구성요소 작성 ➡️ 감이 잘 잡히지 않거나 이해되지 않는 부분들을 파악하는 데 도움이 된다

const charCount = (str) => { // 기본적 구성 요소
  // 실행 과정
  // 리턴 : 객체, 각각의 키는 소문자, 값은 숫자, 특수문자 공백 제외
}

function charCount (str)  { // 세분화
   [시작] => 객체 생성
   [과정] => 
       string 문자열 순회하며 각각의 문자 처리
       문자가 숫자/문자 && 객체 안에 없을 경우 => object의 key로 설정 후 +1
       문자가 숫자/문자 && 객체 안에 있을 경우 => 해당 숫자/문자의 key로 값을 찾아 +1
       문자나 숫자가 아닌 공백,마침표 등등 일 경우 카운팅 하지 않는다
   [끝] => 객체를 반환한다
};

4️⃣STEP 04 - 해결 / 단순화

1. 이전 일련의 과정을 통해 문제 해결
2. 당장 해결하지 못한다면 단순화 부터 ➡️ 다른 문제 해결을 위해 시간이 많이 소요되는 부분을 배제하여 단순화 시킴 ➡️ 문제를 단순화 하는 과정(동작 방식의 이해)에서 문제의 어려운 부분을 파악하면서 다시 통합

function charCount(str) {
  // 시작 => 객체 생성
  const result = {};
  // 과정 => string 문자열 순회하며 각각의 문자 처리
  for (let i = 0; i < str.length; i++) {
    // 영대문자 -> 영소문자
    const char = str[i].toLowerCase();

    // 문자나 숫자가 아닌 공백,마침표 등등 일 경우 카운팅 하지 않고 다음 문자열 체크
    if (/[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/ ]/gim.test(char)) continue;

    if (result[char] > 0) { // 문자가 숫자/문자 && 객체 안에 없을 경우 => object의 key로 설정 후 +1
      result[char]++;
    } else { //문자가 숫자/문자 && 객체 안에 있을 경우 => 해당 숫자/문자의 key로 값을 찾아 +1

      result[char] = 1;
    }
  }
  // 끝 => 객체를 반환한다
  return result;
}


console.log(charCount('aaaaa~~~~bbb**(@@ccccccccccc!!!!&&&    dddddd'));  //{ a: 5, b: 3, c: 11, d: 6 }

5️⃣STEP 05 - 검증 및 재구성(리팩토링)

1. 결과 확인했는가?
2. 결과를 다른 방식으로 도출 할 수 있는가?
3. 한눈에 알아보고 이해할 수 있는가?
4. 해결책을 다른 문제에 적용할 수 있는가?
5. 해결책의 성능을 향상할 수 있는가? ➡️ 해결책을 도출하면서 가장 먼저 고려할 부분
6. 다른방식으로 리팩토링 할 방법을 고려할 수 있는 가?
7. 다른 사람들은 어떻게 해결했는가? ➡️ 새로운 접근 방식과 다른 해결책을 알 수 있음

💡 예제 풀이에서 선택했던 정규표현식은 일반적으로 백트래킹으로 일치 여부 판단 , 최악의 경우 O(2^n)의 복잡도를 가짐 (n=정규식 크기) -> 어디까지나 최악의 경우, 까다로운 조건이 아니라면 큰 문제는 없으나 성능 향상을 위해 아래와 같이 시간복잡도 O(1)방식으로 변경 가능

function isCharNumeric(char) {
  const code = char.charCodeAt(0);
  if (
    !(code > 47 && code < 58) && // numeric (0 to 9)
    !(code > 64 && code < 91) && // upper (A to Z)
    !(code > 96 && code < 123) // lower (a to z)
  ) {
    return false;
  }
  return true;
}

function charCount(str) {
  // 시작 => 객체 생성
  const result = {};
  // 과정 => string 문자열 순회하며 각각의 문자 처리
  for (const char of str.toLowerCase()) {
    // 문자나 숫자가 아닌 공백,마침표 등등 일 경우 카운팅 하지 않고 다음 문자열 체크
    if (!isCharNumeric(char)) continue;

    // 문자가 숫자/문자 && 객체 안에 없을 경우 => object의 key로 설정 후 +1
    //문자가 숫자/문자 && 객체 안에 있을 경우 => 해당 숫자/문자의 key로 값을 찾아 +1
    result[char] = ++result[char] || 1;
  }
  // 끝 => 객체를 반환한다
  return result;
}

console.log(charCount('aaaaa~~~~bbb**(@@ccccccccccc!!!!&&&    dddddd')); //{ a: 5, b: 3, c: 11, d: 6 }

🥲그전에는 무작정 아무것도 고려하지 않고 결과만 나오는 것에만 집중해 코드부터 냅다 썼는데... 확실히 위의 방법대로 따라가니 머릿속에 더 정리되고 구현 시간이 조금 줄어든 느낌이다.

컴퓨터는 디지털 장치 0과 1로 표기 ➡️ 2진법 체계

1. 1bit ➡️ 전기 스위치 1개
   • 경우의 수 2가지 : 스위치가 On 상태 = 1 , 흐르지 않는 Off 상태 = 0

2. 4bit 여러 스위치(or 전선) 4개씩 묶으면 ➡️ 2^4 16개의 경우의 수를 가짐
   • 따라서, 4bit 씩 묶었을 경우 16진수 체계로 사용함

게이트 회로

• 게이트 : 게이트는 논리회로의 기본 하드웨어 기본요소이며, 입력 논리의 필요 조건을 만족할 때 1 또는 0의 신호를 출력

1. AND(논리곱) 연산 : 둘 다 참이 참
2. OR(논리합) 연산: 둘 중 하나라도 참이면 참
3. XOR(exclusive or - 배타적 논리합) 연산 : 입력이 서로 다르면 참
4. NOT(논리부정) : 거짓은 참 참은 거짓, Inveter라 부르기도 함

=> 가산기 만들때 필요한 개념

Object는 순서가 없다(unordered list) 오로지 key🔑를 통해서 접근 및 추가!

• 정렬이 필요 없을 때
• 빠른 접근,추가,삭제

✔️ Object의 추가,삭제,접근,탐색

1. Insertion(추가) - O(1)

2. Removal(삭제) - O(1)

3. Searching(탐색) - O(N)

   • 객체의 프로퍼티를 전부 순회해서 값을 확인해야 하기 때문에 linear time O(N)

4. Access(접근) - O(1)

✔️ Object Method

1. Object.keys - O(N)
2. Object.values - O(N)
3. Object.entries - O(N)
4. object.hasOwnProperty(key) , Object.hasOwn(object,key)- O(1)

const exObject = {
  one : 1,
  two : 2,
  three : 3,
  isTrue : true,
  isFalse : false,
}

// Object의 크기가 커질 수록 method가 처리하는 연산이 커짐 O(N) 
console.log(Object.keys(exObject)); 
// key 배열 return [ 'one', 'two', 'three', 'isTrue', 'isFalse' ]

/* Objects.valuse, Object.entires  
또한  Object.keys와 마찬가지인 이유로 object의 요소가 늘어날수록 연산이 커짐 O(N) */
console.log(Object.values(exObject)); 
// value 배열 return [ 1, 2, 3, true, false ]

console.log(Object.entries(exObject)); 
/* [key-value]쌍의 배열
[
  [ 'one', 1 ],
  [ 'two', 2 ],
  [ 'three', 3 ],
  [ 'isTrue', true ],
  [ 'isFalse', false ]
]
*/

/* Object.hasOwnProperty(key) , Object.hasOwn(object,key)
-> object의 내부 key값 존재 유무 정해진 값을 받아 boolean type으로 return => O(1) */
console.log(exObject.hasOwnProperty('one'));//true
console.log(exObject.hasOwnProperty(1));//false (key기준)
console.log(Object.hasOwn(exObject,'two'));//true

Array와 Big O‹with.js›

• ordered list
• 순서가 정해져 있기 때문에 연산에 시간이 더 걸릴 수 있다.
• 배열에 있는 데이터를 접근하는 것은 빠름,
• 정렬될 필요가 있는 데이터 및 정렬 되어 있는 데이터 보관 유리

✔️ Array의 추가,삭제,접근,탐색

1. Insertion(삽입)
   • 맨 앞: O(N) => 요소들이 하나씩 뒤로 밀리며 index 재정렬 필요
   • 맨 뒤: O(1)
2. Removal(삭제)
   • 먠 앞, 중간 추가: O(N) => index 재정렬 필요
   • 맨 뒤: O(1)
3. Searching(검색) - O(N)
4. Access(접근) - O(1)

✔️ Array Method

1. push , pop - O(1) : index를 이용하여 접근하는 것과 동일, constant time, 빠름

2. shift - O(N) : reindex 필요

3. unshift - O(N) : reindex 필요

4. concat - O(N) : 병합 할 배열의 크기가 커질 수록 오래 걸림

5. slice - O(N) : 배열 전체 또는 일부를 copy하지만 copy할 배열의 길이에 따라 다름

6. splice - O(N) : elem 제거 및 추가-O(N)

7. sort - O(N logN)

8. forEach(),map(),filter(),reduce() 등등 - O(N)

• 불필요한 연산을 제거하여 알고리즘의 성능을 평가하기 위해 사용한다.(최악인 경우를 평가)
• 측정되는 복잡도 시간 복잡도와 공간 복잡도가 있다.
• 코드가 느려지거나 장애 발생 시 비능률적인 코드를 특정해 애플리케이션의 문제점을 찾는 데 도움이 된다.

특징

1. 상수항을 무시한다 ex) $$O(n+3) => O(n)$$
2. 계수를 무시한다 ex) $$O(3n) => O(n)$$
3. 최고차항만 표기한다 ex) $$O(3n^2+2n+5) => O(n^2)$$

시간 복잡도

• 프로세스가 수행해야하는 연산을 수치화 한 것 (시간 기준이 아닌 것은 컴퓨터 하드웨어 성능 및 여러 조건에 의해 조금씩 달라 질 수 있기 때문에)

$$O(1) < O(log N) < O(N) < O(N log N) < O(N^2) < O(N^3) < O(2^n)$$

(우측으로 갈 수록 효율⬇️😞)

Big o 표기법 종류

1. $$O(1)$$ - 상수시간 : 입력 데이터에 관계 없이 일정 ex) stack -push/pop

2. $$O(log N)$$ - 로그 시간 : 데이터의 로그에 비례해 알고리즘의 단계가 늘어날 때, 알고리즘이 로그 시간으로 실행 (연산이 한 번 실행될 때 마다 데이터의 크기가 절반 감소, 지수가2) ex)이진트리

3. $$O(N)$$ - 선형 시간 : 데이터의 크기가 커지는 만큼 같은 비율로 늘어남 ex)for문

4. $$O(N logN)$$ - 선형 로그 시간 :로그 시간 복잡도와 선형 시간 복잡도를 곱한 만큼커짐 (입력 데이터가 많아질수록 처리 시간이 로그 배만큼 더 늘어남) ex)퀵 정렬(Quick Sort),병합 정렬(Merge Sort),힙 정렬(Heap Sort)

5. $$O(N^2)$$ - 2차시간 , 다항 :알고리즘의 복잡도는 n의 제곱에 정비례 ex)삽입 정렬(Insertion Sort), 버블 정렬(Bubble Sort), 선택 정렬(Selection Sort), 이중 for 문

6. $$O(2^n)$$ - 지수시간 : 최악의 시간 복잡도로 주로 재귀적으로 수행하는 알고리즘 ex)피보나치 수열, 재귀가 역기능할 경우

공간 복잡도

• 알고리즘의 실행을 완료할 때까지 필요한 자원의 양 (고정 공간, 데이터 구조 공간, 임시 공간의 메모리)를 얼마나 사용하는지 확인

• Big o 표기법 사용 가능
• JS에서
  • $$O(1)$$ => Booleans, numbers, undefined, null
  • $$O(n)$$ => String, array, object

//ex01 => Number constant space => O(1)
const sum = (array) => {
  let total = 0; //number
  for (let i = 0; i < array.length; i++) {
    total += array[i]; // number
  }
  return total;
}; 

//ex02 => Array 배열이 커질 수록 return되는 new Array 커짐 O(n)

const double = (array) => {
  let newArr = []; // array 입력 값에 따라 배열의 크기가 커지게됨
  for (let i = 0; i < array.length; i++) {
    newArr.push(array[i]); 
  }
  return newArr; // n numbers
};

array의 각 element 중 divisor로 나누어 떨어지는 값을 오름차순으로 정렬한 배열을 반환하는 함수, solution을 작성해주세요. divisor로 나누어 떨어지는 element가 하나도 없다면 배열에 -1을 담아 반환하세요.

제한사항

• arr은 자연수를 담은 배열
• 정수 i,j에 대해 i ≠ j 이면 arr[i] ≠ arr[j]
• divisor은 자연수
• array은 1 이상인 배열

입출력 예

나의 풀이

1. sort()로 오름차순 정렬
2. 배열 요소 % divisor === 0인 조건만 filter()
3. answer의 배열의 길이가 0인 경우 [-1] 를 아니면 answer 리턴

function solution(arr, divisor) {
  const answer = arr.sort((a,b)=>a-b).filter(elem => elem %divisor === 0)

  return answer.length === 0 ? [-1] : answer
}

• 해당 풀이로 테스트 6번의 경우 26.56ms가 걸렸다.

테스트 6번에 대한 러닝타임 줄이기

function solution(arr, divisor) {
  const answer = arr.filter(elem => elem %divisor === 0)

  return answer.length === 0 ? [-1] : answer.sort((a,b)=>a-b)
}

• 조건에 맞는 값을 return할때만 sort실행

• 테스트 6번 2.21ms (총 24ms 가량 러닝타임 줄어들었다.)

정수 n을 입력받아 n의 약수를 모두 더한 값을 리턴하는 함수, solution을 완성해주세요.

제한사항

n은 0이상 3000이하인 정수입니다.

입출력예

n = 12 => return 28 n = 6 => return 6

나의 풀이

• 약수 : 어떤 수를 나누어떨어지게 하는 수

• 주어진 숫자의 모든 약수를 구해 더해주는 값으로 % 연산자와 while 반복문 그리고 reduce를 사용하기로 했다.

나머지가 0인 숫자를 배열에 담는다 해당 배열의 누적 합을 return한다

const solution = (n) => {
    let answer= [];
    let check =1;
    while (check <= n) {

        if(n % check === 0) answer.push(check);
        check ++;
    }
    return answer.reduce((arr,cur) => arr+cur,0) ;
}

주의할점

제출 후 런타임 에러 관련 오류

-n이 0일 경우 빈 배열을 전달하게 되므로 reduce사용 시 initialValue를 0으로 설정해주자

callback의 최초 호출에서 첫 번째 인수에 제공하는 값. 
   초기값을 제공하지 않으면 배열의 첫 번째 요소를 사용합니다. 
빈 배열에서 초기값 없이 reduce()를 호출하면 오류가 발생하는 점 참고.

mdn reduce() 문서 바로가기

다른방법 풀이

• 굳이 빈 배열 및 나눌 수에 대한 변수 선언없이 푸는 것이 더 깔끔해보인다.

const solution = (n) => {
  let sum = 0;
    for (let i = 1; i <= num; i++) {
        if (num % i === 0) sum += i
    }
    return sum
}

1) 호이스팅 : 자바스크립트에서 코드를 위에서 아래로 읽어가기전, 변수,함수, 클래스 등의 선언부를 먼저 읽어들이는 작업

2) function은 function구문 전체가 먼저 읽어들여짐 => function은 함수 표현식으로 쓰되, 함수 선언식이 필요할 경우가 있기에 상황에 맞춰서 사용

3) var을 사용하는것은 지양(같은 이름의 변수를 두번 선언 하는 것도 가능하며 전역 변수에 또 바로 등록해 선언하는 것도 가능), let과 const를 활용

4) var와 let,const가 호이스팅 관련해서 다른 이유 : 호이스팅 과정에서 읽어들이는 부분에 차이가 있기 때문인데, - 변수 생성과정: 크게 1. 변수선언 2. 초기화(undefined) 3. 할당. 세 가지 과정
- var는 호이스팅 과정에서 1.변수선언과 2.초기화까지 이루어짐 : 스코프의 유효범위 처음부터 변수가 선언된 위치 전까지
var은 참조하여 초기화 값(undefined)를 끌어낼 수 있음
- let,const는 초기화가 안되어있는 상태라 var과 달리 reference erroe 발생. // 이러한 방시으로 참조할 수 없는 구간을 일시적 사각지대라 하여 TDZ라고 한다

2. TDZ (temporal Dead Zone) :

1) TDZ은 let, const, class 구문의 유효성을 관리
2) var, function, import 구문은 현재 scope에서 hoisting되기 때문에 TDZ의 영향을 받지 않는다. 3) typeof 연산자는 변수가 현재 스코프 안에 선언되었는지 확인 시 유용. TDZ 안에서는 다르게 동작

      //TDZ는 선언문이 존재하는 scope 범위 안에서 변수에 영향을 줌.
      function doSomething(someVal) {
      // Function scope
      typeof variable; // => undefined
      if (someVal) {
          // Inner block scope
          typeof variable; // throws `ReferenceError`
          let variable;
        }
      }

      doSomething(true);