React
-
React.js (리액트) JSX?React.js (리액트) 를 시작하자./React (리액트)란? 2024. 1. 30. 23:29
JSX? JSX는 JavaScript XML의 약자이다. JSX코드는 자바스크립트 파일에 작성된 HTML 코드를 의미한다. 쉽게 풀어보면, JSX = JavaScript XML = 자바스크립트 안에 있는 HTML(XML)코드이다. 리액트는 빌드 프로세스를 사용하는데 처리되지 않은 리액트 코드는 브라우저에서 실행 할 수 없다. 그래서 리액트 코드는 특별한 JSX 기능을 사용하여 작업한다. 리액트는 JSX 코드를 실제 DOM으로 렌더링한다. JSX 코드에 자바스크립트 표현식도 쓸 수있다. = { } 사용이 가능하다. JSX의 한계 JavaScript에서 함수는 단일 값만 반환한다. ( 한개만 리턴한다는 말이다.) 이 특성을 JSX와 React컴포넌트에서도 그대로 적용되기 때문에 루트 JSX도 단일 요소 하나..
-
Spread 스프레드 연산자리액트에서 알아야할 자바스크립트 문법/Spread 스프레드 연산자 2024. 1. 25. 02:35
스프레드 연산자에 대해 쉽게 알아보자. 스프레드 연산자(Spread Operator)는 이름이 거창하지만, " . . . " 를사용한다. 쉽게 " . . . " 를 사용한다는것은 "요소를 펼쳐 놓겠다" 란 의미로 이해해보자. 이말은 배열이나 객체의 모든 요소를 개별적으로 분리하여 사용할 수 있게 해주겠다란 말이다. [ ] 배열에서의 스프레드 연산자 사용 배열에서 스프레드(...)를 사용하면 기존 배열에 새로운 요소를 추가하여 새로운 배열을 만들어준다. 이해하기 const oldArray = [1, 2, 3]; // 기존 배열 const newElement = 4; // 추가하고 싶은 새 요소 const newArray = [...oldArray, newElement]; // newArray의 값은 : '..