> 웹 프론트엔드 > JS 튜토리얼 > 클로저, 바인딩 및 이에 대한 인터뷰 질문을 공유하세요.

클로저, 바인딩 및 이에 대한 인터뷰 질문을 공유하세요.

高洛峰
풀어 주다: 2017-02-21 14:50:15
원래의
1034명이 탐색했습니다.

이번 글은 클로저 바인드에 대한 인터뷰 질문을 주로 소개하고 있는데, 필요한 친구들이 참고할 수 있도록 자세히 설명되어 있습니다.

해결해야 할 문제는 다음 ul에 대한 각 li에 클릭 이벤트를 추가하고 해당 인덱스를 팝업하는 것입니다

<ul id="text">
 <li>这是第一个li</li>
 <li>这是第二个li</li>
 <li>这是第三个li</li>
</ul>
로그인 후 복사

1번 답: 바인딩하고 현재 익명 함수를 this에 지정하고 i를

var init = function(){
var obj = document.getElementById(&#39;text&#39;);
for(var i=0;i<obj.children.length;i++){
 obj.children[i].addEventListener(&#39;click&#39;,function(i){
 alert(i)
 }.bind(this,i))
}
}
init();
로그인 후 복사

에 매개변수로 전달합니다. 2번 답 : 종결

var init = function(){
var lis=document.querySelectorAll("#text li");
 for(var i=0;i<lis.length;i++){
 lis[i].onclick=(function(i){
  return function(){
   alert(i);
  };
 })(i)
 }
}
init();
로그인 후 복사

답3: 가장 멍청한 방법, match

var init = function(){
 var obj = document.getElementById(&#39;text&#39;);
 for(var i=0;i<obj.children.length;i++){
 obj.children[i].addEventListener(&#39;click&#39;,function(item){
 var self = item.target;
 for(var j=0;j<obj.children.length;j++){
 if(self == obj.children[j]){
  alert(j);
 }
 }
 })
 }
}
init();
로그인 후 복사

클로저, 바인드, 이것에 대한 인터뷰 질문을 공유한 더 많은 관련 기사는 PHP 중국어 홈페이지를 주목해주세요!

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