> 웹 프론트엔드 > JS 튜토리얼 > JavaScript 클래스 사용법에 대한 자세한 설명_기본지식

JavaScript 클래스 사용법에 대한 자세한 설명_기본지식

WBOY
풀어 주다: 2016-05-16 17:34:31
원래의
1171명이 탐색했습니다.

클래스를 생성하는 생성자 메서드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다. 다음과 같습니다:

함수 클래스 이름(prop_1, prop_2, prop_3) {
this.prop1 = prop_1;
this.prop2 = prop_2;
this.prop3 = prop_3;}

위 클래스를 사용하여 클래스에 대한 인스턴스를 만들 수 있습니다.
코드 복사 코드는 다음과 같습니다.

var obj_1 = new className(v1, v2, v3)
var obj_2 = new className(v1, v2, v3)

클래스 추가 메소드(method)는 실제로 Function 중의 Function이라고 할 수도 있습니다.
코드 복사 코드는 다음과 같습니다.

함수 클래스 이름(prop_1, prop_2, prop_3) {
this.prop1 = prop_1;
this.prop2 = prop_2;
this.prop3 = prop_3;
this.func = function new_meth(속성) {
//여기에 코딩
}
}

속성 액세스 도메인:

JavaScript에서 객체의 속성은 기본적으로 전역적입니다. 즉, 객체 내부와 외부 모두에서 속성에 직접 액세스할 수 있습니다. 위의 예에서 this.prop1, this.prop2 및 this.prop3은 모두 전역 속성입니다.

비공개 속성을 어떻게 정의하나요? var를 사용하면 다음 예에서 가격이 사유 재산이 됩니다!

코드 복사 코드는 다음과 같습니다.

function Car(listedPrice, color) {
var 가격 = listedPrice;
this.color = color;
this.honk = function() {
console.log("BEEP BEEP!!");
};
}

개인 속성에 액세스하려면 개체에 메서드를 추가하여 개인 속성을 반환하면 됩니다. 메서드가 개체에 있으므로 개체의 개인 속성에 액세스할 수 있습니다. 물체. 이 메서드를 외부에서 호출하면 이 전용 속성에 액세스할 수 있습니다. 그러나 메서드에서는 더 이상 사용할 수 없습니다. 위의 예와 같이 가격에 액세스하려면 개체에 메서드를 추가하면 됩니다.
코드 복사 코드는 다음과 같습니다.

this.getPrice = function() {
//반품 가격은 여기에서! ------------------------- ------------ --------------


상속:
다음 구문을 사용하여 상속합니다.


ElectricCar.prototype = new Car();


instanceOf를 사용하여 객체가 객체의 상속인지 확인하고 true 또는 false를 반환합니다.


myElectricCar 인스턴스of Car


상속받은 객체에 메소드 추가:


// 구문 사용 함수는 새 객체를 정의합니다
function ElectricCar( listedPrice ) {
this.electricity=100;
var Price = listedPrice;
}

//새 객체가 Car를 상속받도록 만듭니다ElectricCar.prototype = new Car();


// 새 객체에 대한 메서드 추가

ElectricCar.prototype.refuel = function(numHours) {

this.electricity = 5*numHours;
};


re 프로토타입 객체의 값이나 메소드 작성:

프로토타입 객체를 상속받을 때 프로토타입의 값과 메소드를 상속받게 됩니다. 하지만 때로는 객체 값이나 메소드가 다를 수 있습니다. 이때 프로토타입 객체의 값과 메소드를 재정의하여 새 객체의 내용을 변경할 수 있습니다


코드 복사 코드는 다음과 같습니다.

function Car( listedPrice ) {
   var 가격 = listedPrice;
   this.speed = 0;
   this.numWheels = 4;

   this.getPrice = function( ) {
       반품 가격;
   };
}

Car.prototype.accelerate = function() {
   this.speed = 10;
};

function ElectricCar( listedPrice ) {
   var 가격 = listedPrice;
   this.electricity = 100;
}
ElectricCar.prototype = new Car();

// 가중 가속 방법
ElectricCar.prototype.accelerate = function() {
  this.speed = 20; 
};
// 添加 새로운 방법decelerateElectricCar.prototype.decelerate = function(secondsStepped) {
    this.speed -= 5*secondsStepped;
};

myElectricCar = 새로운 ElectricCar(500);

myElectricCar.accelerate();
console.log("myElectricCar의 속도는 " myElectricCar.speed);
myElectricCar.decelerate(3);
console.log("myElectricCar의 속도는 " myElectricCar. 속도);


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