콛 다이어리

props 너무 어렵다..친하게 지내고싶다.. 숙련 강의랑 블로그 몇 개를 봤는데 데이터를 던져주는 곳에서는이렇게 하는데,던질 변수명은 내 마음대로 정해도 된다고 한다. 데이터를 잡는 곳에서는{props.잡을 변수명}이렇게 하는데잡을 변수명은 데이터를 던져주는 곳에서 사용한변수명을 사용하면 된다.

올림픽 메달 트레커의 메달 인풋 3개에정규 표현식을 사용하려고 했다.메달 갯수 입력하는 텍스트 박스이기 때문에숫자만 입력할 수 있게 하고싶었다.  정규표현식 (regex):pattern/flag로 표현test(string) 함수는 인자로 전달된 문자열이정규표현식의 패턴과 일치하면 true를 리턴하며그렇지 않으면 false를 리턴 ^ : 문자열의 시작[ㄱ-ㅎ|가-힣|a-z|A-Z|0-9|]:한글, 소문자 영어, 대문자 영어, 숫자에 해당하는 문자 1개+: 문자 1개 이상$: 문자열의 끝  1. 숫자만 입력되는 정규식/[^0-9]/gi 2. 영문만 입력되는 정규식/[^a-z]/gi 3. 한글만 입력되는 정규식/[a-z0-9]|[ \[\]{}()?|`~!@#$%^&*-_+=,.;:\"'\\]/g 4. 숫자, ..

알고리즘 한 문제를사흘동안 잡고있는 건아닌 것 같아서다른사람이 푼 문제로 공부를 했다. 분명 자바스크립트로 설정했는데누가 for문 초기 설정을 let없이사용했다.. i=0 이렇게;; 잠이 덜깼나? 싶었는데 아니었고튜터님한테 여쭤봤는데 그냥 찾아봐라하셨다. 찾아보니까let을 안 써도 작동이 된다고 한다.오래 전 자바스크립트 문법과의 호환성을 위해남겨둔 것이라고 하고, 문제가 되지 않는다고 한다.이렇게 쓰면 strict mode에서는 오류가 발생하기 때문에항상 let 을 써주시는 것을 권장한다고 한다.  출처: https://velog.io/@hyungjungson/230523-%EA%B0%9C%EB%B0%9C%EC%9D%BC%EC%A7%80-TIL-for%EB%AC%B8%EC%97%90-let%EC%97%..

// 국가명  const [nation, setNation] = useState("");  // 금메달 수  const [goldMedal, setGoldMedal] = useState(0);  // 은메달 수  const [silverMedal, setSilverMedal] = useState(0);  // 동메달 수  const [bronzeMedal, setBronzeMedal] = useState(0);  /* 사용자가 입력한 각 메달 수 넣을 배열 */  const [userData, setUserData] = useState([]);여기는 쉽게 작성했다.useState는 const [상태 함수, 상태 변경 함수] = useState(초기값);이렇게 사용한다.상태 변경 함수는 말 그대로 함수이다..

전에 팀플 할 때는앞에 동사를 넣기도 했거나'Func'를 넣기도 했는데튜터님이나 강의를 하는 사람들 대다수는'handle', 'set' 이나 'get'을 넣어서호기심에 검색해 보았다. 사실 전에 같은 조였던 분이변수/ 함수명 추천 사이트를 알려주시긴 했는데아무래도 내가 직접 만드는 게 좋을 것 같아서지운지 오래다.베이직반에 있던 노션 내용을 추가해서정리해보았다.   1. 동작을 설명하는 이름을 사용한다.함수명은 함수가 수행하는 동작이나 작업을 잘 설명해야코드를 읽는 사람이 함수가 어떤 일을 수행하는지쉽게 이해할 수 있음    ex1) displayErrorMessage(message)           오류 메시지를 표시하는 함수    ex2) updateUserProfile(userData)      ..

알고리즘 문제 푸는데 자꾸 에러가 떴다. 'Cannot read property of undefined'  처음에는 내가 100% 맞을거라는생각에 찾아보지 않았는데두번째 뜨니까 궁금해서 찾아봤다. 에러가 뜬 이유는 변수나 객체가 선언되었지만초기화하지 않았을 경우였다. let x;로 초기화를 해준 뒤, 바로console.log(x)로 참조하는 등 하지만 나는 함수를 사용하고 있었기 때문에return문을 사용하지 않아서였다.  어떻게 함수를 사용할 때마다 까먹는지앞으로 좀 신경써서 사용해야 겠다.

알고리즘 문제를 푸는데if문과 switch - case문 모두를 사용할 수 있는문제가 있었다. if문으로 쓸까 했는데오랜만에 switch - case문 써보자 해서switch - case문을 사용해봤는데헷갈리는 부분이 있어서 다시 공부해본다.   if문과 switch - case문을 사용하는 경우1. 조건문에서 비교할 초이스(값)이 많은 경우    1) switch문을 이용하면 가독성을 높일 수 있다  차이점1. if - else 문    1) 조건식이 반드시 참, 거짓으로 평가됨    2) 논리적 참, 거짓으로 실행할 코드 블록을 결정2. switch - case 문     1) 문자열, 숫자 값      2) 다양한 상황에 따라 실행할 코드 블록을 결정할 때 사용  기본 문법 구조는 switch 문의..

const toggleCompleted = (id, text, completed) => {    alert("실행 잘되구있오");  }; 이렇게 함수를 선언하고html 부분의 완료 버튼에  toggleCompleted(todo.id)}>완료 이렇게 함수를 선언해줬다. 클릭한 값들도 잘 들어오고 있나 싶어서얼럿 코드 위에콘솔을 이용해서 값을 출력했는데모두 undefined가 찍혔다.... 튜터님께 여쭤봤는데이벤트 핸들러 (여기에서는 onClick)에그냥 함수(여기에서는 toggleCompleted)를넘겨주게 되면매개변수로 이벤트를 가져올 수 있기 때문에undefined가 뜬다고 하셨다.    const handleInputChange = (event) => {    setNewTodo(event.targe..

const [상태 변수, 상태 변경 함수] = useState(초기값); 1. 상태 변경 함수 (상태 변수 + 1);2. 상태 변경 함수((현재값) => {return 현재값 + 1;});→ 1번과 2번은 같다.3. 이벤트핸들러 = {() => {상태변경함수 {(상태변수 +1)};상태변경함수 {(상태변수 +1)};상태변경함수 {(상태변수 +1)};//  총 1 증가setCount((prev) => prev + 1);setCount((prev) => prev + 1);setCount((prev) => prev + 1);// (prev에 값이 쌓여서) 총 3증가 // (배치 업데이트)}} 배치 업데이트 (Batch Update): 어떤 state를 변경시킬 때 한 번에 처리하는 리액트만의 알고리즘4. con..

이 문제만 벌써 3번째다. 코딩테스트 하는 것처럼 똑같은 조건에서한다고 그냥 풀었을 때도 틀렸고이번에는 공부했다는 가정 하에서 푼다고빡공하고 풀었을 때도 틀렸다. 계속 틀린 코드를 붙잡고 있을 수 만은 없어서다른 사람이 푼 코드로 공부를 하기로 했다.   문제 설명머쓱이는 선생님이 몇 년도에 태어났는지 궁금해졌습니다.2022년 기준 선생님의 나이 `age`가 주어질 때,선생님의 출생 연도를 return 하는 solution 함수를 완성해주세요.  제한 사항 0 나이는 태어난 연도에 1살이며매년 1월 1일마다 1살씩 증가합니다. 입출력 예ageresult401983232000  입출력 예 설명입출력 예 #1- 2022년 기준 40살이므로 1983년생입니다.입출력 예 #2- 2022년 기준 23살이므로 20..