개발을 하다 보면 로직 검사를 위한 테스트 코드 작성을 하거나 어떠한 값을 확인하는 등 여러가지 이유로 임시 변수를 선언해 본 경험이 있을 것이다. 임시 변수 자체도 나름의 의미가 있는 변수가 될 수도 있지만 의미가 없는 변수여서 마땅한 네이밍을 정하기 어렵게 만들기도 한다. 그래서 네이밍을 test, temp 등의 변수를 두는 경우가 많다. 이도 나쁘진 않다고 보지만, foo나 bar와 같은 만국 공통으로 의미가 통하는 네이밍을 쓰는 것이 좋다고 생각한다. (우리나라로 치자면 '이름 = 홍길동' 같은... 자세한 내용은 밑에 나무위키 참고) https://namu.wiki/w/foo foo - 나무위키 프로그래밍 상에서 임시로 변수이름을 지정해줘야 할 때 주로 쓰이는 변수 이름이다. foo 외에 bar..

JSDoc이란? JSDOC은 Javascript 소스코드 파일에 주석 용도의 마크업 언어입니다. 주석이기 때문에 코드에 영향을 주지 않습니다. 빨간 박스 안에 있는 부분이 JSDoc입니다. // 스크린샷 기준으로 맨 윗 줄인 해당 문구를 통해 props의 자료형이 object임을 알려주고 있습니다. @param {object} props // 해당 구문을 통해서는 props.align에 어떤 속성들이 있는지 알려주고 있습니다. @param {'right' | 'center' | 'left' } props.align 아래 첨부사진과 같이 JSDoc에 param들에 커서를 두면 프로퍼티 목록을 제공합니다. 저는 타입과 프로퍼티를 가이드하옂 가독성을 높여 유지보수를 수월하게 하는 도구로 사용하고 있습니다. 공..

객체의 선언은 아래 코드와 같다. const tistory = { author: "cotist", date: "22/07/31", age: 8, }; tistory라는 객체를 선언을 하였다. 각 요소의 좌변은 키(key)이며 author, date, age에 해당되며 우변은 키의 값이다. 객체의 요소에 접근하는 방법은 두 가지가 있는데 콘솔 로그로 아래 코드를 보자. const tistory = { author: "cotist", date: "22/07/31", age: 8, }; // 객체의 요소에 접근하는 방법 console.log(tistory.author); console.log(tistory["author"]); 두 결과 모두 cotist가 나올 것이다. 다음은 객체를 추가하는 방법이다. 처음에..

Uncaught Error: Expected `onClick` listener to be a function, instead got a value of `string` type. Uncaught Error: Expected `onClick` listener to be a function, instead got a value of `object` type. Uncaught Error: Expected `onClick` listener to be a function, instead got a value of `boolean` type. 위의 에러 구문이 발생하는 원인은 리액트의 이벤트 핸들러(event handler)는 반드시 '함수' 형태로 받아야 하는데, '함수가 아닌 다른 형식'으로 받았기 때문입니다...