본문 바로가기

javascript199

[JavaScript] && 과 ? 차이 자바스크립트에서 객체를 사용할 때 data && data.list.map 과 data?.list.map 을 사용하는 경우가 있다. 둘다 작동되는 것은 동일한데 어떤 경우에 뭘 사용하는게 좋을까? data && data.list.map && 는 data가 truthy한 값 ( null, undefined, false, 0, NaN, "" [ 빈문자열 ]이 아닌 값 )일 때 data.list.map을 실행한다. 여기서 data는 truthy한 값을 가지고 있지만 data.list가 없으면 data.list.map은 오류를 발생시킨다. data?.list.map ? 는 data가 null 또는 undefined가 아닌 경우에만 data.list.map을 실행시킨다. 만약 data는 존재하지만 data.list.. 2023. 11. 26.
[JavaScript] 자꾸 까먹는 e.preventDefault & e.stopPropagation 자바스크립트에서 이벤트는 아주 많이 사용되는 녀석이다. 사용된다고 말할 수준이 아닌 뺄 수 었는 녀석이다. 이때 JavaScript의 이벤트는 자식에서 부모로 전파가 된다. 이것을 버블링이라고 하는데, 조금 더 자세하게 설명하면 요소에 이벤트가 발생하면 제일 상단의 요소를 만날 때 까지 모든 이벤트를 전파시킨다. 또는 a 태그는 클릭하면 페이지를 이동시키고, form 태그는 내부 입력값을 전송한다. 이것은 자식 요소를 클릭해도 동일한 기능을 한다. 이러한 이벤트 전파를 막아버리는 것이 바로 e.preventDefault와 e.stopPropagation이다. e.preventDefault 앞서 이야기 했지만 form 태그나 a 태그는 각각 특수한 기능을 하고 있다. form은 form 안에 있는 입력 요.. 2023. 11. 11.
[JavaScript] ?, ! 자바스크립트에서 객체의 값을 사용할 때 객체가 존재하는지 확인하는 경우가 있다. const data = axios.get(~); const list = data && data.list; async await을 사용하는 방법도 분명 존재하지만 React Query를 사용하는 경우 isSuccess 가 되기 전까지 data는 null이 된다. React Query를 갑자기 꺼냈는데, 간단하게 async await을 사용하지 않는 경우를 말한 것이다. &&를 쓰는 행위 자체가 문제가 되지 않지만 이것을 더 간단하게 처리해줄 수 있다. ? 옵셔널 체이닝 옵셔널 체이닝은 중첩된 객체의 속성이 존재하는가에 대한 조건을 간단하게 처리할 수 있다. const data = axios.get(~); const list =.. 2023. 10. 7.
[알고리즘] n의 배수 문제 설명 정수 num과 n이 매개 변수로 주어질 때, num이 n의 배수이면 1을 return n의 배수가 아니라면 0을 return하도록 solution 함수를 완성해주세요. 제한 사항 2 ≤ num ≤ 100 2 ≤ n ≤ 9 입출력 예numnresult 98 2 1 34 3 0 입출력 예 설명 입출력 예 #1 98은 2의 배수이므로 1을 return합니다. 입출력 예 #2 32는 3의 배수가 아니므로 0을 return합니다. 나의 풀이 function solution(num, n) { return num % n === 0 ? 1 : 0; } 2023. 10. 1.
[알고리즘] 두 수의 연산값 비교하기 문제 설명 연산 ⊕는 두 정수에 대한 연산으로 두 정수를 붙여서 쓴 값을 반환합니다. 예를 들면 다음과 같습니다. 12 ⊕ 3 = 123 3 ⊕ 12 = 312 양의 정수 a와 b가 주어졌을 때, a ⊕ b와 2 * a * b 중 더 큰 값을 return하는 solution 함수를 완성해 주세요. 단, a ⊕ b와 2 * a * b가 같으면 a ⊕ b를 return 합니다. 제한 사항 1 ≤ a, b < 10,000 입출력 예 2 91 364 91 2 912 입출력 예 설명 입출력 예 #1 a ⊕ b = 291 이고, 2 * a * b = 364 입니다. 둘 중 더 큰 값은 364 이므로 364를 return 합니다. 입출력 예 #2 a ⊕ b = 912 이고, 2 * a * b = 364 입니다. 둘 .. 2023. 9. 30.
[알고리즘] 더 크게 합치기 문제 설명 연산 ⊕는 두 정수에 대한 연산으로 두 정수를 붙여서 쓴 값을 반환합니다. 예를 들면 다음과 같습니다. 12 ⊕ 3 = 123 3 ⊕ 12 = 312 양의 정수 a와 b가 주어졌을 때, a ⊕ b와 b ⊕ a 중 더 큰 값을 return 하는 solution 함수를 완성해 주세요. 단, a ⊕ b와 b ⊕ a가 같다면 a ⊕ b를 return 합니다. 제한 사항 1 ≤ a, b < 10,000 입출력 예 9 91 991 89 8 898 입출력 예 설명 입출력 예 #1 a ⊕ b = 991 이고, b ⊕ a = 919 입니다. 둘 중 더 큰 값은 991 이므로 991을 return 합니다. 입출력 예 #2 a ⊕ b = 898 이고, b ⊕ a = 889 입니다. 둘 중 더 큰 값은 898 이므.. 2023. 9. 29.
[알고리즘] 문자열 곱하기 문제 설명 문자열 my_string과 정수 k가 주어질 때, my_string을 k번 반복한 문자열을 return 하는 solution 함수를 작성해 주세요. 제한 사항 1 ≤ my_string의 길이 ≤ 100 my_string은 영소문자로만 이루어져 있습니다. 1 ≤ k ≤ 100 입출력 예 "string" 3 "stringstringstring" "love" 10 "lovelovelovelovelovelovelovelovelovelove" 입출력 예 설명 입출력 예 #1 예제 1번의 my_string은 "string"이고 이를 3번 반복한 문자열은 "stringstringstring"이므로 이를 return 합니다. 입출력 예 #2 예제 2번의 my_string은 "love"이고 이를 10번 반복한.. 2023. 9. 28.
[알고리즘] 원소들의 곱과 합 문제 설명 정수가 담긴 리스트 num_list가 주어질 때, 모든 원소들의 곱이 모든 원소들의 합의 제곱보다 작으면 1을 크면 0을 return하도록 solution 함수를 완성해주세요. 제한 사항 2 ≤ num_list의 길이 ≤ 10 1 ≤ num_list의 원소 ≤ 9 입출력 예 [3, 4, 5, 2, 1] 1 [5, 7, 8, 3] 0 입출력 예 설명 입출력 예 #1 모든 원소의 곱은 120, 합의 제곱은 225이므로 1을 return합니다. 입출력 예 #2 모든 원소의 곱은 840, 합의 제곱은 529이므로 0을 return합니다. 나의 풀이 function solution(num_list) { var answer = 0; let num1 = 0; let num2 = 1; num_list.for.. 2023. 9. 26.
[알고리즘] 멀리 뛰기 문제 설명 효진이는 멀리 뛰기를 연습하고 있습니다. 효진이는 한번에 1칸, 또는 2칸을 뛸 수 있습니다. 칸이 총 4개 있을 때, 효진이는 (1칸, 1칸, 1칸, 1칸) (1칸, 2칸, 1칸) (1칸, 1칸, 2칸) (2칸, 1칸, 1칸) (2칸, 2칸) 의 5가지 방법으로 맨 끝 칸에 도달할 수 있습니다. 멀리뛰기에 사용될 칸의 수 n이 주어질 때, 효진이가 끝에 도달하는 방법이 몇 가지인지 알아내, 여기에 1234567를 나눈 나머지를 리턴하는 함수, solution을 완성하세요. 예를 들어 4가 입력된다면, 5를 return하면 됩니다. 제한 사항 n은 1 이상, 2000 이하인 정수입니다. 입출력 예 4 5 3 3 일출력 예 설명 입출력 예 #1 위에서 설명한 내용과 같습니다. 입출력 예 #2 (.. 2023. 9. 24.
반응형

티스토리툴바