[프로그래머스 | javascript] 가장 큰 수 (정렬)

function solution(numbers) { let answer = numbers .map(number => number.toString()) .sort((a,b)=>(b+a)-(a+b)) .join('') return answer[0] ==='0' ? '0' :answer } 1. 숫자를 문자열로 변경하여 sort로 정렬하기 2. a=6 / b=10 일경우, '610'과 '106'을 비교해서 내림차순으로 큰 수가 앞에 오도록 정렬하기 .sort((a,b)=>(b+a)-(a+b)) 3. numbers [0,0,0]인 경우, 000으로 나와서 오류 => 0 처리하기 끝.

• format_list_bulleted JavaScript
• · 2024. 4. 14.
• textsms

리액트 : useState + onChange 중복 줄이기

1. 변경 전 코드 const [title, setTitle] = useState(''); const [content, setContent] = useState(''); const [selectedFile, setSelectedFile] = useState(''); const [previewFile, setPreviewFile] = useState(''); return ( setTitle(event.target.value)} placeholder="제목을 입력해주세요." maxLength={30} > { setContent(event.currentTarget.value); }} > : (selectedFile + previewFile은 동일해서 생략) ▶ useState + onChange 중복과 사용이..

• format_list_bulleted JavaScript
• · 2023. 12. 6.
• textsms

바닐라 자바스크립트 SPA

1) MPA와 SPA의 차이 설명 - MPA (2개 이상의 HTML 페이지로 구성된 어플리케이션) - SPA (1개의 HTML 페이지로 구성된 어플리케이션 : index.html만 있음) [SPA 장점] : 자연스러운 사용자 경험 ( 하나의 페이지여서 깜빡임 X, 자연스러운 페이지 이동) : 웹 성능 향상 ( 필요한 리소스만 받아 부분적 렌더링: 가벼운 객체데이터로 이동 가능) : 개발 생산성 향상 (컴포넌트별 개발 용이 / 협업 업무 분담, 유지보수) : API JSON의 부분만 집중해도 괜찮음. [SPA 단점] : 첫 랜딩 속도가 느림 (한번에 모든 파일 다운 => code splitting 고려 필요) : 검색엔진최적화(seo)에 취약함 2) 바닐라 JS로 SPA 만들 때 Hashed Routing..

• format_list_bulleted JavaScript
• · 2023. 11. 8.
• textsms

JS 5주차 정리 :: DOM | 클래스 | getters setters 개념 | 클래스 상속 | 클로저

1. DOM 소개 - JS 생긴 이유 : 브라우저에서 사용하기 위한 언어 - 사용자 = 브라우저 = 클라이언트 - 브라우저는 렌더링엔진(번역)을 갖고 있음 --> 코드를 해석함 - 렌더트리를 구성함 - 이 파일을 브라우저에게 제공 > 브라우저는 렌더링해서 페인팅해줌 > 돔 트리가 생성됨 (계층) 메뉴가 들어감 순서 없는 태그 안에 첫번째 메뉴 (리스트 태그) 두번째 메뉴 글자 이미지 copyright. 2. DOM _API 실습 - DOM : JS가 HTML 문서를 해석하고 파싱한 결과물 / 브라우저에 기본적으로 내장된 API임 - API : 메뉴판 같은 것. 다른 시스템에서 제공하는 기능을 사용할 수 있도록 도와주는 중간자 역할 - DOM은 브라우저 환경 (여기서 돌아감: DOM이 브라우저에 내장되어 ..

• format_list_bulleted JavaScript
• · 2023. 10. 17.
• textsms

JS 4주차 정리 :: 콜백함수 | 동기 & 비동기 | promise | 제네레이터 및 | async await

1. 콜백함수_기본개념 - 다른 코드의 인자로 넘겨주는 함수 / 인자로 넘겨주는 다는 것은 받는 곳이 있음 - forEach, setTimeout : 콜백함수를 적절한 시점에 실행하게 됨 (제어권이 forEach,setTime에게 있음) - 내일 약속이 있는데 알람 안 맞추고, 수시로 일어나서 시간 확인 하는 스폰지밥 (제어권 : 스폰지밥) - 제어권 넘겨줄테니 너가 알고 있는 그 로직으로 처리해줘! //콜백함수 예시1 setTimeout(function () { console.log("hello"); },1000); //콜백함수 예시2 const num = [1,2,3,4,5]; num.forEach(function (num) { console.log(num); }); 2. 콜백함수_제어권1 - 제어권..

• format_list_bulleted JavaScript
• · 2023. 10. 17.
• textsms

JS 3주차 정리 :: 호이스팅 | 실행컨텍스트 | record | this | 콜백함수 | call, apply,bind

5. null과 undefined - 값이 없는 겨우 - null : 개발자가 명시적으로 없다고 지정 - undefined : 변수에 값이 지정 안 됨 (메모리 주소 지정 x), 해당 데이터가 없을때, return문이 없는 함수 - ★(주의) typeof null = object -> js 자체 버그임 6. 실행컨텍스트 및 콜 스택 소개 - 실행컨텍스트 (스코프, 변수, 객체, 호이스팅) : 실행할 코드에 제공할 환경정보를 모아놓은 객체 (개발자가 작성한) (1) 선언된 변수를 위로 끌어올림 = 호이스팅 (2) 외부 환경 정보 구성 (3) this 값 설정 - 스택 (stack) : 바스켓 같음 (LIFO : last in first out) - 큐 (queue) : 원형 (FIFO : first in ..

• format_list_bulleted JavaScript
• · 2023. 10. 16.
• textsms