>웹 프론트엔드 >JS 튜토리얼 >자바스크립트 객체지향 기능 참조_기본지식

자바스크립트 객체지향 기능 참조_기본지식

WBOY
WBOY원래의
2016-05-16 19:20:57918검색

JavaScript의 객체지향 기능에 대한 참고 자료입니다.
이것은 JavaScript의 객체지향 기능에 대한 나의 연구를 요약한 것입니다. 다른 언어로 객체지향 디자인을 경험한 친구들에게 자바스크립트의 OO를 이해하는데 도움이 되었으면 좋겠습니다. 저는 C, Java, Python의 객체지향 설계 경험이 있습니다.
전체적인 느낌은 JavaScript가 약한 유형의 동적 언어라는 것입니다. 구문은 Java와 유사하지만 객체 지향 접근 방식은 Python에 더 익숙합니다.
1 객체 지향 기능
클래스, 멤버 변수, 멤버 함수, 클래스 변수, 클래스 메서드, 상속, 다형성
1) 클래스
정의 클래스: function Circle(r) { this.r = r; }
클래스 인스턴스화: c = Circle(3)
2) 멤버 변수
멤버 변수 선언 초기화 함수: this.r = r;
객체가 생성된 후 c.name="my Circle",
과 같은 멤버 변수를 객체에 연결할 수도 있습니다. 필요합니다. 이 작업을 수행하지 말 것을 강력히 권고합니다. 즉, 초기화 함수에서 모든 멤버를 선언해야 합니다. 좋은 스타일인 것 같아요.
이것은 Python에 매우 익숙합니다.
3) 멤버 함수
멤버 함수의 표준 형식은 다음과 같습니다.
Cricle.prototype.area = function() { return 3.14 * this.r * this.r; }
이것은 Java나 Python, C와는 매우 다릅니다. 하지만 이해를 돕기 위해 프로토타입을 기본 클래스로 생각할 수 있습니다.
프로토타입의 변수나 메소드는 모든 객체에서 공유됩니다.
예를 들어, c.area() 호출은 결국 인터프리터가 Circle.prototype.area()를 호출하게 합니다.
java 및 c와 비교하여 javascript에는 둘 다 가지고 있지 않은 의미가 있습니다. 프로토타입에서 변수를 정의할 수 있습니다. 프로토타입에 정의된 변수는 모든 인스턴스에서 공유될 수 있습니다. 따라서 일반적으로 Circle.prototype.PI = 3.14와 같은 상수여야 합니다.
분명히 프로토타입의 변수와 메서드는 변경되지 않아야 합니다. 각 객체 인스턴스는 프로토타입의 내용을 수정해서는 안 됩니다. 언어를 통해 이를 수행할 수 있지만 이는 의미가 없으며 객체 지향 의미론을 위반합니다(생각해 보십시오. Java에서 클래스의 메소드를 동적으로 수정할 수 있습니까?).
물론 다형성은 또 다른 문제인데, 이에 대해서는 나중에 자세히 다루겠습니다.
그리고 모든 멤버 함수는 클래스 정의 직후에 정의하는 것이 좋습니다. 코드가 실행되는 동안 어딘가에 객체 인스턴스에 멤버 함수를 추가/수정하는 대신. 결과적으로 JavaScript의 클래스 정의는 Java의 클래스 정의만큼 일관됩니다. 코드를 더 명확하게 만듭니다.
4) 클래스 변수
클래스 변수는 클래스에 속하는 변수입니다. Java에서 static으로 수정된 변수와 같습니다. 클래스에 속하므로 상수여야 합니다. 인스턴스는 이를 수정해서는 안 됩니다(클래스 변수가 정의되면 수정할 수 없도록 Java에서 최종 수정을 사용할 수 있음).
여기서 보면 클래스 변수와 프로토타입에 정의된 변수의 기능이 유사하다는 것을 알 수 있습니다. 사실 그들의 목적은 동일합니다. 하지만 액세스 방법은
다릅니다. 예:
Circle.prototype.PI = 3.14;
Circle.PI = 3.14;
//프로토타입에 변수 사용
Circle.prototype.area1 = function() { return this.PI * this.r * this.r; }
//클래스 변수 사용
Circle.prototype.area2 = function() { return Circle.PI * this.r * this.r }
5) 수업 방식
이 개념은 단순해야 합니다. 클래스 메소드에서 this 키워드를 사용하지 마십시오. 이는 Java에서와 정확히 동일합니다.
Circle.max = function(a, b) { return a.r > b.r ? a : b }
theMax = Circle(new Circle(1), new Circle(4)); >6) 상속
하위 클래스가 상위 클래스를 상속한 다음 "하위 클래스 인스턴스"는 "상위 클래스 인스턴스"와 정확히 동일한 동작을 갖습니다. 자바스크립트는 이렇게 구현됩니다.
function SubCircle(x, y, r) { this.x = x; this.r =r }
SubCircle.prototype = new Circle(0); 이전글 그렇게 말했나요? 프로토타입을 기본 클래스로 생각할 수 있습니다. 여기서 프로토타입은 실제로 기본 클래스입니다. 어떻게 달성됩니까?
예: sc = SubCirlce(1,1,3); sc.area()
통화 전환: sc.area()->sc.prototype.area()->Circle( 0 ).area()->Circle.prototype.area() 정말 멋지지 않나요?
이런 방식으로 JavaScript는 상속을 구현합니다.

7) 다형성

다형성은 하위 클래스가 상위 클래스와 동일한 서명을 가진 메서드를 정의하는 경우입니다. SubCircle이 위치한 공간에서 PI=100이라고 가정하면, 면적식도 PI*R*R*R이 됩니다.
SubCircle.prototype.PI = 100
SubCircle.prototype.area = function() { return this.PI*this.r*this.r*this.r }
Sc.area() like this 작업은 다음과 같이 간주할 수 있습니다.
Sc.PI->sc.prototype.PI->Cricle(0).PI = 100
Sc.area()->sc.prototype.area( )- >Circle(0).area
이때 호출과정은
sc.area()->sc.prototype.area()와 같으며, 여기서 인터프리터가 발견한 Area 메소드는 다음과 같습니다. , 그래서 이 메서드를 호출합니다.
Cricle.prototype.area는 호출되지 않습니다. PI에 대한 호출도 마찬가지입니다.
그렇다면 하위 클래스가 상위 클래스의 메서드를 호출하려면 어떻게 해야 할까요? 해결책이 없는 것 같습니다. 혹시 아시는 분 계시면 알려주세요. 그러나 객체지향 이론에서는 상속이 주로 코드 재사용보다는 인터페이스를 제공하므로 그러한 아이디어를 적게 갖는 것이 좋습니다 :).
다음은 예제 프로그램입니다. 위의 모든 개념이 포함되어 있습니다.


[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.
]
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.