본문 바로가기

분류 전체보기

(36)
포켓몬 API를 사용하여 포켓몬 도감 만들기 포켓몬 API를 활용하여 도감 만들기API 요청포켓몬 API는 내부에 데이터가 복잡한 것 같다. axsios.all을 사용하여 가져온 150개에 대에터에 병렬요청을 하였다.이 복잡한 데이터를 내가 원하는 것만 가져오기 위해서 map(), find()로 원하는 데이터만 가져왔다.연결데이터를 무한 스크롤을 사용하여 연결을 해주었다.useInfiniteQuery쿼리를 사용하여 무한 스크롤을 쉽게 구현할 수 있다.data에는 모든 불러온 데이터를 담은 객체를fetchNextPage()는 다음 페이지 데이터를 불러오는 함수이다.hasNextPage는 다음 페이지가 있다면 boolean 값으로 리턴 한다. 있다면 true를 반환 isFetching 현재 데이터를 가져오고 있는 중인가? booleanisFetchin..
JS 아코디언 구현하기 오류사항처음에 li에 두 번쨰 요소에 DOM을 가져와야 하는데 두 번째 요소를 가져오지를 못했다.해결currentTarget로 해결을 하였다. 이 녀석은 이벤트가 일어난 부모 요소를 선택을 해준다. 이벤트가 부착된 부모의 위치를 반환 ! nextElementSibling 이는 현재 요소의 바로 다음 형제 요소를 반환 같은 부모 요소를 가지고 있는 형제 요소 중에서 현재 요소보다 바로 뒤에 있는 요소를 선택하는 데 사용된다고 한다. currentTarget 로 이벤트가 일어난 부모를 요소를 가져오고, nextElementSibling로 다음 요소를 가져온다.구현화면
JS 설문조사 창 구현하기 설문조사 구현하다가 나온 문제처음에 이렇게 코드를 작성하니 각각의 버튼에 대해서 이벤트를 주었기 때문에 잘 동작을 하기는 했다.하지만 다중선택이 되었고 이는 문제에서 제시한 요구사항이 아니었다.문제에서 요구사항은 각각의 버튼을 클릭 할 수 있어야 했다.해결각각의 이벤트를 달아 주었으니깐 클릭시 클래스가 추가가 되니array 를 가져와 추가된 다른 버튼의 클래스를 삭제해 주었다. remove가 없으면 다 추가가 되니버튼 클릭 시 추가가 된 클래스들을 지워 주었다.완성 화면
원시와, 객체에 대한 메모리 메모리원시 값원시 값은 불변하다.변수 하나를 생성하고, 다른 변수에 할당을 한다면 같은 주소를 참조 하는 것이 아니라 새로운 주소를 생성하여 그 주소를 바라 보고 있다.원시 값은 이러한 특성 떄문에 불변하다는 거다.다른 변수에 할당되면 새로운 주소가 생성되고, 기존 주소는 영향을 받지 않는다.불변성 덕분에 원시 값을 변경하는 것은 불가능하고, 새로운 값으로 대체되는 방식다만 큰 데이터가 있다면 같은 주소를 참조하는 것이 아니기 떄문에 30바이트 라는 문자열이 있다면 생성하고 다른 변수에 할당한다면새로운 주소를 하나 더 생성하기 때문에 30 * 바이트 이다.``` let a = 1;let b = a;```# 참조형참조형 데이터는 가변성이다. 즉 변경이 가능하다.참조형 데이터는 객체를 하나 생성 후 다른 ..
프로그래머스 코딩 기초 트레이닝 문자 리스트를 문자열로 변환하기 문자 리스트를 문자열로 변환하기문자들이 담겨있는 배열 arr가 주어집니다. arr의 원소들을 순서대로 이어 붙인 문자열을 return 하는 solution함수를 작성해 주세요.배열을 문자열로 만들려면 join()함수사용function solution(arr) { var answer = ''; return arr.join('');}
프로그래머스 코딩 기초 트레이닝 마지막 두 원소 마지막 두 원소정수 리스트 num_list가 주어질 때, 마지막 원소가 그전 원소보다 크면 마지막 원소에서 그전 원소를 뺀 값을 마지막 원소가 그전 원소보다 크지 않다면 마지막 원소를 두 배한 값을 추가하여 return하도록 solution 함수를 완성해주세요.answer에 스프레드로 받고 그냥 받으면 push 할 떄에 이차원 배열로 만들어짐마지막 원소와, 마지막 원소 전이니깐 num_list.length - 1 마지막 원소 num_list.length - 2 마지막 원소 전 을 구하고삼항연산자로 나온 값을 push 해준다.function solution(num_list) { var answer = [...num_list]; let sum = num_list[num_list.length - ..
프로그래머스 코딩 기초트레이닝 글자 이어 붙여 문자열 만들기 글자 이어 붙여 문자열 만들기문자열 my_string과 정수 배열 index_list가 매개변수로 주어집니다. my_string의 index_list의 원소들에 해당하는 인덱스의 글자들을 순서대로 이어 붙인 문자열을 return 하는 solution 함수를 작성해 주세요.index_list를 저장할 변수 생성, loop문으로 index_list 길이만큼 돌고index = index_list[i]를 넣어준다. 각 문자열에 인덱스를 출력하기 위해서answer += my_string[index] 로 각 문자열에 인덱스를 출력 function solution(my_string, index_list) { var answer = ''; let index = 0; for (let i = 0; i..
프로그래머스 코딩 기초트레이닝 콜라츠 수열 콜라츠 수열모든 자연수 x에 대해서 현재 값이 x이면 x가 짝수일 때는 2로 나누고, x가 홀수일 때는 3 * x + 1로 바꾸는 계산을 계속해서 반복하면 언젠가는 반드시 x가 1이 되는지 묻는 문제를 콜라츠 문제라고 부릅니다.그리고 위 과정에서 거쳐간 모든 수를 기록한 수열을 콜라츠 수열이라고 부릅니다.계산 결과 1,000 보다 작거나 같은 수에 대해서는 전부 언젠가 1에 도달한다는 것이 알려져 있습니다.임의의 1,000 보다 작거나 같은 양의 정수 n이 주어질 때 초기값이 n인 콜라츠 수열을 return 하는 solution 함수를 완성해 주세요. answer에 처음에 n을 넣어줘서 10을 넣어주고 변수를 하나 만들어서 거기에 n을 넣어주고반복문으로 i ≤ n 같은 떄 까지 i++ 올려주고 여기서 ..