JavaScript 생 성 대상 방식 요약 [공장 모델, 구조 함수 모델, 원형 모델 등]

이 글 의 실례 는 자 바스 크 립 트 생 성 대상 방식 을 총 결 하 였 다.여러분 께 참고 하도록 공유 하 겠 습 니 다. 구체 적 으로 는 다음 과 같 습 니 다.
여 기 는 주로 제6 장 (대상 을 대상 으로 하 는 프로 그래 밍) 에 대한 총 결 로 책의 이 장 은 적어도 4 번 은 보 았 다.이 장 은 주로 대상 의 창설 과 계승 을 말한다.그 중에서 창설 대상 과 계승 방식 은 적어도 6 가지 이 고 방법 속성 을 더 하면 머리 가 어 지 럽 기 쉽다.따라서 이 장의 내용 을 정리 하고 나중에 잊 어도 좋다.
글 의 길이 가 제한 되 어 있 기 때문에 본 고 는 주로 창설 대상 을 말한다.
1 생 성 대상
1.1 일반적인 방법
Object 를 사용 하거나 대상 글자 의 양 을 사용 하 는 방법.

var o = {a: 1};
var o2=new Object();
o2.a=1;

단점: 같은 인터페이스 로 많은 대상 을 만 들 면 중복 되 는 코드 가 많이 생 긴 다.
1.2 공장 모델

function parent(name,age){
  var Child = new Object();
  Child.name=name;
  Child.age=age;
  Child.sayHi=function(){
    console.log("Hi");
  }
  return Child;
};
var x = Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

함수 parent 는 필요 한 모든 정 보 를 포함 하 는 child 대상 을 받 아들 일 수 있 습 니 다.이 함 수 를 무한 호출 할 수 있 습 니 다. 두 개의 속성 과 한 가지 방법 을 포함 하 는 대상 을 되 돌려 줍 니 다.
여러 개의 비슷 한 대상 을 만 드 는 문 제 를 해결 하 였 으 나 대상 인식 문 제 를 해결 하지 못 했다 (즉, 한 대상 의 유형 을 어떻게 아 느 냐).
1.3 구조 함수 모드
구조 함수 라 는 이름 에 대해 자바 나 c + + 를 배 운 학생 들 은 모두 알 고 있 을 것 입 니 다. js 에서 도 차이 가 많 지 않 습 니 다.
구조 함수 로 위의 예 를 다음 과 같이 다시 쓰 십시오.

function Parent(name,age){
  this.name=name;
  this.age=age;
  this.sayHi=function(){
    console.log("Hi");
  };
}
var x = new Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

구조 함수 에 대해 우 리 는 호출 할 때 키 워드 를 추가 해 야 한다 new.주의해 야 할 것 은 구조 함 수 는 처음부터 끝까지 대문자 로 시작 하 는 것 이지 구조 함 수 는 처음부터 끝까지 소문 자로 시작 하 는 것 이 아니다.
공장 모델 에 비해 주로 다음 과 같은 몇 가지 차이 점 이 있다.

대상 을 표시 하지 않 고 만 듭 니 다.

이 대상 에 게 속성 과 방법 을 직접 부여 했다.

문구 가 없습니다.

단점: 구조 함 수 를 사용 하 는 단점 은 모든 방법 이 인 스 턴 스 마다 다시 만들어 야 한 다 는 것 이다.
1.4 원형 모드
우리 가 만 든 모든 함수 에는 하나의 return 속성 이 있 습 니 다. 이 속성 은 하나의 지침 으로 대상 을 가리 키 고 이 대상 의 용 도 는 특정한 유형의 모든 인 스 턴 스 가 공유 할 수 있 는 속성 과 방법 을 포함 하 는 것 입 니 다.원형 대상 을 사용 하 는 장점 은 모든 대상 의 실례 가 포 함 된 속성 과 방법 을 공유 할 수 있 도록 하 는 것 이다.

function Parent(name,age){
  Parent.prototype.name=name;
  Parent.prototype.age=age;
  Parent.prototype.sayHi=function(){
    console.log("Hi");
  };
}
var x = new Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

단점: 장점 은 단점 이 고 방법 속성 을 공유 할 수 있다 는 것 이다.구체 적 으로 아래 의 이 예 를 볼 수 있다.

function Parent(name,age){
  Parent.prototype.name=name;
  Parent.prototype.age=age;
  Parent.prototype.arr=["123","we"];
  Parent.prototype.sayHi=function(){
    console.log("Hi");
  };
}
var x = new Parent("Tom",12);
var y = new Parent("Tom1",12);
x.arr.push("x");
y.arr.push("y");
console.log(x.arr);//["123", "we", "x", "y"]
console.log(y.arr);//["123", "we", "x", "y"]

대상 x 가 자신의 속성 을 수정 하면 Y 대상 에 게 영향 을 줄 수 있 습 니 다.마찬가지 로 y 에 게 도 마찬가지다.이 건 분명 불합리 해, 너무 무서워!
1.5 조합 은 구조 함수 모델 과 원형 모델 을 사용한다.

function Parent(name,age){
　　//          ，         
  this.name=name;
  this.age=age;
}
//     
Parent.prototype.sayHi=function(){
  console.log("Hi");
};
//     
//         ，       constructor  ；
Parent.prototype={
  constructor:Parent,
  sayHi:function(){
    console.log("Hi");
  }
}
var x = new Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

이 예 에서 실례 속성 은 구조 함수 에서 정의 되 고 모든 실례 가 공유 하 는 속성 prototype 과 방법 은 원형 에서 정의 된다.
현재 가장 광범 위 하고 인정 도가 높 은 사용자 정의 형식 을 만 드 는 방법 입 니 다.
뒤의 몇 가지 방법 이 좀 변태 적 인 것 같다.
1.6 동적 원형 모드

function Parent(name,age){
  this.name=name;
  this.age=age;
  if( typeof this.sayHi !="function"){
    Parent.prototype.sayHi=function(){
      console.log("Hi");
    };
  }
}
var x = new Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

먼저 존재 해 야 할 방법 이 효과 가 있 는 지 확인 하고 원형 을 초기 화 할 필요 가 있 는 지 여 부 를 결정 합 니 다.
1.7 기생 구조 함수 모드
앞의 몇 가지 가 모두 적용 되 지 않 는 상황 에서 기생 구조 함수 모델 을 사용 할 수 있다.이 함수 의 기본 사상 은 함 수 를 만 드 는 것 입 니 다. 이 함수 의 역할 은 만 든 대상 의 코드 를 봉인 한 다음 에 새로 만 든 대상 으로 돌아 가 는 것 입 니 다.

function parent(name,age){
  var Child = new Object();
  Child.name=name;
  Child.age=age;
  Child.sayHi=function(){
    console.log("Hi");
  }
  return Child;
};
var x = Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

근 데 사실은 공장 모델 이랑 똑 같 아. 너 지금 나 놀 리 는 거 야????
1.8 온당 한 구조 함수 모드
온당 한 구조 함 수 는 기생 구조 함수 모델 과 유사 한 모델 을 따 르 지만 두 가지 차이 가 있다. 하 나 는 새로 만 든 대상 의 실례 방법 을 인용 하지 않 는 것 이다 constructor.둘째, 구조 함 수 를 사용 하지 않 는 다 this.

function Parent(name,age){
  var o=new Object();
　　 //        
  var name=name,
    age=age;
  o.sayName=function(){
　　　　 //name    this
    console.log(name+" "+age)
  }
  return o;
}
var x = Parent("Tom",12);
x.sayName(); //Tom 12

변수 x 에 저 장 된 것 은 안정 적 인 대상 이지 만 호출 new 방법 을 제외 하고 데이터 구성원 에 게 접근 할 수 있 는 다른 방법 이 없다.
더 많은 자 바스 크 립 트 관련 내용 은 본 사이트 의 주 제 를 볼 수 있 습 니 다.,,,,,,,,,,,,
본 고 에서 말 한 것 이 여러분 의 자 바스 크 립 트 프로 그래 밍 에 도움 이 되 기 를 바 랍 니 다.