TypeScript에 대한 몇 가지 팁을 공유하세요

C++ 프로젝트에서 TypeScript(이하 ts)를 컴파일합니다

ts 파일의 속성을 편집하고 항목 유형으로 "Custom Production Tool"을 선택합니다.

　 명령줄에 tsc의 위치 및 컴파일 매개 변수를 입력합니다. 내 것은 "C:Program Files (x86)Microsoft SDKsTypeScript2.2tsc" %(Identity) --outFile %(RelativeDir)/%(FileName).js -t입니다. es5. 공백이 있는 UNC(Universal Naming Convention)는 큰따옴표로 묶어야 합니다. %(Identity)는 컴파일된 파일의 위치입니다.

　　 --outFile은 출력 매개변수이고 그 뒤에 출력 위치가 옵니다.

　　 -t(--target)는 대상 유형입니다. 저는 ES5를 사용하며 "ES3"(기본값), "ES5", "ES6"일 수도 있습니다. code> /<code>"ES2015", "ES2016", "ES2017" 또는 "ESNext". "ES5", "ES6"/"ES2015", "ES2016", "ES2017" or "ESNext"。

　　说明写%(Identity)就可以，这个随意。

　%(ID)만 적어주시면 됩니다. 선택사항입니다.

　출력은 $(FileName).js로 작성됩니다. 이는 컴파일 필요성을 결정하는 데 사용됩니다.

ps: 이것이 제가 조사한 방법입니다. 더 표준적인 방법이 있다고 생각합니다. 해당 관계자는 C++ 프로젝트에서 컴파일하는 방법을 소개하지 않았습니다.

ts에서 jquery의 설명을 인용하세요

jquery는 ts로 작성되지 않았기 때문에 git에서 ts 파일을 찾을 수 없습니다. 다행히 vs는 jquery를 포함한 모든 프로젝트 유형에 대해 강력한 지원을 제공합니다. jquery 버전의 파일을 저장하면 스마트 프롬프트가 자동으로 $를 지원합니다. 다음으로 마우스를 $ 왼쪽이나 오른쪽에 놓고 F12 키를 눌러 정의를 보면 자동으로 index.d.ts 파일로 이동합니다. 레이블을 마우스 오른쪽 버튼으로 클릭하고 Open Directory를 선택하여 파일을 찾아 복사합니다. 자신의 프로젝트 디렉토리에.

　 삼중 슬래시 구문을 사용하여 현재 ts 파일 참조 ///

　 .d.ts 파일은 선언 파일이며 논리 코드를 포함하지 않습니다. 구조.

자신만의 ts 파일에 대한 선언 파일을 생성하는 방법

　 이전과 마찬가지로 tsc 컴파일러는 선언 파일을 생성할 수 있으며 -d/--declaration 매개 변수와 ts 파일만 필요합니다.

　예: tsc -d main.ts

명령줄을 사용하여 ts 파일을 컴파일하시겠습니까?

　네, 문제가 있어도 괜찮다면요. VS의 VS 2017용 개발자 명령 프롬프트는 tsc 명령을 직접 사용할 수 있습니다. 시작 화면에 고정하여 시작 효율성을 높일 수 있습니다.

선언을 받지 못하는 문제 해결 방법

　　declare var swal: (arg: any) => any;

　 swal과 같이 TS 선언을 제공하지 않는 함수도 있으니 자유롭게 사용하시면 됩니다. 물론 이는 매개변수의 오용입니다.

　ts의 HTMLElement.remove 멤버는 존재하지 않으며 해당 상위 개체의 RemoveChild만 사용할 수 있으므로 매우 편리하지 않습니다.

　dom:HTMLElement;

　　(<any>dom).remove();// 就这样勉强的转为any再调用remove吧。</any>

각 개체에 대해 클래스를 만들 필요가 없습니다.

　ts 클래스는 클래스의 내부 선언을 지원하지 않습니다. 따라서 클래스 외부에서 멤버 유형을 선언하는 것은 적절하지 않습니다.

　　class foo{
　　　　member:{mem1:number, mem2?:string};// 加问号表示可有可无　　}

이런 점에서 member는 내부 클래스와 유사합니다.

이벤트 구독과 이 매개변수

　　class bar{
　　　　sub(){
　　　　　　dom.onclick=function(){this};
　　　　}
　　}

　이런 식으로 함수 내 this는 dom 객체입니다.

　dom.onclick=()=>{this};

　이것은 클래스 바의 인스턴스를 나타냅니다.

　 그럼 객체 돔과 바 인스턴스를 갖고 싶은데요?

현재는 클로저만 사용할 수 있습니다.

　　class bar{
　　　　click(node:HTMLElement, ev:MouseEvent){
　　　　　　this...
　　　　}
　　　　dom.onclick = (ev:MouseEvent)=>this.click(dom,ev);
　　}

dom은 클로저와 함께 전달됩니다. 결국, click은 bar의 멤버 기능입니다.

Readonly 속성에는 readonly가 필요하지 않습니다

수정하려는 경우 읽기 전용은 클래스 내부 액세스에 편리하지 않습니다.

그래서 Object.defineProperty를 사용해야 합니다. ts는 더 편리한 설정/가져오기 작업 속성을 갖습니다.

　　class baz{
　　　　_attr:[];
　　　　get attr(){
　　　　　　return _attr;
　　　　}
　　}

　 이렇게 하면 attr을 읽을 수만 있습니다. 속성 기능을 사용하려면 ts 컴파일러의 대상 옵션(-t/--target)을 es5 이상으로 설정해야 합니다.

이 글은 계속 업데이트 될 예정입니다. TS 스킬과 관련된 내용이라면 이 글을 팔로우/즐겨찾기 해주세요.

btw: cnblogs는 TS 코드 색상 표시를 지원하지 않으며 JS 코드 색상 표시를 사용합니다. 🎜

위 내용은 TypeScript에 대한 몇 가지 팁을 공유하세요의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!