자바스크립트 썸네일형 리스트형 [React]map 함수로 만든 메뉴에 개별 이벤트 걸기 - map으로 메뉴를 만들고 개별로 아코디언 메뉴 만들때 이벤트 걸어주기 import { useState } from "react"; const MenuArray = [ { title:"메뉴1" }, { title:"메뉴2" }, { title:"메뉴3" }, { title:"메뉴4" }, ]; const Test = () => { const [activeIndex, setActiveIndex] = useState(-1); const handleToggleMenu = (index) => { setActiveIndex(index === activeIndex ? -1 : index); }; return( {MenuArray.map((item, index) => handleToggleMenu(index)} >.. 더보기 [JavaScript]JS의 Number 속성 소수점 제어 JavaScript에서 Number를 제어하다보면 소수점이 나오는 경우가 있는데 이 때 간단하게 해당하는 소수점을 제어 할 수 있는 객체가 있습니다. - Math 사용 Math.ceil(Number) // 소수점 올림. 정수 반환 Math.floor(Number) // 소수점 버림. 정수 반환 Math.round(Number) // 소수점 반올림. 정수 반환 위와같은 객체를 활용하여 JavaScript의 소수점을 제어할 수 있습니다. - Math.ceil(Number) 사용 먼저 소수점을 올리는 예제를 보겠습니다. const a = 5; const b = 3; const c = 6; const d = 5; console.log(a/b); // 결과 : 1.6666666666666667 console.lo.. 더보기 [JavaScript]Front로 가기위한 나만을 위한 JS 기초다지기-데이터 타입 해당 post 는 모던 자바스크립트 Deep Dive 책에 있는 내용을 인용한 post 입니다. 모던 자바스크립트 Deep Dive / 위키북스 이웅모 지음 숫자 타입 C나 JAVA의 경우 정수(소수점 이하가 없는 숫자), 실수(소수점 이하가 있는 숫자)가 구분되어서 int, long, float, double 등과 같이 다양한 숫자 타입을 제공합니다. 하지만 JavaScript의 경우 독특하게 하나의 숫자타입만 존재합니다. ECMAScript 사양에 따르면 숫자 타입의 값은 배정밀도 64비트 부동소수점 형식을 따릅니다. 즉 모든 수를 실수로 처리하며, 정수만 표현하기 위한 데이터 타입이 별도로 존재하지 않습니다. var integer = 10; // 정수 var double = 10.12; // 실수 .. 더보기 [JavaScript]변수에 할당 된 데이터 타입 조회 방법 JavaScript 데이터 타입 조회 방법 typeof “조회할 변수명” // 변수에 할당된 값 데이터 타입 체크 방법 var abc; console.log(typeof abc); // undefined; abc = 10; console.log(typeof abc); // number; abc = 'Hello'; console.log(typeof abc); // string; abc = true; console.log(typeof abc); // boolean; abc = null; console.log(typeof abc); // object; abc = Symbol(); console.log(typeof abc); // symbol; abc = {}; console.log(typeof abc); //.. 더보기 [React]filter, map, react-router-dom v6 활용기 filter 그리고 map 개인적으로 까먹지 않기 위해 기록한 코드입니다!!! 해당 코드가 무조건 맞는 것은 아닙니다! 분명 제가 작성한 코드보다 더 안전하면서 깔끔한 코드를 작성하신 분이 있을겁니다…. 개인적인 포트폴리오를 업그레이드 하는 중 NAS 를 집에 들여놓기엔 초기셋팅비용이 부담스럽고 서버를 대여하자니 현재로썬 그냥 단순하게 업그레이드하는 수준이라 그냥 DB를 사용하지 않고(?) github Page를 활용하기로 했습니다. React라면 REST API라도 사용해봐야하는데… JSON 대신 배열 컴포넌트를 활용하여 화면 구성을 진행하고 있습니다… 이상하게 꼬인 컴포넌트 구조 작성한 컴포넌트와 코드들입니다. 무작정 작성하며 나누다보니 이상하게 꼬인 경향이 있습니다… App.js에 Route를 모두.. 더보기 이전 1 다음
