> 웹 프론트엔드 > JS 튜토리얼 > 프로토타입 1.5 및 scriptaculous 1.6.1 연구 노트_prototype

프로토타입 1.5 및 scriptaculous 1.6.1 연구 노트_prototype

WBOY
풀어 주다: 2016-05-16 19:26:29
원래의
1291명이 탐색했습니다.

처음에는 프로토타입 1.4를 기반으로 한 otalk 작업을 시작했는데, 나중에 scriptaculous 1.6.1을 추가했기 때문에 프로토타입 버전을 1.5로 해달라고 요청해서 1.5로 업그레이드했습니다. 데모.
사용 중에 결과가 여러 번 만족스럽지 않아서 나중에 정리할 것입니다. 코드를 보고 싶었지만 이해가 되지 않았습니다. 스크립트와 프로토타입의 코드를 이해하세요!

여기 제 연구 노트가 있습니다. 순서와 논리가 없을 수도 있습니다. 연구가 끝나면 최종적으로 정리하겠습니다.

첫 번째는 수업을 정의하기 위해 Xiaoxiao 선생님의 몇 가지 소개를 본 후 실험을 해보면 많은 것들이 이해가 되지만 실제로는 상당히 다릅니다

var Class = {
create: function() {
return function() {
this.initialize.apply(this, 인수)
}
}
}

은 클래스 생성을 위한 템플릿 또는 프로토타입으로서의 클래스 함수
메서드
var llinzzi= Class.create( )
llinzzi.prototype = {
초기화:function(){
문서. write('인스턴스 생성됨');
},
fun1:function(){document.write ('인스턴스에 의해 메소드가 호출됨');}
}

var linChild = new llinzzi();
실행하면 인스턴스 생성 시 초기화가 호출되었음을 나타내는 'Instance is Created'가 출력됩니다.
클래스 코드를 살펴보면
return function() {
this.initialize.apply( this, 인수);
}
create 메소드가 실행되면 호출이 시작되는 것을 볼 수 있습니다.
linChild.fun1()
'인스턴스에 의해 호출된 메소드', fun1 메소드가 출력됩니다.
즉, 프로토타입의 Class.create() 메소드를 사용하여 객체를 생성할 때 초기화를 위한 인스턴스 생성 시 특수 메소드로 실행됩니다. 🎜>Object.extend = function(destination, source) {
for (source의 var 속성) {
Destination[ property] = source[property];
}
반환 대상; }

사용법
Object.extend(destination, source);
이상하게 느껴지는 것은 scriptaculous의 코드 조각입니다.
var options = Object.extend({
greedy : true,
hoverclass: null,
tree: false
}, 인수[1] || {})
옵션을 정의하므로 객체를 사용해야 하는 이유는 무엇입니까? 확장 메소드
직접
var options ={
Greedy: true,
hoverclass: null,
tree: false
}
이거면 충분하지 않나요? 문제가 있습니다. 목표가 되어야 하는 인수가 있습니다. 목표는 함수의 매개변수를 분석하고 가져오는 것입니다. {}인 경우에는 두려운 일입니다. .있는 경우에는 {hoverclass:'xx'} 형식입니다. 아, 옵션을 정의하는 것이 그렇게 간단하지 않다는 것이 밝혀졌습니다. 먼저 매개 변수가 있는지 여부에 관계없이 Object를 사용하십시오. .extend 메소드는 매개변수의 객체를 이전 { Greedy: true, hoverclass: null, tree: false}에 추가하거나 덮어씁니다. 매개변수가 없으면 위의 var options = {}; 이때 매개변수에 {hoverclass:'abc'}가 있으면 원래 hoverclass 값인 null을 덮어쓰고, 그러면 Object.extend 메소드의 반환값은 첫 번째 매개변수를 덮어쓴 후의 전체 값이 됩니다
감탄해야 합니다. 단락별로 정의하고 기본값을 설정합니다.
읽을수록 흥미로워지므로 계속 읽어보세요.

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿