function App() {
let [글제목,글제목변경] = useState(['남자 코트 추천','강남 우동맛집','파이선독학']);
return(...
{ 글제목[0] } <button onClick={()=>{
let copy = [...글제목]
console.log(copy === 글제목)
copy[0] = '여자 코트 추천'
console.log(copy)
글제목변경(copy)
console.log(글제목)
}}>change</button>
...)
}
--------------------
console로 처음 찍어보면
console.log(copy === 글제목) //false
console.log(copy) // ['여자 코트 추천', '강남 우동맛집', '파이선독학']
글제목변경(copy)
console.log(글제목)// ['남자 코트 추천', '강남 우동맛집', '파이선독학']
--------------
console로 두번째로 찍어보면
console.log(copy === 글제목) //false
console.log(copy) // ['여자 코트 추천', '강남 우동맛집', '파이선독학']
글제목변경(copy)
console.log(글제목)// ['여자 코트 추천', '강남 우동맛집', '파이선독학']
-------------------
이렇게 변경이 되어있습니다.
제 로직에서는 첫 번째 console 출력에서
console.log(copy) // ['여자 코트 추천', '강남 우동맛집', '파이선독학']
글제목변경(copy)
console.log(글제목)// ['남자 코트 추천', '강남 우동맛집', '파이선독학']
글제목변경안에 copy 배열 넣었으니 처음 전역?에서 선언 해준
let [글제목,글제목변경] = useState(['남자 코트 추천','강남 우동맛집','파이선독학']);
여기서 글제목이 = ['여자 코트 추천', '강남 우동맛집', '파이선독학'] 이렇게
되어
마지막 console.log(글제목)에서
['여자 코트 추천', '강남 우동맛집', '파이선독학'] 이렇게 나와야 한다고 생각하는데
아닙니다.
두번 째 console 출력해야 비로소
['여자 코트 추천', '강남 우동맛집', '파이선독학'] 이렇게 나오는데
이유가 무엇일까요 ??