리액트에서 form 컴포넌트를 사용해 데이터를 서버로 전송하는 과정을 공식문서를 바탕으로 정리해보려 한다. 먼저, form 컴포넌트는 built-in 컴포넌트로 다음과 같이 사용할 수 있다. Submit textarea를 form 태그로 감싸면 버튼을 클릭했을 때 onSubmit 이벤트 핸들러가 호출된다. 리액트 공식문서에 제공된 이벤트 핸들러 코드는 다음과 같다.이벤트가 발생한 타깃의 값을 가져와 new FormData()로 FormData 객체를 생성한 뒤 body에 담아 전송하는 방식이다.function handleSubmit(e) { // Prevent the browser from reloading the page e.preventDefault(); ..
TIL/javascript
자바스크립트에서 splice()는 배열의 요소를 추가, 제거하거나 교체할 때 유용하게 쓰이는 메소드이다.array.splice(start, deleteCount, [item1, item2, ...])start: 시작 인덱스음수인 경우 배열의 끝에서부터 세어나감배열의 길이보다 큰 경우 0으로 간주deleteCount: 제거할 요소의 개수0이면 제거되지 않음생략하면 배열의 끝까지로 간주item1, item2, ...: 배열에 추가할 요소지정하지 않으면 삭제 기능만 수행 1. 요소 삭제2번 인덱스에서부터 2개의 요소를 삭제한다.** splice 메소드는 삭제된 요소를 반환한다.let array = ['a', 'b', 'c', 'd', 'e'];let removed = array.splice(2, 2); con..
자바스크립트에서 문자열을 원하는 만큼 반복시키고 싶으면 repeat 함수를 사용할 수 있다.파이썬에서 문자열에 *를 사용하는 원리와 같다.str.repeat(n) 이때, n은 0 이상의 양수이어야 하며 양의 무한대보다 작아야 한다.그렇지 않으면 RangeError가 발생할 수 있다. 'hello'.repeat(3); // 3번 -> 'hellohellohello''hello'.repeat(1.7); // 1번 -> 'hello''hello'.repeat(5.2); // 5번 -> 'hellohellohellohellohello''hello'.repeat(0); // 0번 -> '' n이 소수인 경우에는 소수점 아래는 버리고 정수 부분만큼만 반복한다.또한, n=0이면 결과값이 빈 문자열이 되는 ..
자바스크립트에서 sort 함수는 아래와 같이 사용한다.array.sort([Compare Function]) 이때, 대괄호는 필요에 따라 생략이 가능함을 의미한다. 따라서, Compare Function 없이 sort 함수를 사용할 수 있다.let arr = [1, 5, 4, 2, 3];arr.sort();console.log(arr); // [1,2,3,4,5]let arr = ['b', 'e', 'd', 'a', 'c'];arr.sort();console.log(arr); // ['a', 'b', 'c', 'd', 'e'] 한 자리의 숫자 또는 문자열 정렬이 완벽하게 되고 있다. 하지만, 두 자리의 숫자 또는 문자열을 정렬한다면 결과가 어떻게 될까?let arr = [27, 8, 5, 13];ar..
