소개하다
이 기사는 주로 객체를 만드는 패턴을 소개합니다. 다양한 기술을 사용하면 오류를 크게 피하거나 매우 간소화 된 코드를 작성할 수 있습니다.
패턴 1 : 네임 스페이스
네임 스페이스는 명명 충돌이나 과도한 성을 피하기 위해 필요한 글로벌 명명의 양을 줄일 수 있습니다. 일반적으로 객체 레벨을 정의 할 때 종종 다음과 같습니다.
코드 사본은 다음과 같습니다.
var 앱 = 앱 || {};
app.modulea = app.modulea || {};
app.modulea.submodule = app.modulea.submodule || {};
app.modulea.submodule.methoda = function () {
Console.log ( "Print A");
};
app.modulea.submodule.methodb = function () {
Console.log ( "Print B");
};
수준이 많으면 이렇게 계속해야합니다. 이는 매우 혼란 스럽습니다. 이 문제를 해결하기 위해 네임 스페이스 패턴이 존재합니다. 코드를 살펴 보겠습니다.
코드 사본은 다음과 같습니다.
// 안전하지 않으면 기존 MYAPP 객체를 덮어 쓸 수 있습니다
var myapp = {};
// 괜찮은
if (typeof myApp === "undefined") {
var myapp = {};
}
// 더 간단한 방법
var myapp = myapp || {};
// 일반적인 방법을 정의합니다
myapp.namespace = function (ns_string) {
var parts = ns_string.split ( '.'),
parent = myapp,
나;
// 기본적으로 첫 번째 노드가 myApp 인 경우 myApp.Modulea와 같이 무시됩니다.
if (parts [0] === "myApp") {
parts = parts.slice (1);
}
for (i = 0; i <parts.length; i += 1) {
// 속성이 존재하지 않으면 작성하십시오
if (parent typeof parent [part [i]] === "undefined") {
부모 [부품 [i]] = {};
}
parent = parent [parts [i]];
}
반환 부모;
};
코드를 호출하는 것은 매우 간단합니다.
코드 사본은 다음과 같습니다.
// 네임 스페이스 이후 리턴 값을 로컬 변수에 할당 할 수 있습니다.
var module2 = myapp.namespace ( 'myapp.modules.module2');
console.log (module2 === myApp.Modules.Module2); // 진실
// myApp을 건너 뜁니다
myapp.namespace ( 'modules.module51');
// 아주 긴 이름
myapp.namespace ( 'Once.upon.a.time.there.this.long.nested.property');
패턴 2 : 종속성 정의
때로는 모듈이나 기능이 일부 타사 모듈 또는 도구를 참조 할 수 있습니다. 이러한 종속 모듈을 처음에는 이러한 종속 모듈을 향후 쉽게 교체 할 수 있도록하는 것이 가장 좋습니다.
코드 사본은 다음과 같습니다.
var myFunction = function () {
// 모듈에 따라 다릅니다
var event = yahoo.util.event,
dom = yahoo.util.dom;
// 로컬 변수 이벤트 및 DOM은 다른 함수 다음에 코드에 사용됩니다.
};
패턴 3 : 개인 속성 및 개인 방법
JavaScript는 개인 속성 및 개인 방법을 지원하기위한 특정 구문을 제공하지 않지만 폐쇄를 통해이를 구현할 수 있습니다. 코드는 다음과 같습니다.
코드 사본은 다음과 같습니다.
기능 가제트 () {
// 개인 객체
var name = 'iPod';
// 공개 기능
this.getName = function () {
반환 이름;
};
}
var 장난감 = 새로운 가제트 ();
// 이름은 정의되지 않았으며 비공개입니다
Console.log (Toy.Name); // 한정되지 않은
// 공개 메소드 액세스 이름
console.log (toy.getName ()); // "iPod"
var myobj; // 자체 실행 함수를 통해 MyOBJ에 값을 할당합니다
(기능 () {
// 무료 객체
var name = "my, oh my";
// 공개 부분을 구현하므로 var가 없습니다.
myobj = {
// 승인 방법
getName : function () {
반환 이름;
}
};
} ());
모드 4 : 요한 계시록 모드
또한 개인 메소드를 숨기는 것에 관한 것이며, 이는 "JavaScript 시리즈 (3)에 대한 심층적 인 이해 : 모듈 패턴의 포괄적 인 분석"에서 모듈 패턴과 다소 유사하지만 반환 방법은 아니지만 변수는 외부로 선언 된 다음 내부적으로 변수에 공개 메소드를 할당합니다. 코드는 다음과 같습니다.
코드 사본은 다음과 같습니다.
var myarray;
(기능 () {
var ast = "[객체 배열]",
tostring = object.prototype.tostring;
기능 isarray (a) {
return tostring.call (a) === ast;
}
함수 indexof (Haystack, 바늘) {
var i = 0,
max = haystack.length;
for (; i <max; i += 1) {
if (haystack [i] === needle) {
반환 i;
}
}
반품 -1;
}
// 과제를 통해 위의 모든 세부 사항은 숨겨져 있습니다
myArray = {
Isarray : Isarray,
indexof : indexof,
inarray : indexof
};
} ());
// 테스트 코드
console.log (myarray.isarray ([1, 2])); // 진실
console.log (myArray.isArray ({0 : 1})); // 거짓
console.log (myarray.indexof ([ "a", "b", "z"], "z")); // 2
console.log (myarray.inarray ([ "a", "b", "z"], "z")); // 2
myarray.indexof = null;
console.log (myarray.inarray ([ "a", "b", "z"], "z")); // 2
모드 5 : 체인 모드
체인 모드를 사용하면 obj.add (1) .remove (2) .delete (4) .add (2)와 같은 객체 메소드를 지속적으로 호출 할 수 있습니다. 구현 아이디어는 매우 간단합니다. 코드는 다음과 같습니다.
코드 사본은 다음과 같습니다.
var obj = {
가치 : 1,
증분 : function () {
this.value += 1;
이것을 반환하십시오;
},
추가 : 함수 (v) {
value += v;
이것을 반환하십시오;
},
외침 : function () {
Console.log (this.value);
}
};
// 체인 메소드 호출
obj.increment (). add (3) .shout (); // 5
// 하나도 하나씩 호출 할 수 있습니다
obj.increment ();
obj.add (3);
obj.shout ();
요약
이 기사는 객체 생성 모드의 이전 기사이므로 내일 다음 기사를 계속 지켜봐 주시기 바랍니다.