>  기사  >  웹 프론트엔드  >  프로토타입 ObjectRange 객체 학습_prototype

프로토타입 ObjectRange 객체 학습_prototype

WBOY
WBOY원래의
2016-05-16 18:49:54991검색

범위는 값의 간격을 나타냅니다. 즉, 한 값에서 다음 값(후속 값)으로 이동할 수 있는 succ 메서드를 구현하려면 값 유형이 "호환"되어야 합니다. Number 및 String에 대한 메서드를 사용하지만 이를 기반으로 범위를 활성화하려면 개체에 유용한 의미 체계를 구현하는 것이 좋습니다.

ObjectRange 개체는 기본적으로 하나의 메서드만 포함하는 연속 숫자 또는 문자열을 구현합니다. , include - 숫자나 문자열이 ObjectRange에 있는지 확인합니다. 그리고 ObjectRange 객체도 Enumerable 메소드와 혼합되어 있으므로 ObjectRange 객체에서 Enumerable 객체의 메소드를 직접 호출할 수 있습니다.


//ObjectRange를 생성하는 편리한 방법
function $ R(start, end, Exclusive) {
return new ObjectRange(start, end, Exclusive)
}

//ObjectRange 객체를 생성하고 Enumerable
var에서 상속 ObjectRange = Class.create(Enumerable, (function() {
//초기화 방법, Exclusive가 true인 경우 종료 값은 포함되지 않습니다. 기본값은 정의되지 않으며 false와 같습니다.
function 초기화(start , end, Exclusive) {
this.start = start;
this.end = end;
this.exclusive
}

// ObjectRange 객체를 탐색할 때 열거 가능 이 메서드를 사용해야 합니다.
function _each(iterator) {
var value = this.start;
while (this.include(value)) {
iterator(value );
value = value.succ();
}
}

//ObjectRange 객체에 값이나 문자열이 포함되어 있는지 확인
function include(value) {
if (value < this.start)
return false
if (this.exclusive)
return value < this.end
return value <= this.end;
}

return {
초기화: 초기화,
_each: _each,
include: 포함
})());


보기 예를 들어 몇 가지 세부 사항을 자세히 설명하겠습니다.


코드 복사 코드는 다음과 같습니다. $A ($R('a', 'e'))
// -> e'], 놀랄 일은 아닙니다

//아래에 반환된 결과를 출력하려고 하지 마십시오. 그렇지 않으면 브라우저가 직접 종료됩니다
$A($R('ax', 'ba'))
// -> ['ax', 'ay', 'az', 'a{', 'a|', 'a}', 'a~'...]로 시작하는 엄청난 배열입니다.


$A($R('a', 'e')) 와 값을 반환하는 방법에 대해 이야기해 보겠습니다. 먼저 $A 메소드를 살펴보겠습니다. $A 메소드는 이전 글 [프로토타입 학습 - 도구 함수 학습($A 메소드)]에서 자세히 설명했습니다. $A 메소드에는 다음 문장이 있습니다. if ('toArray' in Object(iterable)) return iterable.toArray(); 우리는 ObjectRange가 Enumerable의 메소드와 혼합되어 있다는 것을 알고 있습니다. 이는 toArray 메소드가 간접적으로 구현된다는 것을 의미합니다. Enumerable의 toArray 메서드를 살펴보겠습니다.


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

function toArray() {
return this.map();

//======> this.map()

//Return 시 map 메소드가 Collect 메소드
return {
//...
collect:collect,
map:collect,
/에 매핑되는 것을 확인했습니다. / ...
}

//======>collect()

//이 경우 이 메서드는 실제로 배열을 반환하는 것과 동일합니다. 전달 모든 수신 매개변수가 정의되지 않았습니다. 여기에 this.each 메소드가 있습니다.
function Collect(iterator, context) {
iterator = iterator || Prototype.K;
var results =
this를 살펴보세요. Each( function(value, index) {
results.push(iterator.call(context, value, index));
}) 결과 반환
}

// ======> this.each()

//드디어 this._each를 보았습니다. 이제 ObjectRange에서 _each 메서드가 재정의된 이유를 이해합니다.
function Each(iterator, context) {
var index = 0;
try {
this._each(function(value) {
iterator.call(context, value, index );
} catch (e) {
if (e != $break) throw e;
}
>
//======> this._each()

//this._each() 자세히 설명
//핵심은 succ() 메소드입니다. 메소드는 _each에서 다음 값을 생성하는 데 사용됩니다.
//이 succ()는 어디에 있나요? 이 메소드는 Number.prototype 및 String.prototype에 정의되어 있습니다.
function _each(iterator) {
var value = this.start;
while (this.include(value)) {
iterator( value );
value = value.succ();
}
}

//다음 두 가지 방법은 다루지 않겠습니다.

//======> String.prototype.succ()

function succ() {
return this.slice(0, this.length - 1)
String.fromCharCode(this.charCodeAt(this.length - 1) 1)
}

//======> Number.prototype.succ()

function succ() {
return this 1;
}

//요약하자면 Date 유형과 같은 다른 유형의 ObjectRange 객체를 정의하려는 경우 다음을 수행할 수 있습니다. 연속 객체를 생성하려면 succ() 메소드를 직접 구현해야 합니다


위의 과정은 명확하지만 일부 기능은 자세히 설명되지 않습니다. 이러한 객체를 언급할 때 내부 기능에 대해 설명합니다. 자세히. include의 몇 가지 예를 살펴보겠습니다.



코드 복사
// -> ; false
$R(1, 10).include(10)
// -> true
$R(1, 10, true).include(10)
// -> ; 거짓

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사:Javascript 이벤트 흐름 및 이벤트 바인딩_javascript 기술다음 기사:Javascript 이벤트 흐름 및 이벤트 바인딩_javascript 기술

관련 기사

더보기