> 웹 프론트엔드 > JS 튜토리얼 > 초보자를위한 타이프 스크립트, 4 부 : 수업

초보자를위한 타이프 스크립트, 4 부 : 수업

William Shakespeare
풀어 주다: 2025-03-16 09:49:08
원래의
869명이 탐색했습니다.

초보자를위한 타이프 스크립트, 4 부 : 수업

이 일련의 튜토리얼을 사용하면 TypeScript를 단계별로 배울 수 있습니다. 첫 번째 부분은 TypeScript를 간단히 소개하고 TypeScript를 작성하는 데 사용할 수있는 일부 IDE를 권장합니다. 두 번째 부분은 데이터 유형에 중점을두고 세 번째 부분은 TypeScript 인터페이스의 기본 사항에 대해 설명합니다.

이미 알고 있듯이 JavaScript는 이제 클래스 및 객체 지향 프로그래밍을 기본적으로 지원합니다. 그러나 TypeScript는 오랫동안 개발자가 코드에서 클래스를 사용할 수있게 해왔습니다. 그런 다음이 코드는 모든 주요 브라우저에서 실행될 수있는 JavaScript 코드로 컴파일됩니다. 이 튜토리얼에서는 TypeScript의 클래스에 대해 배우게됩니다. 그것들은 그들의 ES6 상대와 비슷하지만 더 엄격합니다.

첫 번째 수업을 만드십시오

기본부터 시작합시다. 클래스는 객체 지향 프로그래밍의 기본 부분입니다. 클래스를 사용하여 특정 속성에 따라 행동 할 수있는 특정 속성 및 기능을 갖춘 엔티티를 대표 할 수 있습니다. TypeScript는 포함 된 클래스 내부 및 외부에 액세스 할 수있는 속성 및 기능을 완전히 제어 할 수 있습니다. 다음은 수업을 만드는 방법의 기본 예입니다.

생성자가 get and name 과 유사하지만 get readonly 없지만 이름이 비슷하다는 것을 알 수 있습니다. 명시 적으로 지정되지 않으면 세터의 매개 변수 유형은 getter의 리턴 유형에서 추론됩니다. TypeScript 4.3부터 시작하면 Getter가 반환 한 유형과 다른 유형을 수용하는 세터를 가질 수 있습니다.

인터페이스를 사용하여 클래스 구현

TypeScript 인터페이스에 대한 이전 자습서에서 우리는 인터페이스가 기본적으로 코드에서 사용할 다른 객체의 구조를 지정하는 데 사용된다는 것을 알게되었습니다. 이제 이전에 선언 된 일부 인터페이스를 기반으로 클래스를 구현하는 방법을 배웁니다.

 인터페이스 iPoint {
    X : 숫자;
    Y : 숫자;
    위치 (x : 숫자, y : 숫자) : void
}

인터페이스 iRectangle 확장 iPoint {
    너비 : 숫자;
    길이 : 숫자;
    면적 (너비 : 숫자, 길이 : 숫자) : 숫자
}

클래스 포인트는 ipoint {
    X : 숫자;
    Y : 숫자;

    생성자 (x : 숫자, y : 숫자) {
        this.x = x;
        this.y = y;
    }

    위치 () : void {
        console.log (`포인트는 ($ {this.x}, $ {this.y})에 있습니다.`);
    }
}

클래스 사각형은 irectangle {
    너비 : 숫자;
    길이 : 숫자;
    X : 숫자;
    Y : 숫자;

    생성자 (x : 숫자, y : 숫자, 너비 : 숫자, 길이 : 숫자) {
        this.x = x;
        this.y = y;
        this.width = 너비;
        길이 = 길이;
    }

    영역 () : 숫자 {
        this.width * this.length;
    }

    위치 () : void {
        console.log (`사각형은 ($ {this.x}, $ {this.y})에 있습니다.`);
    }
}

MyPoint = New Point (10, 20);

myrect = new 사각형 (0, 0, 20, 30);

myPoint.Position ();

myrect.position ();

console.log (myrect.area ());
로그인 후 복사

우리는 이전 자습서에서와 마찬가지로 IRectangle 인터페이스를 만들었습니다. 여기서 추가 변경 사항은 인터페이스에 함수 선언을 추가한다는 것입니다.

IRectangle 은 위치를 출력하고 해당 영역을 표시하는이 네 가지 속성과 두 가지 방법을 갖게됩니다.

요약

이 튜토리얼에서는 TypeScript에서 클래스의 기본 사항을 소개하려고합니다. 우리는 먼저 사람의 이름을 콘솔에 인쇄하는 매우 기본적인 Person 클래스를 만들었습니다. 그런 다음 private 키워드를 배웁니다.이 키워드는 프로그램의 어느 시점에서든 수업 구성원에 액세스하는 것을 방지하는 데 사용할 수 있습니다.

마지막으로 상속 된 기본 클래스를 사용하여 코드에서 다른 클래스를 확장하는 방법을 배웠습니다. 공식 문서에서 수업에 대해 자세히 알아볼 수 있습니다.

위 내용은 초보자를위한 타이프 스크립트, 4 부 : 수업의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿