6일 차 진도 구조 분해 할당 배열이나 객체의 요소 및 프로퍼티들을 분해해, 그 값들을 각각의 변수에 할당하는 자바스크립트의 표현식 배열의 구조분해 할당 let colors = [“green”, “blue”, “purple”]; let [c1, c2, c3] = colors; console.log(c1); // green console.log(c2); // blue console.log(c3); // purple let c1, c2 , c3; // 선언 분리 할당 [c1, c2, c3] = “green”, “blue”, “purple” console.log(c1); // green console.log(c2); // blue console.log(c3); // purple 배열의 길이보다 적은 수의 값을..

개발 기간 23.11.17 ~ 23.12.09 완성품(?) 느낀 점 1. 설계를 잘해야겠다. flex를 뜯어고친 경험을 해보니, 애초에 설계를 잘하는 게 중요하다는 생각이 들었다. 기능을 추가하더라도, 큰 틀에서는 변화가 없게끔, 즉 즉흥적인 변경도 대응할 수 있는 틀을 잡고 시작하는 게 좋을 것 같다. (할 수 있다면...) 2. 멘토가 있으면 좋겠다. 최종적으로는 적용하지 못한 최적화 부분을 고민하면서 느낀 점이다. 질문을 할 수 있는 멘토가 있었으면 좋겠다. GPT도 많은 도움이 되지만, 프로젝트 전체를 복사해서 물어보는 것은 쉽지 않기 때문이다. 기회가 된다면 멘토를 찾고 싶다. 꼭 멘토가 아니더라도 물어보면서 성장할 수 있는 환경을 찾아봐야겠다. 3. 웹은 웹으로, 모바일은 모바일로 웹을 모바일..

5일 차 진도 배열 요소 순회 메서드 - foreach 매개변수로 함수를 전달(콜백함수), 콜백함수에는 3가지 매개변수 전달 let arr = [1,2,3,4,5]; arr.foreach((elm,idx,array)=>{ console.log(`${idx}번째 요소는 ${elm}입니다. `); // 0번째 요소는 1입니다 ~ 5까지 출력 console.log(array); // [1,2,3,4,5] } elm은 arr의 각 요소를 나타낸다. idx 선택적 매개변수, 요소의 인덱스를 나타내며, array은 실제 전달된 배열을 출력한다. - map 배열 안의 모든 원소를 변환할 때 유용하게 사용 let arr = [1,2,3,4,5]; let newArray = arr.map((elm)=> { return ..

4일 차 진도 배열 순서가 있는 요소들의 집합. 여러 개의 항목들이 모여 있는 리스트 배열 생성법 1. 생성자 let arr = new Array(); // [] let array1 = new Array1(1,2,3); // [1,2,3] let array2 = new Array2(3); // [undefined,undefined,undefined] 배열 생성자에 값을 할당 때는 특정 요소를 넣으려면 여러 개의 값을 넣으면 되고, 원하는 크기의 공간을 할당하려면 원하는 공간의 크기를 괄호 안에 작성해 주면 된다. 2. 배열 리터럴 let arr = []; // [] let array1 = [1,2,3] // [1,2,3] let array2 = [3] // [3] 배열 리터럴을 통해 배열을 생성하고, 배..

3일 차 진도 스코프란 범위, 변수 혹은 함수가 갖게 되는 유효범위 - 전역 스코프(Global Scope) let sum = 0; function add(num1, num2){ sum = num1 + num2; } add(10,15); console.log(sum); // 25 어디서든지 해당 변수에 접근 가능 - 지역 스코프(Local Scope) function add(num1, num2) { let sum = num1 + num2; return sum; } console.log(sum); 지역을 벗어난 곳에서는 접근 불가능 const num = 10; // 전역 스코프 function print() { const num = 100; // 지역 스코프 console.log(`지역 스코프 ${num}..

대망의 휴지통 마지막 시간입니다. 지우기, 초기화, 복구 순서로 진행할 것입니다. 지우기 아주 간단하게 끝낼 수 있습니다. TodoList의 지우기 로직과 완전히 동일합니다. Trash 컴포넌트에서 삭제 핸들러를 내려줍니다. TrashMainItem에서 id 값을 인수로 전달하며 핸들러를 실행시킵니다. id값에 해당하지 않는 요소만 반환하여 trash State를 업데이트시켜 줍니다. 마지막으로 trash값이 바뀔 때마다 localStorage에 업데이트 시켜주는 코드를 작성하면 끝입니다. 휴지통에서 '지우기'를 누르면 완전히 지워지는 것을 확인할 수 있습니다. 초기화 초기화 버튼을 누르면 모달창을 통해 경고를 띄울 것입니다. https://studysmart.tistory.com/99 리액트 간단한 모..