2016-07-27 4 views
-1

나는 코드 스 니펫 아래에 와서 그것을 이해하려고 노력했다. 나는 우리가 삼항 연산자를 사용하고 menuclick에 액티브 한 클래스를 추가하는 것을 이해하지만, 자세한 설명은 인정 될 것이다. Javascript ternary statement code snippet 이해하기

navClick: function (o) { 
var _this = this //what does this refer to 

//what does this line of code do especially the equal sign 
!_this.menuclicked ?(($(".last-menuitem").attr("id")==$("#menu li.active").find("a:last-child").not(".ignore-ele").attr("class") 
|| $(".last-menuitem").find(".view-holder").attr("id")==$("#menu li.active").find("a:last-child").not(".ignore-ele").attr("class") 
|| ($(window).scrollTop() + $(window).height() >= $(document).height() - 20))?($(".last-menuitem").length!=0 && $(".arrow").addClass('yellow')) 
:($(".arrow").removeClass('yellow'))): 
} 

+1

정확하게 이해하지 못하는 부분은 무엇입니까? – nicael

+0

다음 문장을 사용하여 활성 클래스를 추가 할 때를 이해하고 싶습니다. ($ (". last-menuitem"). attr ("id") == $ ("# menu li.active"), "find "여기에 정확히하고있다".find ("a : last-child"). not (". ignore-ele"). attr ("class") " – almondn

답변

0

!_this.menuClicked

내가 menuClicked을 가정하고하는 것은 메뉴를 클릭하거나하지 않은 경우의 부울 표현입니다 감사합니다. 따라서 메뉴를 클릭하면 false가 반환됩니다. !

그래서 !_this.menuClicked == true 경우 부정 연산자이기 때문에 다음 수행이

(($(".last-menuitem").attr("id") == $("#menu li.active").find("a:last-child").not(".ignore-ele").attr("class") 
|| 
$(".last-menuitem").find(".view-holder").attr("id") == $("#menu li.active").find("a:last-child").not(".ignore-ele").attr("class") 
|| 
($(window).scrollTop() + $(window).height() >= $(document).height() - 20)) 

(".last-menuitem").attr("id") == $("#menu li.active").find("a:last-child").not(".ignore-ele").attr("class") 

첫 번째 또는 검사를 lastMenuItems ID가 활성화 된 메뉴 항목을 무시해야 doeesnt 마지막 자식을 동일한 경우 다른 클래스. 그것이 사실 인 경우

우리는 마지막 메뉴 항목 클래스는 요소가있는 경우, 다음이 .arrow 클래스 요소가 노란색 CSS 스타일을 가지고 있습니다 확인 중첩 된 turnary

($(".last-menuitem").length!=0 && $(".arrow").addClass('yellow')) 

로 이동합니다. 뷰 홀더 클래스의 ID와 lastmenuItem 활성 메뉴 항목이 마지막으로 doeesnt은을 가지고 chiled 동일한 경우

중첩 된 선반 세공의 첫 부분이 거짓이면

다음 우리는 두 번째 부분

$(".last-menuitem").find(".view-holder").attr("id") == $("#menu li.active").find("a:last-child").not(".ignore-ele").attr("class") 

충돌 그것에 대한 다른 클래스를 무시하십시오.

앞에서 언급 한 진실 부분입니다. 중첩 된 도미노의 세 번째 부분을 수행하지 않으면 스크롤 위치 + 창의 높이가 더 크면 문서 높이 - 20이 true를 반환하면 중첩 된 도미노의 세 번째 부분을 수행하지 않습니다.

($(window).scrollTop() + $(window).height() >= $(document).height() - 20)) 중첩 된 부화장의 진정한 부분을 수행하십시오. 그렇지 않으면 모두 false를 반환하면 false 부분을 수행합니다.

($(".arrow").removeClass('yellow'))): 

모든 항목이 거짓이면 .arrow 클래스를 사용하여 요소에서 노란색을 제거합니다. 아래 은 읽을 수있는 부수어입니다.

!_this.menuclicked ? 
(
    (
     $(".last-menuitem").attr("id") == $("#menu li.active").find("a:last-  
     child").not(".ignore-ele").attr("class") 
     || $(".last-menuitem").find(".view-holder").attr("id") == $("#menu 
      li.active").find("a:last-child").not(".ignore-ele").attr("class") 
     || ($(window).scrollTop() + $(window).height() >= $(document).height() 
      - 20) 
    ) 
? ($(".last-menuitem").length!=0 && $(".arrow").addClass('yellow')) 
: ($(".arrow").removeClass('yellow')) 
):