모노리스는 네임 스페이스를 나누고 관련된 속성과 방법을 구성하는 데 사용되는 객체입니다. 그녀가 인스턴스화 할 수 있다면, 그녀는 한 번만 인스턴스화 할 수 있습니다 (두 번째 결혼이 아니라 한 번만 결혼 할 수 있습니다).
모 놀리 식 패턴은 JavaScript에서 가장 기본적이지만 유용한 패턴 중 하나입니다.
특징:
1. 네임 스페이스를 나누어 글로벌 변수의 위험이나 영향을 제거하는 데 사용될 수 있습니다.
2. 분기 기술을 사용하여 브라우저 간의 차이를 캡슐화하십시오.
3. 코드는 한 가지 방식으로 더 구성하여 읽고 유지하기가 더 쉽습니다.
단일 바디 모드의 기본 쓰기 :
/* 가장 기본적인 단량체 패턴*/ var her = {이름 : 'Anna', 섹스 : '여자', '여자', say : function () {// 일부 처리 로직 ...}, doing : function () {// 기타 처리 함수 ...}}1. 네임 스페이스 분할 :
var box = {너비 : 0, 높이 : 0, getArea : function () {return this.width * this.width; // JS의 객체에 대한 액세스를 표시해야합니다. 즉, 생략 할 수 없습니다}, init : function (w, h) {// width = w; // height = h; 이 방법은 두 가지 글로벌 변수를 정의하는 것과 같습니다 (var로 선언되지 않은 변수는 글로벌 변수입니다) // 객체의 너비와 높이에 대한 할당이 아닙니다. // 다음은 올바른 것입니다 .width = w; this.height = h;}} // 상자는 네임 스페이스를 나누고 네임 스페이스의 변수는 공간에서만 유효합니다.상기 단량체의 모든 구성원 및 방법은 공개적이며, 즉 단량체 외부에서 임의로 변경 될 수 있습니다 (그러나 로컬 변수에 액세스 할 수는 없습니다). 그렇다면 왜 단량체가 네임 스페이스를 제공합니까?
걱정하지 마세요. 계속 봅시다 :
var box = {너비 : 0, 높이 : 0, // 단량체 getArea : function () {리턴 너비 * 높이; // 너비, 높이는 단일체 변수가 아니지만 init} init} init} init} init : h) {width = w; height = h;}}} // init in at a varlive가 아닙니다. box.getArea (); Alert (init);}init의 너비와 높이가 초기화되지 않으므로 오류 가보고되므로 다음과 같이 변경하십시오.
var box = {너비 : 0, 높이 : 0, getArea : function () {return width * height;}, init : function (w, h) {width = w; height = h;}} window.onload = function () {width = 0; height = 0; // 또는 box.init (0,0); var init = box.getarea ();괜찮다는 것이 밝혀졌습니다. init와 getarea가 사용하는 너비와 높이는 Monolith가 소유 한 변수가 아니라 전역 변수이므로 영향을받지 않고 모노리스 외부에서 임의의 전화를 걸 수 있습니다.
var box = {너비 : 0, 높이 : 0, getArea : function () {반환 너비 * 높이; // js의 물체 액세스를 표시해야합니다. box.getArea (); 경고 (너비);}이런 식으로 오류 가보고 될 것으로보고 될 것입니다. 위의 메소드는 글로벌 변수에 대한 네임 스페이스를 생성하지 않으며 전역 변수는 우리에게 위험을 초래한다는 것을 알 수 있습니다. 따라서 맨 위 단어가 정확합니다. 확인하겠습니다.
var box = {너비 : 2, 높이 : 2, getArea : function () {return this.width * this.Height; / / js 액세스를 표시해야합니다. // 모노리스의 로컬 변수, 즉 네임 스페이스 높이 = 0에 영향을 미치지 않습니다. // 모노리스의 로컬 변수, 즉 네임 스페이스 var width = box.getArea (); Alert (width);}에 영향을 미치지 않습니다.창의 너비와 높이는 단량체의 폭과 높이에 대한 네임 스페이스를 설정했기 때문에 방해가 없다는 것을 알 수 있습니다.
2. 회원 속성 :
JavaScript에는 이러한 엄격한 객체 지향 (OOP)이 없지만 클로저를 사용하여 모방 할 수 있습니다. 결국, 일부 변수를 공개적으로 설정하는 것은 좋지 않습니다.
var her = (function () {var name = 'anna'; var sex = 'weel'; return {getArea : function () {return name + '는' + sex;}, init : function (b) {name = b;}}} (); window.onload = function () {he.name = 'Jock'; // ALERT에 액세스 할 수 없습니다 (ger.getArea ()); he.init ( 'lous'); Alert (he.getArea ());}개인 변수와 방법은 읽기 전용이며 공용 변수와 방법은 읽을 수 있습니다.
입장:
개인 회원의 경우 이전 수정없이 직접 액세스 할 수 있습니다.
대중의 접근을 위해,“이것”. 단량체 범위 전에 추가해야합니다. (모노디 이름)
3. 지점 기술을 사용하여 브라우저 간의 차이를 캡슐화하십시오
참고 :
에이. 인스턴트 바인딩을 달성하기 위해 클로저를 사용하십시오
비. 세미콜론으로 각 지점을 분리하십시오
기음. 반환하는 마지막 것은 지점의 이름입니다.
디. 호출 할 때 단일 이름 + 브랜치 메소드 이름을 사용하십시오.
// 단량체 분기 기술을 사용하여 XHR (XMLHTTPREQUEST) 객체를 정의하고 var XHR = () {// 세 가지 분기 표준 = {cxHr : {cxhr :} {var activexnew = {) {return (var XMHR :}} {var activexnew = {cxhr :) {cxhr : var xhr : var xhr =} {close () {function ()을 구현해야합니다. ActiveXobject ( 'msxml2.xmlhttp');}}}; var activexold = {cxhr : function () {return new ActiveXobject ( 'microsoft.xmlhttp');}}; // 지정을 할당하고, 각 방법을 시도하지 않으려면; {testob reture rinte rinate rinate = reture r endract. 오류가 발생하지 않은 경우} catch (e) {try {testobject = activexnew.cxhr (); return activexnew;} catch (e) {try {testobject = activexold.cxhr (); return activexnew;} catch (e) {try testobject = activexold.cxhr (); xmlhttprequestobject! ');} (); window.onload = function (alert (xhr.cxhr));}위는 편집자가 소개 한 JavaScript 디자인 패턴의 단일 바디 모델에 대한 포괄적 인 분석입니다. 모든 사람에게 도움이되기를 바랍니다. 궁금한 점이 있으면 메시지를 남겨 주시면 편집자가 제 시간에 모든 사람에게 답장을 드리겠습니다. Wulin.com 웹 사이트를 지원해 주셔서 대단히 감사합니다!