프로토타입 Framework_javascript 스킬의 달러 기호 $ 사용 분석

이 기사의 예에서는 프로토타입 프레임워크에서 달러 기호 $의 사용법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.

프로토타입은 객체 지향 구현을 위한 중요한 도구이자 JavaScript를 위한 좋은 프레임워크입니다.
jquery를 사용하는 사람은 jquery에 $ 달러 기호가 있고 프로토타입에도 $가 있다는 것을 알고 있습니다. 이들의 차이점은 무엇입니까?

1. 프로토타입에서 $() 사용

프로토타입은 $("test") 또는 $$("#test")로 작성되며 이는 js의 document.getElementById("test");
와 동일합니다. jqueryp 작성 방법 $("#test") 는 js의 document.getElementById("test");

와 동일합니다.

2. 프로토타입에서 $$() 사용

jquery에서 $("div")를 작성하는 것은 document.getElementsByTagName('div')와 동일합니다
프로토타입이 단순히 페이지의 모든 div 요소를 가져오려는 경우에는 이렇게 작성할 수 없습니다.
프로토타입을 작성하는 방법은 document.getElementById("div")
와 동일한 $("div")입니다. 프로토타입을 작성하는 방법은 document.getElementsByTagName('div')
과 동일한 $$("div")입니다. 프로토타입 작성 방법 $$("input[value=tank]")는 페이지에서 입력 상자 값이 탱크인 레이블을 가져옵니다. 이는 추가 $ 기호

가 있다는 점을 제외하면 실제로 jquery와 유사합니다.

3. 프로토타입에서 $A() 사용

$A는 주로 배열로 사용할 수 있는 컬렉션(예: NodeList, 많은 DOM 메서드에서 반환된 HTMLCollection 또는 함수 개체의 인수 속성)을 실제 Array 개체로 변환하는 데 사용됩니다. 다음 네 가지 방법으로 페이지에서 div 태그를 숨길 수 있습니다

$A($$('div')).each(Element.hide); 
$A($$('div')).map(Element.extend).invoke("hide"); 
//从思想上来看，下面二种写法，我在用jquery时，也经常用 
$A($$('div')).each(function(name,index){ 
 name.style.display='none'; 
 alert(name.innerHTML); 
 }) 
 $A($$('div')).each(function(name,index){ 
 $(name).hide(); 
}) 

TypeError: element.style is undefine { message="element.style is undefine", more...}가 예시에 나타나면 프로토타입 버전을 업그레이드하세요

4. 프로토타입에서 $F() 사용

개인적으로 $F 사용법은 폼 데이터를 더 쉽게 검색할 수 있도록 고안된 것이라고 생각하는데, ID로만 검색할 수 있기 때문에 상대적으로 간단합니다

8a21ecc55e46a115916a47e2e30390b2
$F("이름") 맞습니다

df613966d3e0cbc3aae824c952059f60
$F("name") 잘못됨, TypeError: 요소가 null입니다. { message="element is null", 자세히...}

5. 프로토타입에서 $H() 사용

함수 매개변수로 개체를 전달하면 $H는 해당 개체를 프로토타입의 고유 해시 개체에 입력합니다. $H는 상황을 바꾸는 효과를 유발하는 변환기 같은 느낌입니다

$H({name:'tank',sex:1,height:'170cm'}).toArray()
[["name", "tank"], ["sex", 1], ["height", "170cm"]]
$H({name:'tank',sex:1,height:'170cm'}).toQueryString()
"name=tank&sex=1&height=170cm"

6. 프로토타입에서 $R() 사용

$R 함수에는 원래 생성자와 정확히 동일한 매개변수가 있습니다. start와 end는 각각 하한값과 상한값을 나타내고(두 매개변수의 유형은 일관되어야 함),clusive는 상한값을 제외할지 여부를 나타냅니다. 한계값(파라미터 끝) . 상한값은 기본적으로 제외되지 않습니다.

$R의 인스턴스는 숫자, 텍스트 또는 인접 값의 파생을 의미적으로 지원하는 기타 유형 등 특정 규칙에 따라 변경되는 일련의 값을 설명합니다.

예시를 통해 설명하면 사람들이 기억하기 가장 쉽습니다

$A($R("a","z",true)).join(',') //加了参数true 
"a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y" 
$A($R("a","z")).join(',') //没有加 
"a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z" 

$R은 규칙에 따라 $R 객체를 추론하고 $A는 객체를 배열로 변환한 후 부호를 사용하여 배열을 문자열로 변환합니다.

$R(0, 10).each(function(value){ 
 alert(value*value); 
}); 
//结果和上面的一样的，但是each解释的对像是不一样的。 
$A($R(0, 10)).each(function(value){ 
 alert(value*value); 
}); 

TypeError: value.succ is not a function { message="value.succ is not a function", more...} 오류가 보고되면 업그레이드하세요

7. 프로토타입에서 $w() 사용

$w는 공백이 구분 기호로 포함된 문자열을 배열로 변환합니다. 루트 PHP의explore(" ",$string); 기능은 동일하며 더 타겟이 높습니다.

$w("aa bb").join(',')

이러한 오류가 보고되면 ReferenceError: $w is not Defined { message="$w is not Defined", more...}, 업그레이드하세요

이 기사가 JavaScript 프로그래밍에 종사하는 모든 사람에게 도움이 되기를 바랍니다.