JavaScript 구현 클래스 및 상속

1. 소개

어떤 사람들은 JavaScript가 프로세스 지향 언어라고 생각합니다. 기본 사용법은 기본적으로 함수를 작성한 다음 호출하는 것이기 때문입니다. ==> 이 생각은 틀렸습니다.

JS의 창립자는 Brendan Eich입니다. JS가 창립되었을 당시에는 이미 Java와 객체지향 디자인이 큰 인기를 끌었습니다.

1995년 5월 Netscape는 미래의 웹 스크립팅 언어가 "Java와 유사해 보이지만" 비전문 웹 페이지 작성자가 빠르게 시작할 수 있도록 Java보다 단순해야 한다는 결정을 내렸습니다.

이를 바탕으로 디자인 아이디어는 다음과 같습니다.

(1) C 언어의 기본 구문을 학습합니다.

(2) 데이터 유형 및 메모리 관리를 학습합니다.

(3) Scheme 언어에서 학습하고 기능을 "일류" 상태로 승격합니다.

(4) Self 언어에서 학습하고 프로토타입 기반 상속을 사용합니다. 기구.

작성자 자신은 자바 언어에 관심이 없기 때문입니다. 그래서 자바스크립트 언어는 실제로 (간소화된) 함수형 프로그래밍 + (간소화된) 객체지향 프로그래밍이라는 두 가지 언어 스타일이 혼합된 것입니다.

더 흥미로운 점은 저자 자신이 이 언어에 대해 깊은 이해를 가지고 있다는 것입니다. 매우 만족 ==》

"Javascript를 좋아한다기보다는 싫어한다고 말하는 게 낫다. C언어와 Self언어의 하룻밤의 산물이다"

2. 클래스 라이브러리

JS에는 클래스 개념이 없으며 프로토타입을 사용하여 상속 메커니즘을 구현합니다.

Java와 C# 언어의 클래스 사용 메커니즘에 익숙한 프로그래머에게는 사용하기가 그리 쉽지 않습니다.

JQuery의 저자인 John Resig도 JS에서 클래스를 사용하고 확장할 수 있는 라이브러리를 제공합니다.

Class.js

[javascript]

/*

* 간단한 JavaScript 상속

* 작성자: John Resig http:// ejohn.org/

* MIT 라이센스

*

*********************** ** *****************************

* 사용예

**** ************************************************** *

var Person = Class.extend({

init: function(isDancing){

this.dancing = isDancing;

},

댄스: function(){

return this.dancing;

}

})

var Ninja = Person.extend({

init: function(){

this._super( false );

},

dance: function( ) {

// 상속된 버전의 dance() 호출

return this._super()

},

SwingSword: function(); {

return true;

})

var p = new Person(true);

p.dance(); // => true

var n = new Ninja()

n.dance(); > ; false

n.swingSword(); // => true

// 모두 true여야 함

P Person && p 인스턴스 오브 클래스 &&

n 인스턴스 오브 닌자 && n 인스턴스 오브 사람 && n 인스턴스 오브 클래스

****************** * ***********************************

*/

// base2 및 Prototype에서 영감을 얻었습니다

(function(){

var fnTest = /xyz/.test(function(){xyz;}) ? /b_superb / : /.*/;

// 기본 클래스 구현(아무 작업도 수행하지 않음)

this.Class = function(){}; >

// 이 클래스를 상속하는 새 클래스 생성

Class.extend = function(prop) {

var _super = this.prototype; 🎜 >

// 기본 클래스를 인스턴스화합니다(그러나 인스턴스만 생성합니다.

// init 생성자를 실행하지 않음)

초기화 = true;

var 프로토타입 = new this();

초기화 = false;

// 속성을 새 프로토타입에 복사합니다.

( var name in prop) {

// 기존 함수를 덮어쓰는지 확인

프로토타입[name] = typeof prop[name] == "function" &&

typeof _super[name] == "function" && fnTest.test(prop[name]) ?

(function(name, fn){

return function() {

var tmp = this._super;

            // 슈퍼 클래스에서는  

            this._super = _super[name];  

             

            // 메서드는 일시적으로만 바인딩하면 되므로  

            // 실행이 끝나면 제거합니다  

            var ret = fn.apply(this, 인수);         

            this._super = tmp;  

             

            return ret;  

          };  

        })(이름, prop[이름]) :  

        prop[이름];  

    }  

     

    // 더미 클래스 생성자  

    function Class() {  

      // 모든 구성은 실제로 다음에서 수행됩니다. 초기화 메소드  

      if ( !initializing && this.init )  

        this.init.apply(this, 인수);  

    }  

     

    // 구성된 프로토타입 객체 채우기  

    Class.prototype = 프로토타입;  

     

    // 생성자를 우리가 기대하는 대로 적용  

    Class.prototype.constructor = Class;  

  

    // 이 클래스를 확장 가능하게 만듭니다.  

    Class.extend =args.callee;  

     

    클래스 반환;  

  };  

})();  

 

 

 

 

3. 分析

以上的Class.js 实现机家实很简单。 使用JS의 Prototype과 argumnet,apply, callee 这些来实现的