JavaScript 프로 그래 밍 디자인 모델 의 구조 기 모델 사례 분석

3864 단어
본 고의 실례 는 자 바스 크 립 트 프로 그래 밍 디자인 모델 의 구조 기 모델 을 서술 하 였 다.여러분 께 참고 하도록 공유 하 겠 습 니 다. 구체 적 으로 는 다음 과 같 습 니 다.
고전적 인 OOP 언어 에서 구조 기 (구조 함수 라 고도 함) 는 대상 을 초기 화 하 는 특수 한 방법 이다.JS 에 서 는 모든 것 이 대상 이기 때문에 대상 구조 기 가 자주 언급 된다.
대상 구조 기 는 형식 (Class) 을 만 드 는 대상 을 만 드 는 데 사용 되 며, 매개 변 수 를 받 아들 여 대상 의 속성 과 방법 을 초기 화 할 수 있 습 니 다.
대상 구축
JS 에 서 는 대상 을 만 드 는 데 자주 사용 되 는 세 가지 방법 이 있 습 니 다.

//1,     
var newObject = {};
//2,
var newObject = Object.create( null );
//3,    
var newObject = new Object();


그러나 이것 도 세 개의 빈 대상 을 만 들 었 을 뿐 어떠한 속성 과 방법 도 없다.우 리 는 다음 과 같은 네 가지 방법 을 통 해 대상 에 게 속성 과 방법 을 설립 할 수 있다.

// ECMAScript 3      
// 1.         
//    
newObject.someKey = "Hello World";
//    
var key = newObject.someKey;
// 2.      
//     
newObject["someKey"] = "Hello World";
//    
var key = newObject["someKey"];
//     ECMAScript 5
// 3. Object.defineProperty
//     
Object.defineProperty(
 newObject, "someKey",
 { value: "for more control of the property's behavior",
  writable: true,
  enumerable: true,
  configurable: true
});
//               
var defineProp = function ( obj, key, value ){
  config.value = value;
  Object.defineProperty( obj, key, config );
};
//     
var person = Object.create( null );defineProp( person, "car", "Delorean" );
defineProp( person, "dateOfBirth", "1981" );
defineProp( person, "hasBeard", false );
// 4. Object.defineProperties
//    
Object.defineProperties(
newObject,
{ "someKey": { value: "Hello World", writable: true },
 "anotherKey": { value: "Foo bar", writable: false }
});
// 3 4        1,2.


기본 구조 기
JS 에는 Class 라 는 개념 이 없다 는 것 을 알 지만 구조 기로 대상 을 만 드 는 것 도 지원 한다.
[new] 키 워드 를 사용 하면 우 리 는 함수 의 행동 을 구조 기 와 유사 하 게 하여 자신의 대상 인 스 턴 스 를 만 들 수 있 습 니 다.
기본 적 인 구조 기 형식 은 다음 과 같다.

function Car( model, year, miles ) {
  //  ,this          
  this.model = model;
  this.year = year;
  this.miles = miles;
  this.toString = function () {
    return this.model + " has done " + this.miles + " miles";
  };
}
//  
//     car  
var civic = new Car( "Honda Civic", 2009, 20000 );
var mondeo = new Car( "Ford Mondeo", 2010, 5000 );
//     
console.log( civic.toString() );
console.log( mondeo.toString() );


이것 이 바로 간단 한 구조 기 모델 로 두 가지 주요 문제 가 있다.
첫째, 계승 하기 어렵다.둘째, toString () 은 모든 대상 의 인 스 턴 스 에 의 해 한 번 정 의 됩 니 다. 함수 로 서 모든 Car 형식의 인 스 턴 스 에 의 해 공유 되 어야 합 니 다.
원형 구조 기 사용
JS 에는 좋 은 특성 이 있 습 니 다. 원형 [Prototype],
이 를 이용 하여 대상 을 만 들 때 모든 구조 기 원형 중의 속성 은 대상 인 스 턴 스 에 의 해 얻 을 수 있 습 니 다.
이렇게 여러 개체 의 실례 를 통 해 같은 원형 을 공유 할 수 있다.
우 리 는 앞의 Car 예 를 다음 과 같이 개선 합 니 다.

function Car( model, year, miles ) {
  this.model = model;
  this.year = year;
  this.miles = miles;
}
Car.prototype.toString = function () {
  return this.model + " has done " + this.miles + " miles";
};
//   
var civic = new Car( "Honda Civic", 2009, 20000 );
var mondeo = new Car( "Ford Mondeo", 2010, 5000 );
//  
console.log( civic.toString() );
console.log( mondeo.toString() );


위의 예 에서 toString () 방법 은 여러 Car 대상 의 인 스 턴 스 에 의 해 공유 된다.
자 바스 크 립 트 와 관련 된 내용 은 본 사이트 의 주 제 를 볼 수 있 습 니 다.,,,,, 및《 자 바스 크 립 트 수학 연산 용법 총 결 》.
본 고 에서 말 한 것 이 여러분 의 자 바스 크 립 트 프로 그래 밍 에 도움 이 되 기 를 바 랍 니 다.

좋은 웹페이지 즐겨찾기