오늘 Rank의 기사 javascript script control topic을 읽었는데 갑자기 JS 구성 요소를 작성하는 방법이나 사람들의 다양한 코딩 스타일을 요약하고 싶었습니다.
먼저 Prototype에 쓴 글을 살펴보겠습니다.
var Class = {
create: function() {
return function() { this.init.apply(this, 인수) }
}
}
var A = 클래스 .create();
A.prototype = {
init: function(msg) {
this.msg = msg;
},
fn: function( ) {
경고(this.msg);
}
}
var a = new A("myMsg")
a.fn()
마음에 들지 않으면 위와 같은 Class.create 등을 많이 수행할 수도 있습니다.
A.prototype = {
init: function(msg) {
this.msg = msg;
},
fn: function() {
alert(this.msg)
}
}
var a = new A() ;
a.init("myMsg ");
a.fn();
물론 this.msg의 초기화를 함수 A(msg)에 넣을 수도 있습니다. {this.msg=msg;}. 간단히 말해서, 이렇게 호출하는 것은 번거롭고 매개변수는 고정되어 있고 대응된다는 것을 알게 될 것입니다.
Class.create를 많이 만들고 싶지 않거나 호출이 불편하다면 Prototype에서 var Class = {...}와 var A = Class.create();를 병합하세요. 가져오기:
this.init.apply(this, 인수);
}
A.prototype = {
init: function(msg) {
this.msg = msg; 🎜>fn: function() {
alert(this.msg);
}
}
var a = new A("myMsg")
a.fn(); 🎜>
훨씬 깔끔해보이지만, 라이브러리에 컴포넌트가 많을 경우 각 컴포넌트마다 this.init.apply(this, Arguments)를 작성해야 합니다. Class.create를 사용하는 경우에는 다음과 같이 작성하면 됩니다. 하나의 클래스를 만든 다음 각 구성 요소에서 Class.create()를 실행합니다. 물론, 각 구성 요소에 대해 this.init.apply(this, 인수)를 작성하는 데에는 아무런 문제가 없습니다. 또한, 프로토타입 메소드를 함께 작성할 것인지, 별도로 작성할 것인지도 개인 취향입니다. 캡슐화의 관점에서는 이들을 결합하는 것이 더 좋지만 때로는 분리하는 것이 더 명확할 수도 있습니다. 예를 들어 A.prototype.init=function(msg){...} A.prototype.fn=function(){...}
어떤 사람들은 다음과 같은 구성 요소를 작성하는 것을 좋아합니다.
코드 복사
}
var privateFn2 = function() {
alert(_this.msg) );
}
return { fn1: privateFn1, fn2: privateFn2 }
}
var a = new A("myMsg"); fn1();
A가 생성한 객체를 임시 변수 _this에 넣어야 합니다. 왜냐하면 런타임 시 privateFn1의 함수 본문에 있는 this는 실제로 {fn1:...,fn2이기 때문입니다. :...} 익명 개체와 마찬가지로 this.hasOwnProperty("fn1")을 사용하여 테스트할 수 있습니다. 이는 런타임에만 의미가 있는 것입니다. 또한 이 메서드의 각 객체에는 privateFn1 및 privateFn2의 복사본이 있는데 이는 그다지 좋지 않습니다.
(계속해서 다양한 프레임워크에 대한 몇 가지 작성 방법에 대해 설명합니다.)
저자: JayChow