[React] 리액트<input> 태그의 값에 접근, 'Enter' 키 이벤트 enter key event javascript
·
Web/JavaScript
정답을 제출할 때, 엔터키를 눌러도, 제출 버튼을 눌러도 input 태그 안의 내용이 제출될 수 있도록 해야했다.1. input 태그의 값을 Hook으로 관리2. input이 입력될 때마다 State를 업데이트3. input tag의 onKeyDown 이벤트 핸들러를 설정하여 엔터키를 누를 시 값이 제출되도록 설정4. 제출 버튼에 onClick 이벤트 핸들러를 설정하여 값이 제출되도록 설정1. 'input' 태그의 값을 관리할 useState훅을 선언1. useState 훅을 사용하여 입력된 값을 관리할 State를 선언```javascriptimport { useState } from 'react';const ShortAnswer = () => { const [answer, setAnswer] = u..
[JS] 자바스크립트 속성 접근자 점 표기법(Dot Notation) vs 괄호 표기법(Bracket Notation)
·
Web/JavaScript
개요JavaScript에서 Object에 접근하는 방법은 Dot Notation(점 표기법) , Bracket Notation(대괄호 표기법) 두 가지가 존재함점 표기법(Dot Notation)객체 뒤에 마침표와 속성 이름을 지정하여 객체의 속성에 접근const person = {name :'John' ,age :25 ,address : {city :'New York' ,state :'NY' }};console .log(person.name) ;// 출력: Johnconsole .log(person.address .city) ; // 출력:NewYork장점가독성이 좋다, 객체 지향 프로그래밍에 익숙한 개발자에게는 더 쉽다.깔끔하고 간결한 구문을 제공, 코드 작성과 유지 관리가 더 쉽다.대괄호 표기법보..