Typescript는 혼란스러울 수 있습니다.

Codesphere에서 우리는 주로 Typescript로 코딩합니다. Typescript가 우리가 가장 좋아하는 언어이기 때문이 아니라 그것이 우리를 가장 생산적으로 만들었다는 것을 알았기 때문입니다.

우선, 우리를 더 효율적으로 만드는 Typescript의 몇 가지 이점은 다음과 같습니다.

프런트엔드와 백엔드 모두에서 동일한 언어로 코딩하는 기능

(주로) 대단한OO + 종류

비동기 코드

그러나 최근에 나는 두 가지 매우 이상한 동작을 발견했고(JavaScript Bubble에서 공통적이라는 것을 알고 있습니다) 공유하고 싶은 충동을 느꼈습니다!

1: ['1', '2', '10'].map(parseInt);

일부 사용자 입력의 형식을 지정하고 숫자로 변환하여 차트에 넣고 싶을 때 이것을 발견했습니다.



나를 믿지 않습니까? 브라우저에서 콘솔을 열고 다음을 붙여넣고 Enter 키를 누릅니다.
['1', '2', '10'].map(parseInt);
맵이 각 반복에서 parseInt()에 세 개의 인수를 전달하기 때문에 작동하지 않습니다. 두 번째 인수 인덱스는 기수 매개변수로 parseInt에 전달됩니다. 따라서 배열의 각 문자열은 다른 기수를 사용하여 구문 분석됩니다. '2'는 기수 1로 구문 분석되어 NaN이 되고, '10'는 기수 2(3)로 구문 분석되며, '1'는 인덱스 0이 거짓이므로 기본 기수 10으로 구문 분석됩니다.

2: Typescript에서 'readonly' 상속

Codesphere에서 코드를 검토하는 동안 동료인 Roman은 메서드를 읽기 전용으로 만드는 아이디어를 발견했습니다. 다음에 일어난 일은 우리를 약간 혼란스럽게 만들었습니다.

실제로 메서드를 읽기 전용으로 만드는 것은 불가능하지만 동일한 효과가 있는 함수 유형으로 읽기 전용 속성을 만드는 것은 가능합니다.

흥미롭게도 동일한 클래스의 인스턴스에 속성을 다시 할당할 수는 없지만 클래스를 상속하고 속성을 재정의하는 것은 물론 하위 클래스의 인스턴스에 속성을 할당할 수 있습니다.

class Roman {
    readonly jonas: () => void = () => console.log("huh?");
}

class Elias extends Roman {
    jonas: () => void = () => console.log("oh no, override works!");
}

const elias = new Elias();
elias.jonas(); // oh no, override works!
elias.jonas = () => console.log("oh no, assignment works too!");
elias.jonas(); // oh no, assignment works too!

지금은 여기까지입니다. 즐겁게 읽으셨기를 바랍니다. TypeScript 지원은 Codesphere IDE의 핵심 기능 중 하나입니다. 그나저나 - 제 이름은 Saji이고 Codesphere 팀에 합류한 것은 코딩과 개발자 경험을 개선하려는 우리의 비전을 좋아하기 때문입니다.

TypeScript에 대한 귀하의 경험은 어떻습니까? TypeScript에서 혼란스러운 점에 대한 이야기를 자유롭게 공유하세요!