3. 화면에 반응성 더하기

사전과제

<aside> 💡 이전에 하셨던 것처럼 답변을 완성해 discussion에 업로드 하시면 됩니다. gpt 이용하셔도 상관없습니다. 대신 모든 답변에 대해서 이해하고 스터디에 참여하는 걸 권장 드립니다.

</aside>

일상생활에서 “상태(state)” 라는 개념이 사용되는 예시를 1가지 작성해주세요. 각 예시에서 “상태” 가 어떻게 변하고, 그 변화가 어떤 결과를 가져오는지 적어주시면 됩니다.
자신이 주로 사용하는 웹 페이지의 이름과, 그 웹 페이지에서 사용자의 입력에 따라 즉시 반응하는 요소들의 예를 3가지 작성해주세요. 각 요소가 어떤 사용자 행동에 반응하고, 어떻게 변화하는지 설명해주세요.
JavaScript로 작성된 다음 코드를 실행했을 때 console.log(x.count) 의 결과를 작성하고, 그 결과가 나온 이유를 작성해주세요.

let x = { count: 0 };
let y = x;
y.count = 1;
console.log(x.count);

2주차 스터디 도중 props의 특성 중 “불변성(immutability)”에 대해서 설명드렸습니다. 프로그래밍에서 불변성을 지키는 것이 중요할까요? 자신의 의견과 이유를 적어주세요.
JavaScript로 작성된 다음 코드를 실행했을 때 어떤 순서로 콘솔에 출력될 지 예측해보세요. 자신이 예측했던 결과와 그 이유, 그리고 실제 출력된 결과를 작성해주세요.

<aside> 💡 setTimeout(code, delay)함수는 delay 만큼의 시간이 지난 후 code 를 실행하는 함수입니다.

</aside>

console.log('시작');

setTimeout(() => {
  console.log('3초 후');
}, 3000);

setTimeout(() => {
  console.log('1초 후');
}, 1000);

console.log('끝');