> 웹 프론트엔드 > JS 튜토리얼 > JavaScript 객체 지향 프로그래밍 기본 사항: encapsulation_js 객체 지향

JavaScript 객체 지향 프로그래밍 기본 사항: encapsulation_js 객체 지향

WBOY
풀어 주다: 2016-05-16 18:47:49
원래의
794명이 탐색했습니다.

오랫동안(여기서 칭찬하고 싶습니다) js는 "일종의 장식, 양식 유효성 검사와 같은 매우 제한된 기능을 완료하는 언어였으며 그 언어 자체는 절차적 언어로 간주되었습니다. 복잡한 기능을 완료하세요." 그러나 (씁쓸하고 슬프게 말하고 싶습니다) "Ajax의 출현으로 복잡한 스크립트가 필수 구성 요소가 되었고, 이로 인해 JavaScript 프로그래밍에 대한 새로운 요구 사항이 제시되었습니다. 많은 Ajax 애플리케이션이 JavaScript 객체 지향 속성을 사용하기 시작했습니다. 실제로 JavaScript는 객체 지향 개발 아이디어를 구현하는 완전한 메커니즘을 제공합니다." 맙소사, 배우고 싶지도 않았고, 감히 배우지도 못했는데, 이제는 뼈저리게 배워야 합니다.
여기에는 물건에 대한 말도 안되는 내용이 너무 많습니다. 우리 모두는 객체지향 프로그래밍의 세 가지 주요 특징이 캡슐화, 상속, 다형성이라는 것을 알고 있습니다. 아래에 우리는 이 세 가지 특성에 관한 몇 가지 학습 경험을 기록할 것입니다.
자, 캡슐화부터 시작해 보겠습니다. 우리 모두 알고 있듯이 객체는 캡슐화의 가장 기본적인 단위입니다. 캡슐화는 프로그램 상호 의존성으로 인한 변경의 영향을 방지합니다. 객체 지향 캡슐화는 기존 언어 캡슐화보다 더 명확하고 강력합니다. 코드는 저렴합니다.

// 함수를 정의하여 클래스를 정의합니다.
function class1() {
// 클래스 멤버 및 생성자 정의
// 여기서 class1은 함수이자 클래스입니다. 함수로서 초기화를 담당하는 클래스의 생성자로 이해될 수 있습니다.
}

// 클래스의 인스턴스를 얻으려면 new 연산자를 사용하세요.
var obj = new class1()
/* 클래스 개념은 제쳐두고, 코드에서 class1은 함수인데 new로 모든 함수를 동작시킬 수 있나요? 대답은 '예'입니다.
JavaScript에서 함수와 클래스는 동일한 개념입니다. 함수가 새로운 경우 객체가 반환됩니다. 이 함수에 초기화된 클래스 멤버가 없으면 빈 개체가 반환됩니다.
사실 새로운 함수를 생성할 때 이 함수는 표현된 클래스의 생성자이며, 그 안의 모든 코드는 객체를 초기화하는 작업을 한다고 볼 수 있습니다. 클래스를 표현하는 데 사용되는 함수를 생성자라고도 합니다.
JavaScript에서 각 개체는 여러 속성(메서드)의 모음으로 볼 수 있습니다.
*/

function test() {
alert( typeof (obj)); }




위 코드는 js의 간단한 캡슐화인 class1을 정의합니다. js가 "정적 클래스",

함수를 어떻게 정의하는지 살펴보겠습니다. class1() { // 생성자
}
// 정적 속성
class1.staticProperty = " test "
// 정적 메서드
class1.staticMethod = function () {
Alert(class1.staticProperty);
}

function test() {
// 정적 메서드 호출
class1.staticMethod()
alert( typeof ( class1)) ;

}

그런 다음 "추상 클래스"를 살펴보세요.

/*
전통적인 객체 지향 언어에서는 추상 클래스의 가상 메서드가 먼저 선언되어야 합니다. 하지만 다른 메서드에서 호출할 수 있습니다.
자바스크립트에서 가상 메소드는 클래스에 정의되어 있지 않지만 이 포인터를 통해 사용된 메소드라고 볼 수 있습니다.
기존의 객체 지향 방식과 달리 여기서 가상 메소드는 선언할 필요 없이 직접 사용됩니다. 이러한 메서드는 파생 클래스

*/

// 확장 메서드 정의
Object.extend = function (destination, source) {
for (property in)에서 구현됩니다. source) {
destination[property] = source[property];
}
return Destination;
}
Object.prototype.extend = function(객체) {
return Object. 확장 적용( this , [ this , object]); > 초기화: function () {
this .oninit(); // 가상 메서드 호출
}
}
// 클래스1 정의
function class1() {
// 생성자
}
// class1이 base에서 상속하고 oninit 메소드를 구현하도록 합니다.
class1.prototype = ( new base()).extend({
oninit: function () { // 구현 추상 기본 클래스의 oninit 가상 메소드
// oninit 함수 구현
}
})

위의 "class1이 base에서 상속하고 그 안에 oninit를 구현하도록 합니다." 메서드 ", "상속"이라는 개념을 사용하고 있으니 주의하시기 바랍니다. 실행 효과를 살펴보겠습니다.

function test() {
var obj = new class1();
obj.oninit = function () { Alert( " test " );
obj.oninit()
}

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