반응형 프론트엔드2 [JS ES6] 자바스크립트 구조 분해 할당(Destructuring assignment) [JS ES6] 자바스크립트 구조 분해 할당(Destructuring assignment) 🧐 JS 구조 분해 할당(Destructuring assignment)이란? 개발할 때 키를 가진 데이터 여러 개를 하나에 저장할 땐 객체를, 데이터를 순서대로 저장할 땐 배열을 사용한다. 이 배열과 객체의 전체 또는 일부를 함수로 전달해야 할 때 사용한다. 구조 분해 할당(Destructuring assignment)을 통해 객체나 배열을 '변수'로 분해할 수 있게 도와주는 특별한 문법인 것이다. 1. 배열(Array) 안에 있는 데이터를 변수에 담는 방법 1-1. 기존 방법 // 배열 안에 있던 데이터를 변수에 담는 기존 방법 const arr = [1,2,3]; const a = arr[0]; const b .. 2022. 8. 5. [React 기초] JSX 문법 01 - className, 자바스크립트 값을 JSX 안에 렌더링(콧수염괄호), inline style React 기초 JSX 문법 01 - className, 자바스크립트 값을 JSX 안에 렌더링(콧수염괄호), inline style JSX란? JSX는 문자열도, 태그도 아닌 JavaScript에서 XML문법을 추가 확장한 문법이다. 리액트에서 JSX 사용은 필수가 아니지만, 대부분 사용하는 이유는 자바스크립트 내에서 HTML 작성하듯 비슷하게 작성할 수 있는 장점으로 많이 사용하고 있다. JSX는 브라우저에서 실행하기 전에 코드가 번들링되는 과정에서 바벨을 사용하여 일반 자바스크립트 형태의 코드로 변환된다. 1. className 일반 html 태그에서 class를 추가할 때에는 text 위와 같이 어트리뷰트 이름을 쓰는 것이 맞으나, React JSX 문법은 카멜케이스(camelCase) 프로퍼티 명.. 2022. 8. 2. 이전 1 다음 반응형
