원시타입으로는 number, bigint, string, boolean, null, undefined 와 symbol 총 7 개가 존재한다. 이들의 공통점은은 object 가 아니며, 따로 메서드(method) 를 가지지 않는다.
function App() {
const [todos, setTodos] = useState([
"일찍 일어나기",
"9시에 공부시작하기",
"자바스크립트 마스터하기",
]);
return (
<div>
{todos.map((todo, i) => {
return (
<div>
{i + 1}: {todo}
</div>
);
})}
<button
onClick={() => {
todos.push("밤새기");
setTodos(todos);
}}
>
밤새기 추가
</button>
</div>
);
}
기존 값을 변경하는 것이 아니라 새로운 복사본을 만든 후 spread operator을 통해 붙여줘야합니다
function App() {
const [todos, setTodos] = useState([
"일찍 일어나기",
"9시에 공부시작하기",
"자바스크립트 마스터하기",
]);
return (
<div>
{todos.map((todo, i) => {
return (
<div>
{i + 1}: {todo}
</div>
);
})}
<button
onClick={() => {
// todos.push("밤새기");
const copy = todos;
copy.push("밤새기");
setTodos(copy);
}}
>
밤새기 추가
</button>
</div>
);
}
function App() {
const [todos, setTodos] = useState([
"일찍 일어나기",
"9시에 공부시작하기",
"자바스크립트 마스터하기",
]);
return (
<div>
{todos.map((todo, i) => {
return (
<div>
{i + 1}: {todo}
</div>
);
})}
<button
onClick={() => {
// todos.push("밤새기");
// const copy = todos;
const copy = [...todos];
copy.push("밤새기");
console.log({ copy });
console.log(copy === todos);
setTodos(copy);
}}
>
밤새기 추가
</button>
</div>
);
}
저도 개발자인데 같이 교류 많이 해봐요 ㅎㅎ! 서로 화이팅합시다!