Reat 6 To-Do-List (preventDefault(), trim(), JSX에서 JS 내장함수 사용하기)

  강의를 보면서 To-Do-List를 만들며 새롭게 알게 된 것들을 기록한 페이지 입니다.

 

event.preventDefault()

 -  preventDefault()메서드는 어떤 이벤트를 명시적으로 처리하지 않은 경우, 해당 이벤트에 대한 사용자 에이전트의 기본 동작을 실행하지 않도록 지정할 때 사용한다.

 

---

str.trim()

  trim() 메서드는 문자열 메서드이며 문자열의 양끝의 공백(공백문자와 개행문자)를 저거한 후 수정하지 않고 반환한다.

 

---

JSX에서 JS 내장함수 사용하기

 - {}안에 작성을 하면 사용할 수 있는데 => 이후 JS에선 {}(중괄호)를 사용하지만 JSX에서는 {}(중괄호)는 JS를 작성할 수 있게 해주는 공간이므로 ()(소괄호)를 사용해야 된다.

 

예)

// JS와 JSX의 차이를 확인하세요~~ 확실히 JSX가 편함.
// JS map으로 리스트 부르기
toDos.map((item, index) => {
  console.log(item, index);
})

// JSX map으로 리스트 붙이기
{toDos.map((item, index) => (
  <li key={index}>{item}</li>
))}

 

---

공부 내용 작성 코드 github 주소

공부한 곳! - 노마드 코더 'ReactJS로 영화 웹 서비스 만들기'