> 웹 프론트엔드 > JS 튜토리얼 > JavaScript 삼항 연산자_javascript 기술을 사용하기 위한 다양한 기술

JavaScript 삼항 연산자_javascript 기술을 사용하기 위한 다양한 기술

WBOY
풀어 주다: 2016-05-16 16:03:42
원래의
1411명이 탐색했습니다.

코드를 너무 많이 작성하면 무의식적으로 if else를 삼항으로 대체하게 됩니다. 그러면 코드가 더욱 간결해지고 예리해집니다. 물론 삼항을 사용하면 절정에 달할 수 있다고 말하는 사람들도 있습니다. 저도 최근에 js를 작성하면서 이런 느낌을 받았는데, 공유할 만한 몇 가지 팁을 모아봤습니다.

빅버드님, 다음 문단은 건너뛰세요. 빅버드가 수정 도와드리겠습니다^__^

====인기라인====

표현식 (expr1) ? (expr2) : (expr3)

expr1이 TRUE로 평가되면 값은 expr2이고, expr1이 FALSE로 평가되면 값은 expr3입니다.

============

일반적인 사용법

if else를 자주 사용하는 경우

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

if(고마워요 천형님 ||고마워요 고시황제){
실패하지 마세요
}그밖에{
문걸이;
}

그렇다면 삼항 표현은
코드 복사 코드는 다음과 같습니다.

천 형제를 숭배하세요 || 시험 황제를 숭배하세요. 시험에 실패하지 마세요: 멘멘항

통찰력 있는 코드를 많이 찾는 것은 매우 멋진 일입니다.

일상생활에서 이러한 if else 판단이 자주 발생하며, 특히 중첩이 많은 경우에는 삼항을 사용하는 것이 더 조화로워 코드를 더욱 산뜻하게 만들고 구조를 명확하게 만들 수 있습니다.

좀 더 스마트해진 사용법
지속적인 변화를 통해 삼항의 다양한 사용법이 파생될 수 있습니다. 다음 jquery 코드

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

플래그 ? $('body').addClass('hover') : $('body').removeClass('hover') ;

더욱 변태적이네요.
코드 복사 코드는 다음과 같습니다.

$('.item')[ 플래그 ? 'addClass' : 'removeClass']('hover')

위의 코드는 혼란스러워 보입니다. flag = true일 때 코드는 다음 코드가 되기 때문입니다.
코드 복사 코드는 다음과 같습니다.

$('.item')['addClass']('hover')

이 작성 방법은 다음과 같습니다.
코드 복사 코드는 다음과 같습니다.

$('.item').addClass('hover')

다시 업그레이드

필요에 따라 원하는 함수를 호출하여 더 많은 작업을 처리할 수 있습니다.

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

함수 a(){
뭐라도 해라
}
함수 b(){
뭐라도 해라
}

플래그 ? a() : b();

그럼 선생님 완전체

그러니까 버튼이 2개 있는데, 하나는 전진 동작용이고 하나는 후진 동작용입니다. 작동 기능은 거의 동일합니다.

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

var action_turn = 함수(e, 유형){
        var self = $(e).closest('li');
        var target = self[type === 'prev' ? 'prev' : 'next']();
          target.addClass('has-img');
          self.removeClass('has-img')
}

var btn_next = $('#item-photo-panel a.next')
btn_next.click(함수(){
        action_turn(this, '다음');
         false를 반환합니다.
});
var btn_prev = $('#item-photo-panel a.prev')
btn_prev.click(함수(){
        action_turn(this, '이전');
         false를 반환합니다.
});


피해야 할 것
코드 복사 코드는 다음과 같습니다.

경고( true ? 'true' : false ? 't' : 'f' )

내가 의미하는 것은 위와 같이 중첩된 삼항을 피하려고 하는 것입니다. 왜냐하면 js에서는 명령문이 오른쪽에서 왼쪽으로 이루어지고 위의 코드는
과 동일하기 때문입니다.
코드 복사 코드는 다음과 같습니다.

경고( true ? 'true' : ( false ? 't' : 'f' ) )

예를 들어, PHP에서는 세 개의 요소를 중첩하면 결과가 완전히 다릅니다.
코드 복사 코드는 다음과 같습니다.

echo (( true ? 'true' : false ) ? 't' : 'f' ) //php

팁:
게다가 PHP의 삼항에 이런 프롬프트가 있다는 걸 발견했습니다

참고: 삼항 연산자는 명령문이므로 평가는 변수가 아니라 명령문의 결과입니다. 이는 참조로 변수를 반환하려는 경우 중요합니다. 참조로 반환하는 함수의 return $var == 42 ? $a : $b; 문은 작동하지 않으며 향후 버전의 PHP에서는 이에 대한 경고가 표시됩니다.

그러나 테스트 후에 위의 접근 방식이 javascript에서 작동한다는 것을 알았습니다. 이는 아마도 js가 php에 비해 BT만큼 엄격하지 않기 때문일 것입니다.

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