javascript/typescript 17

[typescript] localStorage, sessionStorage

타스로 쓰다보면 자꾸 빨간줄이 생기는데 일단 첫번째 1. getItem에 에러날 경우 const item = JSON.parse(sessionStorage.getItem(k)!); 뒤에 느낌표를 쓰기. 2. key에 에러날 경우 // 반복문이라서 i가 있음 const k = sessionStorage.key(i); if (k && k.includes('user')) {}; 첫번째는 따로 변수로 받아서 if문에서 갸가 있을 경우~를 써주고 처리하면 된다. if (sessionStorage.key(i)?.includes('user')) {} 변수로 처리하기 싫다면 이렇게 물음표를 key뒤에 붙이면 됨!

'정의되지 않음'일 수 있는 개체를 호출할 수 없습니다.

아 형 또 왜그래요 1. 좀 더 자세한 조건 추가 if (this.view.api?.getText) { this.view?.api?.getText(text); } 좀 더 설명하자면 view의 api에 아무것도 없다가 페이지가 로드되면 getText가 생기는데, 이 타이밍을 못기다리고 getText는 없다며 '정의되지 않음' 이하 경고멘트를 띄운 것임. 그렇기때문에 getText가 있을때~를 조건으로 걸고 그 안에 하고싶은걸 넣어주면 됨. 거의 다 이런식의 오류인듯.

[react][typescript] 'RefObject<HTMLElement>' 형식은 'LegacyRef<HTMLDivElement> | undefined' 형식에 할당할 수 없습니다.

잘 또 하다가 갑자기 발생하는 오류... 잘쓰던 useRef를 다른 엘리먼트로 옮긴것뿐인데 왜그러지 싶었는데 타입스크립트는 엘리먼트가 그냥 div냐 main header같이 다른 시멘틱 엘리먼트냐를 또 가르나봄. 나 열받게하지마라! 1. useRef값 확인 const wrapper = useRef(null); // 기존. 에 걸어뒀음. const wrapper = useRef(null); // 변경. 에 걸어둠.

[react][typescript] .current'은(는) 'null'일 수 있습니다

useRef로 element좀 써주려고 하면 이렇게 뜬다. 그냥 current가 있을 때를 조건으로 걸어주면 된다. 1. 미리 걸러주기 if (inputRef.current) { // 이곳에 코드 쓰기 } 참고로 나는 정의할때 이렇게 썼음 const inputRef = useRef(null); +추가로 이렇게 썼는데 여전히 그 밑에서 current가 null일 수 있다 이소리를 한다면 느낌표를 활용하자. if (inputRef.current) { gotoPage(inputRef.current!.value); } 느낌표의 의미는 'null일리없으니까 그대로 진행시켜'라는 의미라고 함.

타입스크립트 빠르게 훑어보기 2 - type/interface

참고로 타입스크립트 뭔가 확확 변하는건지 2년전 다른 사람 포스팅에서 이건 안된다 했던거 지금 다 되서 당황함. (해당 포스팅은 언제든지 내용 수정/추가 될 수 있음) 1. type function log(user: {username: string, age: number, phone?: string, id: string, gender: string}) { console.log(user.username); } 이 함수는 user라는 객체를 받아서 그 안에 있는 value를 알려주는데 이렇게 쓰면 너무 길어서 가독성 떨어짐. type User = { username: string; age: number; phone?: string; readonly id: string; // 읽기 전용 gender?: str..

타입스크립트 빠르게 훑어보기 1 - 기본형/튜플/함수

할꺼 많다... 배울꺼 많다... 그래서 나중에 바로 꺼내서 보게 글쓴다... 일단 타입스크립트를 연습할 수 있는 사이트를 켜놓고 시작하자. 참고로 console.log()가 왜 안되지라고 한다면 상단에 있는 run을 눌러주면 나온다(run안눌러도 에러 잡아주길래 자동으로 run해주는줄 알았음). https://www.typescriptlang.org/ JavaScript With Syntax For Types. TypeScript extends JavaScript by adding types to the language. TypeScript speeds up your development experience by catching errors and providing fixes before you eve..