#3.1 setState part One

HeeDong-log·2023년 5월 25일
0

const App = () => {
const [counter, setCounter] = React.useState(0);
const onClick = () => {
setCounter((current) => current + 1);
};
return ();
};

함수형을 쓸때와 화살표 함수형을 쓸 때 표현식의 차이는 위 아래와 같다.

function App() {
const [counter, setCounter] = React.useState(0);
const onClick = () => {
setCounter((current) => current + 1);
};
return ();
}

구조분해할당

보통 배열을 선언할 때 const box = ['pen', 'speaker', 'books'] 이렇게 하지만
이걸 꺼내서 쓰고 싶을 때는 구조 분해 할당을 쓴다. 방법은 그냥 뒤집기만 하면 되는데,

const [a, b, c] = box;

a 를 찍으면 'pen' 이 나오고 b를 찍으면 'speaker'가 나오고 c를 찍으면 'books'가 나온다. 이때의 a,b,c는 일회성으로 한 번 쓰고 사라지는 게 아니라 구조 분해 할당을 통해 변수로 선언한 것이기 때문에 a,b,c는 여러 번 사용할 수 있게 된다.(이때 주의해야 할 점은 구조 분해 할당을 할 때 ''따옴표를 사용하지 않는 것이다. 구조 분해 할당은 변수 선언이기 때문에 const 'x' = 1 변수 선언을 이렇게 하지 않는 것처럼 따옴표를 쓰지 않는다.)

구조 분해 할당 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식이다. [MDN]

profile
포기하지 않는 코딩 생활-!

0개의 댓글