JavaScript 디자인 패턴 캡슐화 및 정보 은닉(1부)_Javascript 기술

이 글은 두 부분으로 나누어져 있는데, 윗 부분에서는 전체 노출, 밑줄 표기, 클로저 사용 등의 내용을 다루고, 아랫 부분에서는 고급 패턴, 정적 메서드 및 속성 구현 방법, 기타 지식 포인트에 대해 설명합니다.
캡슐화는 객체지향 언어의 매우 기본적이고 유용한 기능입니다. JavaScript는 객체지향 언어라고도 할 수 있지만 비공개 및 보호를 사용하는 한 다른 언어와 달리 캡슐화에 대한 지원은 그리 좋지 않습니다. 그것은 달성될 수 있다. 하지만 그렇다고 해서 방법이 없다는 뜻은 아닙니다. 아래에서는 JavaScript로 캡슐화를 구현하는 방법을 소개하겠습니다.
1. 기본 패턴, 에는 크게 전체 노출 방식, 밑줄 표기 방식, 클로저 활용 등 3가지 방식이 있습니다. (폐쇄는 매우 중요하고 어려운 개념입니다. 관심 있는 친구들은 온라인으로 정보를 찾을 수 있습니다. 제 블로그에 다른 사람들의 글도 재인쇄했습니다.)
여기서는 book 클래스를 예로 들어 book 클래스를 생성하고 초기화해야 합니다.

코드 복사 코드는 다음과 같습니다.

// Book(isbn, 제목, 저자 )
var theHobbit = new Book('0-395-07122-4', 'The Hobbit', 'J. R. R. Tolkien');
theHobbit.display(); HTML 요소

1. 전체 노출 방법:
북 클래스를 생성할 때 가장 전통적인 생성자 방법인

코드 복사를 사용할 수 있습니다. 코드는 다음과 같습니다.

var Book = function(isbn, title,author) {
　if(!this.checkIsbn(isbn)) throw new Error('Book: Invalid ISBN.');
　this.isbn = isbn;
　//코드에서 ||의 기능은 제목에 값이 없으면 '제목이 지정되지 않음'이 할당된다는 것입니다. this.title로. 이 방법은 매우 유용하며 자신의 코드에서 사용할 수 있습니다.
　this.title = 제목 || '제목 지정 없음';
　this.author = 작성자 || '작성자 지정 없음'
}
Book.prototype = {
　//확인 isbn 함수
checkIsbn: function(isbn) {
},
//isbn 설정
setIsbn: function(isbn) {
if(!this.checkIsbn(isbn)) throw new Error ('도서: 잘못된 ISBN.');
this.isbn = isbn;
　},
// 제목 가져오기
getTitle: function() {
return this.title; > },
// 제목 설정
setTitle: function(title) {
　this.title = title || '지정된 제목 없음'
　},
　//저자 가져오기
　getAuthor: function() {
　return this.author;
　},
　//저자 설정
　setAuthor: function(author) {
　this.author = 작성자 || 작성자 지정 없음';
　//표시 기능
　display: function() {
　　...
　}
}; 코드가 많아서 여기서는 간단히 설명하겠습니다. JavaScript에서 클래스를 생성하는 것은 C# 및 Java와 약간 다릅니다. 예를 들어




코드 복사

코드는 다음과 같습니다.

public class book()
{

private string isbn public string ISBN { set { 　　this.isbn=value; (문자열 isdn) {

......

}
......
public void Display( )
{
.... .
}
}


Javascript도 이 방법을 사용할 수 있지만 위에서 사용한 방법을 사용하여 클래스 정의 함수(또는 생성자)에 속성을 정의하고 프로토타입 객체에 메서드를 정의하는 것이 좋습니다. 이유는 Google에 접속할 수 있습니다.
위의 js 코드가 달성하려는 기능은 세 가지 개인 변수(또는 속성) isbn, title, 작성자, 개인 메서드 checkIsbn 및 여러 공용 메서드 getIsdn, setIsdn을 포함하는 책 클래스를 정의하는 것입니다. .표시하다. 아이디어는 좋지만 현실은 잔혹하다. 사실 그런 사적 재산이나 방법은 전혀 사적이지 않다. 예를 들어, theHobbit.isbn = '978-0261103283'; 이 방법으로 isbn에 오류 없이 값을 할당할 수 있으며 완전히 성공합니다. 그 이유는 JavaScript에는 특정 객체를 사유화하는 비공개 방법이 없기 때문입니다. 또한 이 구현 방법은 사용 시 혼란을 야기할 수도 있습니다. 클래스 작성자는 어떤 속성과 메서드를 공개하려고 합니까? 아래에서는 첫 번째 개선 방법인 밑줄 표시 방법을 소개합니다.
　2. 밑줄 표기 :

코드 복사 코드는 다음과 같습니다.

var Book = function(isbn, title,author) {
// 생성자 코드
this.setIsbn(isbn)
this.setTitle(title)
this.setAuthor(author); 🎜> }
Book.prototype = { 　
　//isbn 함수 확인
　_checkIsbn: function(isbn) {
　　... function() { return this._isbn
},
//isbn 설정
setIsbn: function(isbn) { ('도서: 잘못된 ISBN.') This._isbn = isbn
},
...
display: function( ) { .. 　
　}
};


사실 비공개로 구현하려는 모든 속성이나 메서드 앞에 밑줄 _을 추가하면 됩니다. 작업. 이 방법은 진정한 민영화를 달성하지 못합니다. theHobbit._isbn = '978-0261103283'; 이 방법의 가장 큰 의미는 작성자가 노출하려는 개체와 노출하려는 개체를 클래스 사용자에게 알려주는 것입니다. 노출하고 싶지 않습니다. 그러나 작성자는 사용자가 작성자의 아이디어를 따르는지 여부를 제어할 수 없습니다.
그렇다면 진정한 민영화를 달성할 수 있는 방법이 있을까요? 대답은 '예'입니다. 클로저를 사용하는 것입니다.
3. 클로저 사용:
JavaScript가 진정한 캡슐화를 달성할 수 있는 이유는 고유한 함수 범위, 내부 함수에 대한 함수 지원 및 클로저와 분리될 수 없습니다. 온라인에 접속하여 관련 지식을 수집하여 이해를 심화할 수 있습니다.
아래에서 가장 먼저 이야기할 것은 함수 범위입니다. JavaScript에서는 변수가 함수 내부에 정의되어 있으면 함수 외부에서 해당 변수에 접근할 방법이 없습니다. 실제로 JavaScript에서 개인 속성이나 메서드를 구현하면 이 특수 속성을 활용할 수 있습니다. 예:

코드 복사


코드는 다음과 같습니다.

function foo() { 　var a = 10; 함수 bar() { a } bar() return a; 🎜> in 위의 예에서 함수 foo는 내부적으로 변수 a와 메소드 bar를 정의합니다. A와 bar는 foo 외부에서 액세스할 수 없습니다. 그러나 a와 bar는 모두 foo 내부에 정의되어 있으므로 bar는 a에 액세스할 수 있습니다. 그렇다면 foo 외부에서 bar에 액세스할 수 있는 방법이 있습니까? 대답은 '예'입니다. 클로저를 사용하는 것입니다.

코드 복사


코드는 다음과 같습니다.


function foo() {

　var a = 10 ;
함수 bar() {
a *= 2;

return a; } var baz = foo(); // baz는 이제 함수 bar에 대한 참조입니다. baz(); // 20을 반환합니다. baz(); // 40을 반환합니다. baz() // 80을 반환합니다. var blat = foo(); // blat는 bar에 대한 또 다른 참조입니다. blat(); // a의 새 복사본이 사용되기 때문에 20을 반환합니다. 앞서 JavaScript 함수가 내부 함수를 지원한다고 언급했습니다. 내부 함수 bar는 개인 변수 a에 접근할 수 있고, 함수 foo는 내부 함수 bar를 baz에 던지고, baz는 클로저를 구현하는 내부 변수 a에 접근할 수 있습니다. 이런 식으로 프라이빗 변수와 메소드가 실제로 구현되는 것은 누구나 한 눈에 알 수 있습니다. 이전 책 예제로 돌아가서 구현은 다음과 같습니다.

코드 복사


코드는 다음과 같습니다.

var Book = function(newIsbn, newTitle, newAuthor) {
　　// Publication 구현
　　// Private 속성.
　　var isbn, 제목, 저자;
　　// 비공개 방식입니다.
　　function checkIsbn(isbn) {
　　　　...
　　}
　　// 권한 있는 메서드.
　　this.getIsbn = function() {
　　　　return isbn;
　　};
　　this.setIsbn = function(newIsbn) {
　　　　if(!checkIsbn(newIsbn)) throw new Error('도서: 잘못된 ISBN.');
　　　　isbn = newIsbn;
　　};
　　this.getTitle = function() {
　　　　반환 제목;
　　};
　　this.setTitle = function(newTitle) {
　　　　title = newTitle || '제목이 지정되지 않았습니다';
　　};
　　this.getAuthor = function() {
　　　　작성자 반환;
　　};
　　this.setAuthor = function(newAuthor) {
　　　　author = newAuthor || '지정된 작성자 없음';
　　};
　　// 생성자 코드입니다.
　　this.setIsbn(newIsbn);
　　this.setTitle(newTitle);
　　this.setAuthor(newAuthor);
};
// 권한이 없는 공개 메서드입니다.
Book.prototype = {
　　display: function() {
　　　　...
　　}
};

上述代码就实现了 isbn, 제목, 작성자 와checkIsbn적私유화，외부是决定不能直接访问到的。如需访问 isbn, 제목, 작성자只能过对象级방법getTitle ，setTitle...。比如要给给给赋值，只能用theHobbit.setIsbn = '978-0261103283';，如果你还用theHobbit._isbn = '978-0261103283';，对不起要报错

　好了，今天的内容就讲到这里了，希望对大家有帮助。
작가：下一站永远