제로하우스

Event Handling React의 이벤트 처리 방식은 DOM의 방식과 유사하나, 몇 가지의 문법 차이가 존재한다. 이벤트는 camelCase를 사용한다. JSX를 사용하여 문자열이 아닌 함수로 event handler(이벤트 처리 함수)를 전달한다. Event // React 방식 Event Event onChange , , 와 같은 form 엘리먼트에서는 사용자의 입력 값을 제어하는데, 이렇게 값이 변경될 때 발생하는 이벤트이다. onChange 이벤트가 발생하면 event.target.value를 통해 이벤트 객체에 담겨 있는 iput 값을 가져올 수 있다. function NameForm () { const [name, setName] = useState("") const handleChang..

Overview React에서 데이터를 전달하는 방법에 대해서 다룬다. props 부모 컴포넌트가 자식 컴포넌트에 값을 전달할 때 사용한다. 컴포넌트의 속성(property)를 의미한다. 성별, 이름처럼 변하지 않는 외부로부터 전달받은 값이다. 상위 컴포넌트로부터 전달받은 값이다. 객체 형태로 어떤 타입의 값도 props에 넣어서 전달할 수 있다. 읽기 전용(read-only)이다. props 사용하기 하위 컴포넌트에 전달하고자 하는 값(data)과 속성을 정의한다. function Parent() { return ( I am parent. ); }; function Child() { return ( ); }; 2. props를 이용하여 정의된 값과 속성을 전달한다. function Parent() { ..

코드스테이츠의 블록체인 부트캠프 5기 - 시작한지 12일째(2022년 5월 13일) 📌 Today I Learned 재귀 함수 JSON: JSON.stringify(), JSON.parse() 📌 Reflection 처음부터 페어와 함께 과제를 진행하니 시간이 많이 걸렸다. --> 혼자 코드를 작성할 때 퍼포먼스가 잘 나온다. JSON.stringfiy() 함수를 직접 작성하는 과제를 했는데, 아직까지 javascript 메서드를 자유자재로 사용하지 못 하고 있는 것 같다. 한편 javascript가 정말 편한 언어라는 것도 사용을 해볼수록 많이 느끼고 있다. 📌 Pair 목소리가 엄청 차분하신 분이었다. 문제가 발생했을 때도 검색을 하며 차분히 대응하는 모습이 좋았다.

JavaScript에서 문자열을 숫자로 변환하려는 경우, Number()를 사용한다. Number(str) 숫자가 아닌 문자나 undefined 등을 인자로 전달하면 NaN(Not A Number)를 리턴한다. const integer = Number('512') const float = Number('5.12') const str = Number('five') const und = Number(undefined) console.log(integer + '의 타입은 ' + typeof integer) // --> 512의 타입은 number console.log(float + '의 타입은 ' + typeof float) // --> 5.12의 타입은 numbe console.log(str + '의 타입은..

JavaScript에서 배열을 자르려는 경우, arr.splice(시작점)을 사용한다. arr.splice(start, (deleteCount)) deleteCount를 입력하지 않으면 start부터의 모든 요소를 제거하게 된다. arr1 = [1, 2, 3, 4] console.log(arr1.splice(1)) // --> [2, 3, 4] console.log(arr1) // --> [1] arr2 = [5, 6, 7, 8] console.log(arr2.splice(1, 2)) // --> [6, 7] console.log(arr2) // --> [5, 8]