이 기사의 내용은 JavaScript에서 TypeScript로 이동하는 방법에 관한 것입니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.
typeScript를 배우려면 먼저 기본 JavaScript에 매우 능숙해야 한다고 생각합니다. 그다음에는 ES5+ES6+ES7을 마스터해야 합니다(7개 이상은 아는 것이 가장 좋습니다). 새로운 기술을 익히면 앞으로는 사용할 수 없을 것입니다. typeScript =type+ javaScript, ES5/6/7+javaScript를 기반으로 유형을 추가합니다!
TS는 인터페이스나 값 유형 또는 개별 매개변수가 약간 일치하지 않는 한 JS에 비해 정말 매우 엄격합니다. 숫자가 올바르지 않거나 값이 변경되어 유형이 원래 값과 일치하지 않으면 오류가 보고됩니다. npm을 사용하여 typeScript를 전역으로 설치한 다음 tsc *.ts를 사용하여 TS 파일을 컴파일하는 것이 좋습니다.
'typeScript의 새로운 핵심 개념:'let app:string=2; 이 코드는 값 2가 다음과 같기 때문에 오류를 보고합니다. 숫자이고 규정 앱은 문자열 유형이므로 TS
에 오류가 보고됩니다. 새로운 값 유형:any: 모든 유형일 수 있음vold: 함수 move()와 같은 빈 반환 유형: vold{} 이는 이 함수를 나타냅니다. 반환 값이 없습니다. 이
함수는 모든 유형을 반환할 수 있지만, 그렇지 않으면 반환해야 합니다. TS는 오류를 보고합니다.새로운 개념: 유형 추론
let app = 'hello' ; app=1 ; this TS는 이를 let app:string = 'hello'로 간주하고Union type
let app: string | number = 'hello' ; app = 1; 유형 중 하나와 일치하는 한인터페이스(프론트엔드 프로그래머가 이해하기 어려운 점)
javaScript도 객체지향 언어인데 ES5에서는 프로토타입 기반으로 구현하고, ES6에서는 클래스 클래스를 사용하므로class ask{ name:string; tel ? :number ; //这里为什么加问号,因为你不一定能拿到她的号码,如果拿不到,那么便可以不传参数, 但是如果不加? ,你又没那么号码,那么你没有参数传进来,TS就会报错 age:number ; constructor(name,age,tel){ this.name=name; this.age=age; this.tel=tel } } interface check { name : string; age:number; tel ? :number; } let woman :check = new ask ('rose',20,1888888888);//假设你拿到美女所有资料 传入构造函数
이 방법으로 console.log(woman)를 인쇄하여 위 코드가 어떻게 보이는지 확인할 수 있습니다. 오류가 보고되지 않았습니다.
var ask = /* @class / (function () { function ask(name, age, tel) { this.name = name; this.age = age; this.tel = tel; } return ask; }()); let woman = new ask('rose', 20, 1888888888); console.log(woman)
const enum Directions { Up, Down, Left, Right } let directions = [Directions.Up, Directions.Down, Directions.Left, Directions.Right]; // 结果是 0 1 2 3
* 계산된 멤버가 포함된 경우 컴파일 단계에서 오류가 보고됩니다.
* const enum Color {Red, Green, Blue = "blue".length}* 상수 열거형과 일반 열거형의 차이점은 컴파일 단계에서 삭제되며 계산된 멤버를 포함할 수 없다는 것입니다. 시도해 보면 알게 될 것입니다
* 클래스는 한 번에 하나의 인터페이스만 상속할 수 있지만 동시에 여러 인터페이스에 대응할 수 있습니다
* 여러 인터페이스를 달성하려는 경우 클래스 상속, 그런 다음 하위 클래스를 사용하여 계속 다른 클래스 상속 및 루프
interface check { name: string; age: number; hobby: Array<number> fuck: number[] //这两种写法是一样的 }
class exp implements check { name: string age: number hobby:Array<number> fuck: number[] constructor(name, age, hobby, fuck) { this.name = name; this.age = age; this.hobby = hobby; this.fuck = fuck; } } let app = new exp('hello', 18, [1, 2, 3], [2, 3, 4])
---------TS 컴파일 후
var exp = /* @class / (function () { function exp(name, age, hobby, fuck) { this.name = name; this.age = age; this.hobby = hobby; this.fuck = fuck; } return exp; }()); var app = new exp('hello', 18, [1, 2, 3], [2, 3, 4]);
실제로 구현하려면 클래스 클래스가 필요합니다. ES6은 typeScript에서 중요한 역할을 합니다.
이 기사는 여기까지입니다. 더 흥미로운 내용을 보려면 PHP 중국어 웹사이트의 JavaScript 튜토리얼 비디오 칼럼을 주목하세요!
위 내용은 JavaScript에서 TypeScript로 이동하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!