객체 지향 프로그래밍에서 클래스는 객체 생성을위한 확장 가능한 프로그램 코드 템플릿입니다. 클래스는 기본적으로 JavaScript의 기존 프로토 타입 기반 상속에 대한 구문 적 설탕으로 생각할 수 있습니다. 이 기사에서는 JavaScript 클래스에 대해 자세히 알아보고 다음 순서로 사용하는 방법을 배웁니다.
JavaScript 클래스 란 무엇입니까?
JavaScript에서 클래스는 함수 유형이며 class 키워드로 선언됩니다. 함수를 초기화하려면 함수 표현식 구문을 사용해야하고 클래스를 초기화하려면 클래스 표현식 구문을 사용해야합니다.
// 함수 표현식으로 함수 초기화 const a = function () {}// 클래스 표현식으로 클래스 초기화 const b = class {}JavaScript에서는 키워드 함수를 사용하여 시작하는 대신 키워드 클래스를 사용합니다. 또한 속성은 constructor () 메서드 내부에 할당됩니다.
숫자 정렬 C ++
JavaScript 클래스를 사용하는 방법?
선언 된 코드 함수 클래스 둘 다 [[Prototype]] 함수를 반환합니다. 프로토 타입을 사용하면 모든 함수가 new 키워드를 사용하여 생성자 인스턴스가 될 수 있습니다. 예를 들면 :
const a = class {} // 클래스에서 생성자 초기화 const constructorFromClass = new a () console.log (constructorFromClass)산출:
{} 생성자 : 클래스이제 JavaScript에서 클래스를 사용하는 세 가지 방법이 있습니다. 예제를 통해 각 방법의 세부 사항을 살펴 보겠습니다.
클래스 정의
생성자 함수는 속성으로 할당되는 여러 매개 변수로 초기화됩니다. '이' , 기능 자체를 참조하십시오. 식별자의 첫 글자는 규칙에 따라 대문자로 표시됩니다.
자바에서 비트 연산자를 사용하는 방법
// 생성자 초기화 함수 function employee (name, empid) {this.name = name this.empid = empid}이제 이것을 클래스 구문으로 변환하면 구조가 매우 유사하다는 것을 알 수 있습니다.
// 클래스 정의 초기화 class employee {constructor (name, empid) {this.name = name this.empid = empid}}class 키워드가보다 간단한 방식으로 통신한다고 말할 수 있습니다. 초기화 구문의 유일한 차이점은 function 대신 class 키워드를 사용하는 것입니다. 또한 constructor () 메서드 내부에 속성을 할당합니다.
방법 정의
생성자 함수의 또 다른 일반적인 관행은 행동 양식 초기화 대신 프로토 타입에 직접. 예를 들어 어떻게 작동하는지 살펴 보겠습니다.
function employee (name, empid) {this.name = name this.empid = empid} // 생성자에 메서드 추가 employee.prototype.greet = function () {return`$ {this.name} says hello.`}클래스로 같은 코드를 작성하면 간단하고 메서드가 직접 추가됩니다.
class employee {constructor (name, empid) {this.name = name this.empid = empid} // 생성자에 메소드 추가 greet () {return`$ {this.name} says hello.`}}클래스가 더 간단하고 간결한 구문을 허용하지만 때로는 프로세스의 명확성을 타협해야 할 수도 있습니다.
클래스 확장
생성자 함수와 클래스의 장점은 부모를 기반으로 새로운 객체 청사진으로 확장 할 수 있다는 것입니다. 이렇게하면 유사하지만 몇 가지 추가 또는 더 구체적인 기능이 필요한 개체에 대한 코드 반복을 방지하는 데 도움이됩니다.
tableau 혼합 두 데이터 소스
call () 메서드를 사용하여 부모에서 새 생성자 함수를 만들 수 있습니다. 예를 들면 :
// 부모 함수에서 새 생성자 생성 info (name, empid, salary) {// employee.call (this, name, empid) this.salary = salary}이제 class를 사용하여 동일한 코드를 작성할 때 상위 함수에 액세스하기 위해 호출 대신 super 키워드가 사용됩니다.
// 상위 클래스에서 새 클래스 생성 info extends employee {constructor (name, empid, salary) {// chain constructor with super super (name, empid) // add a new property this.salary = salary}}수업은보다 간결한 제작 방법을 제공합니다. 목적 청사진 및 생성자 함수는 내부에서 일어나는 일을보다 구체적인 방식으로 설명합니다.
이것으로 우리는 우리 기사의 끝까지 왔습니다. JavaScript Class 사용법을 이해 하셨기를 바랍니다.
이제 JavaScript 클래스에 대해 알았으니 에듀 레카. 웹 개발 인증 교육은 HTML5, CSS3, Twitter Bootstrap 3, jQuery 및 Google API를 사용하여 인상적인 웹 사이트를 만들고 Amazon Simple Storage Service (S3)에 배포하는 방법을 배우는 데 도움이됩니다.
질문이 있으십니까? 'JavaScript 클래스'의 주석 섹션에 언급 해 주시면 다시 연락 드리겠습니다.