일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 다형성 (polymorphism)
- justfiy-content
- class
- css 정리
- display
- 재귀적으로 생각하기
- 상속 (inheritance)
- align-iitems
- async/await
- 얕은복사와 깊은 복사
- 첫번째 미니 프로잭트
- props비구조화 할당
- 객체지향 프로그래밍 특징
- 재귀함수 탬플릿
- 참조자료형
- 추상화 (abstraction)
- flex-direction
- 조건문
- probs.children
- Promise Chaining
- Math.floor()
- 캡슐화 (encapsulation)
- Instanc
- Promise all
- 클래스 문법 구조
- string
- probs
- align-content
- 화살표함수 기본 개념
- 문자열을 객체로 만드는법
Archives
- Today
- Total
희락코딩
JavaScript _tip / 삼항 연산자 쉽게 이해하자! 본문
728x90
반응형
삼항 연산자 활용하기
삼항 연산자는 JavaScript에서 3개의 항을 사용하는 유일한 연산자 입니다. 조건 연산자는 조건에 따라 2개의 값중 하나를 가질 수 있습니다
삼항연산자의 장점은 단순한 조건의 코드일 경우 불필요한 코드를 줄일 수 있어 알아두면 너무 유용한 연산자 입니다.
대부분 어렵게 느껴져서 그냥 넘어가는 경우가 있는데 원리만 알면 너무 쉽고 다양하게 응용할 수 있어서 알아 두면 너무나 좋은 꿀팁 중에 꿀 연산자 입니다.
// 삼항 연산자 구조 //
조건 ? 값1 : 값2
▶ 만약 조건이 참이라면, 조건 연산자는 값1을 값으로 갖습니다. 그렇지 않은 경우 조건 연산자는 값2을 값으로 갖습니다. 표준 연산자를 사용하는 어디든 조건연산자를 사용할 수 있습니다.
// 예시 //
age >= 20 ? 'adult' : 'youngboy' // 만약 age에 20이상의 수를 넣으면 adult출력, 아니면 youngboy 출력됩니다.
// 좀 더 확실한 이해를 위한 예시 //
function isAdult(age) {
if(age >= 20){
return 'adult'
}else return 'youngboy'
}
// 보편적으로 위와같이 코드를 작성합니다. 하지만 삼항연산자를 활용하면 코드를 좀더 쉽게 줄일수 있습니다.
function isAdult(age) {
return age >= 20 ? 'adult' : 'youngboy'
}
// 이렇게 간단한 조건일 경우 삼항 연산자를 쓰면 불필요한 코드를 줄일 수 있습니다.
▶ 삼항 연산자는 조금만 공부해보면 쉽게 이해할수 있으니 꼭 공부 해보시는 것을 추천 드립니다.
아래 링크와 같이 삼항 연산자를 어떤식으로 활용해서 풀었는지 아래 문제예시를 확인 하면서 학습 해보시길 바랍니다.
https://joy-codeing-lee.tistory.com/13?category=959903
https://joy-codeing-lee.tistory.com/14?category=959903
https://joy-codeing-lee.tistory.com/16?category=959903
728x90
반응형
'프로그래밍 > 자바스크립트 꿀팁 개념' 카테고리의 다른 글
JavaScript _tip / 얕은 복사와 깊은 복사 (Shallow copy, Deep copy) (4) | 2021.04.25 |
---|---|
JavaScript _tip / 화살표 함수 두려워하지 말자! (4) | 2021.04.25 |
JavaScript _tip / 데이터 불변성 (Primitive & Reference) (0) | 2021.04.22 |
JavaScript _tip / MUTABLE과 IMMUTABLE 구분하자!! (0) | 2021.04.21 |
JavaScript _tip / for ...in , for ...of의 차이! (0) | 2021.04.21 |
Comments