JavaScript 클래스 와 패키지
6554 단어 자 바스 크 립 트 일상
1. JavaScript 클래스
클래스 와 대상 을 대상 으로 프로 그래 밍 하 는 비밀 은 구분 할 수 없다. 대상 을 대상 으로 프로 그래 밍 하 는 것 은 수 요 를 하나의 대상 (클래스) 으로 추상 화한 다음 에 이 대상 을 대상 으로 그 특징 (속성) 과 동작 (방법) 을 분석 하 는 것 이다.그것 의 특징 중 하 나 는 필요 한 기능 을 한 대상 에 두 는 것 이다.어떻게 JavaScript 에서 클래스 를 만 듭 니까?
1.ES5
먼저 하나의 함수 가 하나의 변수 에 저 장 된 것 을 설명 한 다음 에 이 함수 (이 함수 가 클래스 라 고 할 수 있 습 니 다) 내부 에서 this 변수 에 속성 명 이나 방법 을 추가 하여 클래스 에 속성 이나 방법 을 추가 합 니 다.
var Book = function(id, bookname, price){
this.id = id;
this.bookname = bookname;
this.price = price;
}
이상 에서 클래스 북 (클래스 이니셜 대문자) 을 만 들 었 습 니 다. 이런 클래스 를 만 드 는 방식 도 구조 함수 모드 라 고 합 니 다.클래스 의 원형 에 속성 과 방법 을 추가 할 수도 있 고 두 가지 방식 이 있 습 니 다.
Book.prototype.display = function(){};
Book.prototype = {
display: function(){}
};
이렇게 하면 우 리 는 필요 한 방법 과 속성 을 모두 Book 류 에 밀봉 할 수 있 습 니 다. 이 방법 을 호출 할 때 새로운 키 워드 를 사용 하여 새로운 대상 을 예화 해 야 합 니 다.
var newBook = new Book(10, "JavaScript", 50);console.log(newBook.bookname); //JavaScript
new 키워드 실례 화 대상 을 통 해 간단 한 내부 절 차 를 거 쳤 습 니 다. 먼저 새로운 대상 newBook 을 만 든 다음 에 구조 함수 Book 의 역할 영역 에 값 을 부여 합 니 다. 따라서 this 는 Book 을 가리 키 고 마지막 으로 원 하 는 방법 을 수행 합 니 다.그럼 다음 코드 를 분석 해 보 겠 습 니 다.
Book(10, "JavaScript", 50);// ?window.id; //10
위의 결 과 를 통 해 우 리 는 북 구조 함 수 를 호출 할 때 새로운 대상 에 게 값 을 부여 하지 않 았 기 때문에 this 가 가리 키 는 역할 영역 은 전체 역할 영역 입 니 다. 우 리 는 window 대상 을 통 해 북 구조 함수 안의 방법 을 호출 할 수 있 습 니 다.
2.ES6
ES6 에 서 는 Class (클래스) 라 는 개념 을 도입 하 였 으 며, class 키 워드 를 통 해 클래스 의 생 성과 사용 을 크게 편리 하 게 하 였 으 며, 상기 원형 에 속성 을 추가 한 코드 를 class 로 다음 과 같이 바 꾸 었 습 니 다.
class Book{
constructor(id, bookname, price){
this.id = id;
this.bookname = bookname;
this.price = price;
}
display(){
//...
}}
//
var Book = function(id, bookname, price){
this.id = id;
this.bookname = bookname;
this.price = price;};
Book.prototype = {
display: function(){}
};
class 는 function 의 쓰 기 를 생략 했다.마지막 으로 점 문법 을 통 해 함수 내부 에 속성 을 추가 하 는 것 과 prototype 을 통 해 속성 을 만 드 는 차이 점 을 살 펴 보 겠 습 니 다. 함수 내부 에 점 문법 을 통 해 속성 을 추가 합 니 다. new 연산 자 를 사용 하여 새로운 Book 인 스 턴 스 를 만 들 때 해당 하 는 this 는 이 새로운 인 스 턴 스 를 가리 키 기 때문에 id 와 bookmname 등 내부 방법 도 생 성 됩 니 다. 즉, 모든 함 수 를 정의 하 는 것 입 니 다.하나의 대상 을 예화 시 켰 습 니 다. 모든 방법 은 인 스 턴 스 마다 다시 만 들 었 습 니 다. prototype 을 통 해 새로운 대상 을 만 들 때마다 이 속성 과 방법 은 다시 만 들 지 않 습 니 다.
2. 봉인
함수 내부 역할 영역 은 외부 환경 에서 내부 역할 영역 에 접근 할 수 없 는 개인 속성 과 개인 적 인 방법 입 니 다. this 를 통 해 만 든 방법 이나 속성 은 외부 환경 에서 접근 할 수 있 기 때문에 this 가 정의 하 는 이러한 방법 이나 속성 은
공통 속성 과
공 (공) 은 방법 이 있 는데, 통칭 하여 특권 방법 이 라 고 한다.
var Book = function(id, name, price){
var num = 1; //
function checkId(){}; //
this.getName = function(){}; //
this.id = id; //
this.setName(name);
this.setPrice(price); // }
new 키 워드 를 통 해 대상 을 예화 할 때 this 정 의 를 통 해 접근 할 수 있 지만 상기 코드 의 개인 속성 은 접근 할 수 없습니다. 이것 은 예화 대상 이 외부 인 스 턴 스 대상 으로 역할 영역 을 옮 겼 기 때 문 입 니 다. 외 부 를 통 해 내부 의 개인 속성 에 접근 할 수 없 기 때 문 입 니 다. this 정의 방법 은 이 방법의 역할 영역 을 예화 대상 으로 가리 키 기 때 문 입 니 다.그렇다면 방법 이 점 문법 이나 원형 모드 를 통 해 만들어 진다 면 외부 에서 이런 방법 에 접근 할 수 있 을 까?
Book.isChinese = true;Book.resetTime = function(){
console.log('new time')
};
Book.prototype = {
jsJSBook : false,
display: function(){}
}
new 키 워드 를 사용 하여 새로운 대상 을 만 들 때 클래스 밖에서 점 문법 을 통 해 추 가 된 속성 과 방법 이 실행 되 지 않 았 기 때문에 새로운 대상 을 얻 을 수 없습니다. 클래스 밖에서 점 문법 을 통 해 정 의 된 속성 을 정적 공유 속성 이 라 고 하고 정의 하 는 방법 을 정적 공유 방법 이 라 고 합 니 다.프로 토 타 입 프로 토 타 입 을 통 해 정 의 된 속성 과 방법 을 공유 속성 과 공유 방법 이 라 고 합 니 다. 새로운 대상 의 프로 토 타 입 프로 토 타 입 과 북 류 의 프로 토 타 입 프로 토 타 입 은 같은 대상 을 가리 키 고 있 습 니 다. 즉, 북. prototype. isPrototypeof (new Book) 이기 때문에 만 든 새로운 대상 은 클래스 의 외부 에서 프로 토 타 입 을 통 해 만 든 공유 속성 과 공유 방법 을 방문 할 수 있 습 니 다.