본문 바로가기

UI개발

자바스크립트 연산자

연산자

자바스크립트는 이항 연산자, 단항연산자, 조건연산자를 가지고 있다.

이항 연산자

두개의 피연산자가 필요함. 하나는 좌변에 다른 하나는 우변에

3+4   // 피연산자1 연산자 피연산자2
x*y

단항 연산자

연산자 뒤에든 앞에든 하나의 피연산자 필요함.

++x  // 연산자 피연산자 
x++  // 피연산자 연산자 

삼항 연산자 (조건 연산자)

조건에 따라 두 식 중 하나를 반환한다.

조건 ? 값1 (true) : 값2 (false)
var a = 11;
var b = (a>=10) ? "메롱" : "바보"       // a가 10보다 같거나 클 때 '메롱'을 b에 대입한다. 아니면 '바보'

if..else 문의 단축형으로 사용할 수 있다.

if ( a > b ) {
    c = 10;
} else {
    c = 20;
}
( a > b ) ? c = 10 : c = 20;

산술 연산자

덧셈, 뺄셈, 곱셈, 나눗셈, 나머지

var a = 30,
    b = 20,
    c = "안녕";
a + b;   // 50
a - b;   // 10
a * b;   // 600
a / b;   // 1.5
a % b;   // 10
a + c + b;   // 30안녕20
a + b + c;   // 50안녕
c + a + b;   // 안녕3020

단항부정연산자

피연산자 값의 반대 값(부호 바뀐 값)을 반환한다.

var x = 3;
-x      		// -3

숫자화연산자

피연산자가 숫자값이 아니라면 피연산자를 숫자로 변환하기를 시도함.

var x = "30";
x       // "30"
+x      // 30

증감연산자

++ 증가

단항 연산자. 피연산자에 1을 더한다.

연산자를 피연산자 앞에 사용하면 피연산자에 1을 더한 값을 반환,

뒤에 사용하면 피연산자에 1을 더하기 전 값을 반환.

var num = 10;

++num;      // 11
num;        // 11

num++;      // 10
num;        // 11

-- 감소

단항 연산자. 피연산자로부터 1을 뺀다.

var num = 10;

--num;      // 9
num;        // 9

num--;      // 10
num;        // 9

대입 연산자

오른쪽 피연산자의 값을 왼쪽 피연산자에 대입한다.

var x = 20,
    y = 10;

기본적인 대입

x = y;   // 10

덧셈 대입

x += y;
x = x + y;
x = 20 + 10;   // 30

뺄셈 대입

x -= y;
x = x - y;
x = 20 + 10;   // 10

곱셈 대입

x *= y;
x = x * y;
x = 20 * 10;    // 200

나눗셈 대입

x /= y;
x = x / y;
x = 20 / 10;    // 2

나머지 대입

x %= y;
x = x % y;      // 0

비교 연산자

== 같은

피연산자들이 같으면 true 반환

var o = 5;
o == 5;     // true
o == "5";   // true

=== 엄격히 같은

피연산자들이 형까지 같은 경우 true 반환

var o = 5;
o === "5";  // false
o === 5;    // true

!= 다른

피연산자들이 다르면 true 반환

var o = 5;
o != 4;    // true
o != 5;    // false
o != "5";  // false

!== 엄격히 다른

피연산자들이 다른 경우 true 반환, 형까지 같은 경우 false.

var o = 5;
o !== 4;    // ture
o !== 5;    // false
o !== "5";  // true

~보다 큰

좌변의 피연산자가 우변의 피연산자보다 크면 true 반환

var o = 5;
o > 4;      // true
o > 5;      // false
o > 6;      // false

~보다 크거나 같음

좌변의 피연산자가 우변의 피연산자보다 크거나 같으면 true 반환

var o = 5;
o >= 4;     // true
o >= 5;     // true
o >= 6;     // false

~보다 작음

좌변의 피연산자가 우변의 피연산자보다 작으면 true 반환

var o = 5;
o < 6;      // true
o < 5;      // false
o < 4;      // false

~보다 작거나 같음

좌변의 피연산자가 우변의 피연산자보다 작거나 같으면 true 반환

var o = 5;
o <= 4;     // false
o <= 5;     // true
o <= 6;     // true

논리연산자

&& 논리곱

두 피연산자가 모두 일치하면 true, 아니면 false

var x = 6, y = 3;
x < 7 && y > 2   // true
x < 7 && y < 4   // true
x < 7 && y < 4   // false

|| 논리합

피연산자중 하나만 일치하면 true, 둘다 틀리면 false

var x = 6, y = 3;
x == 6 || y == 3;    // true
x == 6 || y == 4;    // true
x == 7 || y == 4;    // false

!논리부정

피연산자가 true로 변환될 수 있으면 false를, 아니면 true

false로 변환될 수 있는 표현들 null, 0, NaN, "", 정의되지 않음

var x = 6, y = 3;
!( x == 6 );        // false
!( x == y );        // true
NaN == true;        // false
!NaN == true;       // true

연산자 우선순위

  1. 맴버 연산자 .[]
  2. 객체호출/생성연산자 () new
  3. 부정/증가 연산자 ! ~ - + ++ -- typeof void delete
  4. 곱셈/나눗셈 */%
  5. 덧셈/뺄셈 +-
  6. 비트단위 시프트 << >> >>>
  7. 관계연산자 < <= > >= in instanceof
  8. ==, !=
  9. 비트논리곱 &
  10. 비트배타논리합 ^
  11. 비트논리합 |
  12. 논리곱 &&
  13. 논리합 ||
  14. 조건연산자 ?:
  15. 대입 연산 = += -= *= /= %= <<= >>= &= ^= ~=
  16. 콤마 ,

'UI개발' 카테고리의 다른 글

자바스크립트 참조타입  (0) 2017.08.21
자바스크립트 배열  (0) 2017.07.09
콘텍스트  (0) 2016.12.12
함수 오버로딩과 타입 검사  (0) 2016.12.12
자바스크립트 참조 (reference)  (0) 2016.11.09