본문 바로가기
반응형

Frontend/Javascript
7

[Typescript] 단언 연산자 느낌표 !(타입단언) Non-null assertion operator(null 아님 보증 연산자) ! TypeScript에서 ! 연산자는 변수 오른쪽에 붙어 Non-null 단언 연산자로 사용된다. 변수의 타입을 null이나 undefined가 아님을 명시적으로 지정하여 컴파일러에게 알려주는 역할을 한다. 예시로, 카카오맵 컴포넌트가 글 작성 페이지일 때는 setCustomValue라는 함수가 있고, 상세페이지(detailPage)일때는 없다. "Cannot invode an object which is possibly 'undefined'" 이 컴포넌트에서 setCustomValue가 넘어 올지 않을지 모르는데, undefined일수도 있는데! setCustomValue!('latitude',.. 2024. 2. 8.
[Typescript] Typescript Essentials3 10. 호출 시그니처, 인덱스 시그니처 호출 시그니처(call signature) interface getLikeNumber { // 계속 사용하고싶다면 interface생성 (like: number): number; // call signature } interface Post { id: number; title: string; getLikeNumber: getLikeNumber; } const post1: Post = { id: 1, title: "post 1", getLikeNumber(like: number) { return like } } post1.getLikeNumber(1); 인덱스 시그니처(index signature) 속성의 모든 이름을 미리 알지 못하는 경우가 있지만 값의 형태는 알고.. 2023. 11. 1.
[Typescript] Typescript Essentials2 04. type annotation, type inference type annotation 개발자가 타입을 타입스크립트에게 직접 말해주는것 const rate: number = 5 type inference 타입스크립트가 알아서 타입을 추론하는것 const rate = 5 타입을 추론하지 못해서 타입 annotation을 꼭 해줘야하는 경우 any타입을 리턴하는경우 const json = '{"x": 4, "y": 7}' const coordinates = JSON.parse(json) console.log(coordinates) coordinates에 hover해보면 const coordinates: any라고 뜨는것을 볼 수 있다. JSON.parse는 json을 파싱해준다. 인풋으로 들어가는 js.. 2023. 11. 1.
[Typescript] Typescript Essentials1 타입스크립트 기본 01. Typescript란? Typescript가 나오게 된 배경 Javascript는 원래 클라이언트 측 언어로 도입되었다. 그런데 Node.js의 개발로 인해서 JS를 클라이언트 측 뿐만이 아니라 서버 측 기쉴로도 활용하게 만들었다. 그러나 JS의 코드가 커질 수록 소스코드가 더 복잡해져서 코드를 유지관리하고 재사용하기가 어려워졌다. 더욱이 Type 검사 및 컴파일시 오류검사의 기능을 수용하지 못하기 때문에 JS가 본격적인 서버 측 기술로 엔터프라이즈 수준에서 성공하지 못한다. 이 간극을 메우기 위해 Typescript가 제시되었다. Typescript란? 타입스크립트는 자바스크립트에 타입을 부여한 언어. 자바스크립트의 확장된 언어(superset)라고 볼 수 있다. 타입스크립트는.. 2023. 11. 1.
[Parcel Bundler]Browser scripts cannot have imports or exports. error npm run dev를 했더니 저런 에러가 떴다. 5월쯤에는 개발서버 여는데 문제가 없었는데 최근 parcel이 migration하면서 바뀌었나, 아무튼 미리 만들어놨던 템플릿도 시간이 지나면 그때그때 설정을 바꾸어줘야한다는걸 새삼 체험했다. 고작 몇개월사이인데.. 에러메시지는 친절하게도 어떻게 고치라고 알려준다. 에서 type="module"을 추가한다. 했더니 잘된다. 2021. 10. 4.
smooth scroll https://github.com/kswedberg/jquery-smooth-scroll GitHub - kswedberg/jquery-smooth-scroll: Automatically make same-page links scroll smoothly Automatically make same-page links scroll smoothly - GitHub - kswedberg/jquery-smooth-scroll: Automatically make same-page links scroll smoothly github.com scrollTo()해서 좌표 구하고 그런것보다 편하게 쓸 것 같다. 2021. 9. 30.
javascript library anime.js https://animejs.com/ anime.js Javascript animation engine animejs.com https://github.com/juliangarnier/anime/ GitHub - juliangarnier/anime: JavaScript animation engine JavaScript animation engine. Contribute to juliangarnier/anime development by creating an account on GitHub. github.com 2021. 9. 30.
반응형

최근댓글

최근글

© Copyright 2023 jngmnj

티스토리툴바