728x90 Studying Web Development/Free Memo13 [TypeScript] Interface와 Class의 차이점 📕 기본 정의 인터페이스 인터페이스는 ES6가 지원하지 않는 타입스크립트만의 특징입니다. 인터페이스는 타입이며 컴파일 후에 사라집니다. 추상 클래스는 선언과 구현이 모두 존재하지만 인터페이스는 선언만 존재하며, 멤버 변수와 멤버 메서드를 선언할 수 있지만 접근 제한자는 설정할 수 없습니다. 클래스와 달리 인터페이스는 TypeScript의 컨텍스트 내에서만 존재하는 가상 구조입니다. TypeScript 컴파일러는 타입 체크 목적으로만 인터페이스를 사용합니다. 코드가 JavaScript 언어로 트랜스 파일되면 인터페이스에서 제거됩니다. 클래스 클래스는 ES6에서 JavaScript 생태계에 공식적으로 도입되었습니다. 클래스는 객체지향 프로그래밍 그 자체입니다. 객체지향 프로그래밍은 커다란 문제를 클래스라는 .. 2022. 7. 21. 입문자가 겪기 쉬운 console.log 관련 문제 모음 개발을 하다보면 console.log가 마음대로 작동하지 않아 애먹는 경우가 있습니다. 저도 같은 문제를 겪었었고, 이번에 면접을 보면서 제대로 알지 못했던 부분을 질문 받아 탈탈 털렸었기에 공부하며 알아보는 시간을 가졌습니다. 😂 입문자가 겪기 쉬운 console.log 관련 문제들을 알아봅시다. 😳 입문자가 겪기 쉬운 console.log 관련 문제 1 React를 사용할 때 setState를 실행하고 값이 바뀐것을 확인하기 위해 바로 밑줄에 console.log(state)를 해본 경험이 있을 것입니다. console.log는 새로 입력해준 값이 아닌 이전의 값을 출력합니다. 이유가 뭘까요? const [state, setState] = useState(0); const incrementState .. 2022. 7. 20. ❓❓nullish 병합 연산자 '??' ❓❓ nullish 병합 연산자 '??' nullish 병합 연산자(nullish coalescing operator) ??를 사용하면 짧은 문법으로 여러 피연산자 중 그 값이 ‘확정되어있는’ 변수를 찾을 수 있습니다. a ?? b의 평가 결과는 다음과 같습니다. a가 null도 아니고 undefined도 아니면 a 그 외의 경우는 b x = a ?? b와 동일한 동작을 하는 코드를 작성하면 다음과 같습니다. x = (a !== null && a !== undefined) ? a : b; 또 다른 예시를 살펴봅시다. nullish 병합 연산자 ??를 사용하면 값이 정해진 변수를 간편하게 찾아낼 수 있습니다. let firstName = null; let lastName = null; let nickNam.. 2022. 7. 20. ES6에서 Arrow 함수를 언제, 왜 쓸까? ES6에서 Arrow 함수를 언제, 왜 쓸까? Arrow 함수(arrow function)를 언제, 왜 사용하는지 그 이유들을 알아봅시다. 1. 함수 본연의 기능을 아주 잘 표현하는 문법입니다. 보통 프로그래밍할 때 function 문법은 아래와 같은 이유로 많이 사용합니다. 여러가지 기능을 하는 코드를 한 단어로 묶고 싶을 때 (그리고 나중에 재사용할 때) 입출력기능을 만들 때 그리고 arrow function을 사용하면 함수 본연의 입출력기능을 아주 직관적으로 잘 표현해줍니다. let 두배만들기 = (x) => { return x * 2; }; console.log(두배만들기(4)); console.log(두배만들기(8)); arrow function을 쓰면 입출력기능이 쉽고 예쁘게 표현되는 것이 a.. 2022. 6. 22. 이전 1 2 3 4 다음
