목록Javascript + Typescript (375)
치춘짱베리굿나이스
e.currrentTarget vs e.target input 태그에서 값을 받아올 때 맨날 e.target만 사용했었는데 e.currentTarget의 존재를 프리온보딩 피드백을 받으며 처음 알게 되었다 input 태그는 자식 태그가 없고 보통 onChange를 통해 값의 변화만을 추적하기에 망정이지 다른 태그에서 무지성으로 e.target만을 사용했으면 큰일날 뻔 했다... 라고 반성을 좀 했다 ㅡ,,ㅡ;; 값 비교 const handleClick = (e) => { console.log(e.target); console.log(e.currentTarget); } bbb aaa ccc 위와 같은 컴포넌트가 있다고 가정하자 컴포넌트는 bbb 영역과 aaa 영역, ccc 영역으로 나눠진다 aaa 영역과 ..
spread 문법 배열 또는 객체 안에 있는 내용물들을 전개하는 역할을 한다 배열에 스프레드 구문을 사용할 경우, 배열을 감싸는 대괄호가 사라지고 내용물만이 반환된다 배열 스프레드를 이용하여 배열 합치기 let arr1 = [var1, var2, var3]; let arr2 = [...arr, var4, var5]; //[var1, var2, var3, var4, var5] let arr3 = [...arr, ...arr] //[var1, var2, var3, var1, var2, var3]; 스프레드 구문은 한 배열을 만들 때 여러 번 사용 가능하다 객체 스프레드를 이용하여 객체 합치기 let obj1 = { var1: 'hello', var2: 'good afternoon'..
비구조화 할당 / 구조분해 할당 배열이나 객체의 속성을 해체하여 개별 변수에 그 값을 담을 수 있는 문법 구조를 분해해서 각각의 원소를 할당하기 때문에 구조분해 또는 비구조화 할당이라고 불린다 쉽게 말하면 오른쪽의 배열 / 객체 원소를 왼쪽의 [] 또는 {} 로 감싸진 변수들에 각각 할당해주는 문법이다 배열 비구조화 할당 let [a, b] = [1, 2] // a = 1, b = 2 좌측 배열의 길이와 우측 배열의 길이가 같을 경우, 순서대로 일대일 대응한다 let [a, b, c] = [1, 2, 3, 4, 5] // a = 1, b = 2, c = 3 좌측 배열의 길이가 우측 배열의 길이보다 짧을 경우, 좌측 배열 기준으로 값을 할당한다 let [a, b, c] = [1, 2]; // a = 1, ..
undefined Boolean(undefined) //false Number(undefined) //NaN String(undefined) //"undefined" 선언은 되었지만 값이 할당되지 않은 상태 ⇒ 초기화하지 않은 변수 Boolean 문맥에선 false 반환 Number 문맥에선 NaN 반환 null Boolean(null) //false Number(null) //0 String(null) //"Number" 아무런 값도 나타나지 않음 값 자체가 없다는 뜻 (undefined) 이 아니라 값은 존재하지만 어떠한 유효한 값도 아니라는 뜻 Boolean 문맥에선 false 반환 Number 문맥에선 0 반환 NaN Boolean(NaN) //false Number(NaN) //NaN Strin..
긴자리 계산 문제 두 수 A, B를 입력받아, A+B, A-B, A×B를 구하는 프로그램을 작성하시오. 입력 첫째 줄에 A가, 둘째 줄에 B가 주어진다. 각각의 수는 10진수로 1,000자리를 넘지 않으며 양수와 음수가 모두 주어질 수 있다. 출력 첫째 줄에 A+B, 둘째 줄에 A-B, 셋째 줄에 A×B를 출력한다. 각각을 출력할 때, 답이 0인 경우를 제외하고는 0으로 시작하게 해서는 안 된다(1을 01로 출력하면 안 된다는 의미). 풀이 const bigint = () => { let input = require("fs") .readFileSync("/dev/stdin") .toString() .trim() .split("\\n") .map(BigInt); console.log( `${input[0]..
쿼드트리 문제 흑백 영상을 압축하여 표현하는 데이터 구조로 쿼드 트리(Quad Tree)라는 방법이 있다. 흰 점을 나타내는 0과 검은 점을 나타내는 1로만 이루어진 영상(2차원 배열)에서 같은 숫자의 점들이 한 곳에 많이 몰려있으면, 쿼드 트리에서는 이를 압축하여 간단히 표현할 수 있다. 주어진 영상이 모두 0으로만 되어 있으면 압축 결과는 "0"이 되고, 모두 1로만 되어 있으면 압축 결과는 "1"이 된다. 만약 0과 1이 섞여 있으면 전체를 한 번에 나타내지를 못하고, 왼쪽 위, 오른쪽 위, 왼쪽 아래, 오른쪽 아래, 이렇게 4개의 영상으로 나누어 압축하게 되며, 이 4개의 영역을 압축한 결과를 차례대로 괄호 안에 묶어서 표현한다 위 그림에서 왼쪽의 영상은 오른쪽의 배열과 같이 숫자로 주어지며, 이..
별 찍기 - 11 문제 예제를 보고 규칙을 유추한 뒤에 별을 찍어 보세요. 입력 첫째 줄에 N이 주어진다. N은 항상 3×2k 수이다. (3, 6, 12, 24, 48, ...) (0 ≤ k ≤ 10, k는 정수) 출력 첫째 줄부터 N번째 줄까지 별을 출력한다. 풀이 const recurStar = (n) => { if (n === 3) return [" * ", " * * ", "*****"]; const ret = recurStar(n / 2); let arr = []; for (let j of ret) arr.push(" ".repeat(n / 2) + j + " ".repeat(n / 2)); for (let j of ret) arr.push(j + " " + j); return arr; }; c..
등록 문제 자신이 백준 온라인 저지(BOJ)에서 맞은 문제의 수와 아이디를 그대로 출력하는 프로그램을 작성하시오. 입력 이 문제는 입력이 없다. 출력 첫 줄에 자신이 맞은 문제의 수, 둘째 줄에 아이디를 출력한다. 풀이 const baekjoon = () => { console.log("208\nchichoon"); }; baekjoon(); 반성회 함수형을 선호해서 그렇지 console.log("208\nchichoon"); 한줄로도 됨