javaScript - Operator(연산자)

javaScript - Operator(연산자)

연산자는 모든 프로그래밍언어에서 기본이면서도 중요한 부분입니다.

산술 연산자(Arithmetic Operators)

• 더하기 ( + )
  

• 빼기 ( - )

• 곱하기 ( * )

• 나누기 ( / )

• 나머지 값 ( % )

var n1 = 12;
var n2 = 3;
 
document.write(n1 + "과 " + n2 + "의 합은 " + (n1 + n2));  // 15
document.write("<hr />");
document.write("두 수의 차 : " + (n1 - n2));               // 9
document.write("<hr />");
document.write("두 수의 곱 : " + (n1 * n2));               // 36
document.write("<hr />");
document.write("두 수를 나눈 값 : " + (n1 / n2));          // 4
document.write("<hr />");
document.write("두 수를 나눈 나머지 값 : " + (n1 % n2));   // 0
                                                                                                                   
 

더하기 ( + )는 String이 우선순위이므로 덧셈을 하게 되어 연결됩니다.

더하기 ( + )를 뺀 나머지는 Number이 우선순위가 되면서 계산이 됩니다.

 // ( + ) 
document.write(5 + 5);          // 10
document.write("10 + 10");      // 10+10
document.write(5 + "5");        // 55
document.write(5 + 5 + "5");    // 105
document.write("5" + 5 + 5)     //555
document.write('5' + "5");      // 55
 
 // ( * )
document.write('5 * 5');        // 5 * 5 
document.write(5 * 5);          // 25
document.write('5' * 5);        // 25
document.write(5 * '5');         // 25
document.write('5' * '5');      // 25
 
 // ( / )
document.write('5' / '5');      // 1
                                                                                                            
 

증감 연산자(Increment/Decrement Operators)

• 증가 ( ++ )
  

• 감소 ( -- )

var a = 0;
a = a + 1; // 0 + 1
a = a + 1; // 1 + 1
a = a + 1; // 2 + 1
 
document.write(a + "<hr />"); //3
 
a++ // a = 1 + a;
document.write(a + "<hr />"); //4
 
a++ // a = 1 + a;
document.write(a + "<hr />"); //5
 
++a // a = a + 1;
document.write(a + "<hr />"); //6
 
 
// -----------------------------------------
// 증감연산자와 대입연사자 중 대입연산자가 우선순위가 됨.
 
var b;
  // ++a (선증가)
b = ++a; // b = 1 + a;
document.write(b + "<hr />"); // 7
 
  // a++ (후증가)
b = a++ // b = a + 1; 7 >> a를 먼저 b에게 대입되서 7, a도 증가되서는 8로 증가됨.
document.write(b + "<hr />"); // 7
    
b = a++
document.write(b + "<hr />"); // 8
 
b = ++a
document.write(b + "<hr />"); // 10
 
b = ++a
document.write(b + "<hr />"); // 11
 
b = a++
document.write(b + "<hr />"); // 11
 
b = a++
document.write(b + "<hr />"); // 12
 
b = ++a
document.write(b + "<hr />"); // 14
                                                                                                             
 

대입 연산자(Assignment Operator)

대입 ( = )

좌변 = 우변

우변의 값(식)을 좌변에 대입하라.

x = x + y

Operator	Example	Same
=	x = y	x = y
+=	x += y	x = x + y
-=	x -= y	x = x - y
*=	x *= y	x = x * y
/=	x /= y	x = x / y
%=	x %= y	x = x % y

var x = 5;
var y = 3;
 
x += b; // x = 8
 
x -= y; // x = 5
 
x *= y; // x = 15
 
x /= y; // x = 5
 
x %= y; // x = 2
                                                                                                                     
 

비교연산자(Comparison Operators)

 - 두 변의 값을 비교하여 Boolean 형태로 변환

Boolean ( true [참], false [거짓])

- 부동호( <, > )가 등호( = ) 보다 뒤에 있으면 안됩니다.

• 관계비교    ( > , 크다 or 작다. )

• 관계비교    ( < , 크다 or 작다. )

• 관계비교    ( >= , 크거나 같다. )

• 관계비교    ( <= , 작거나 같다. )

• 동등비교    ( == , 같다. )

• 일치비교    ( === , 타입까지 비교. )

• 부등비교    ( != , 같지않다. )

• 불일치비교 ( !=== , 타입까지 비교. )

var x = 6;
var y = 10;
 
x > y;  // false
x < y;  // true
 
x >= y; // false
x >= 6; // true
x <= y; // true
 
x == y;    // false
x == 6;    // true
x == '6';  // true
x === 6;   // true
x === '6'; // false
 
x != y;    // false
x != 6;    // false
x != '6';  // false
x !== 6;   // false
x !== '6'; // true
                                                                                                                     
 

논리 연산자(Logical Operators)

 - Boolean 형태의 값을 반환

Operator	Discription
&&	AND (논리 곱)	A && B : A와 B가 모두 true여야만 true 값을 반환
||	OR (논리 합)	A || B : A와 B 중 하나라도 true이면 true 값을 반환
!	NOT (논리 부정)	!A : A가 true이면 false 값을 반환      : A가 false이면 true 값을 반환

// AND (논리 곱) : &&
var a1 = true && true;      // t && t returns true
var a2 = true && false;     // t && f returns false
var a3 = false && true;     // f && t returns false
var a4 = false && (3 == 4); // f && f returns false
 
// OR (논리 합) : ||
var o1 = true || true;      // t || t returns true
var o2 = true || false;     // f || t returns true
var o3 = false || true;     // t || f returns true
var o4 = false || (3 == 4); // f || f returns false
 
// NOT (논리 부정) : !
var n1 = !true;  // !t returns false
var n2 = !false; // !f returns true
 
 
// ------------- 문자 ---------------
// AND (논리 곱) : &&
// - 같은 문자끼리 있는 경우 뒤에 있는 true 값을 반환 
var a5 = 'Cat' && 'Dog'; // t && t returns Dog
var a6 = 'Cat' && false; // t && f returns false
var a7 = false && 'Cat'; // f && t returns false
var a8 = 'Dog' && 'Cat'; // t && t returns Cat
 
// OR (논리 합) : ||
// - 같은 문자끼리 있는 경우 앞에 있는 true 값을 반환
var o5 = 'Cat' || 'Dog'; // t || t returns Cat
var o5 = 'Cat' || false; // t || f returns Cat
var o5 = false || 'Cat'; // f || t retuens Cat
var o5 = 'Dog' || 'Cat'; // t || t returns Dog
 
// NOT (논리 부정) : !
var n3 = !'Cat'; // !t returns false
                                                                                                              
 

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

 - 간단한 조건일 때 쓰면 좋습니다.

(조건) ? A : B;

[ 조건이 true이면, A를 false이면 B를, 만약 조건이 더 필요한경우 ]

[                   (조건) ? true : (조건) ? true : false;                    ]

var age = prompt('나이를 입력해주세요.');
var result;
 
result = (age < 19) ? "미성년자" : "성인";
document.write("당신의 나이는 : " + age + "세이고 " + result + "입니다.");
 
// ----------------------
 
var n = prompt('숫자를 입력해주세요.');
var res1;
var res2;
 
res1 = (n == 0) ? "0" : (n < 0) ? "양수" : "음수";
res2 = ((n % 2) == 0 && n != 0) ? "짝수" : ((n % 2) == 1) ? '홀수' : '0';
 
document.write("입력한 숫자는 " + n + "이고, " + res1 + "이며, " + res2 + "입니다.");
                                                                                                              
 

타입 연산자(Type Operators)

typeof

var a = 16;
var b = "JavaScript";
var c = ['red', 'Blue', 'Green'];
var d;
var e = (5 > 3);
var f = {name: 'hong', age: '20', gender: 'man'};
var g = a + b;
var h = function() {}
 
console.log(typeof a); // Numbet
console.log(typeof b); // String
console.log(typeof C); // Object(rray
console.log(typeof d); // Undefined
console.log(typeof e); // Boolean(true / false)
console.log(typeof f); // Object
console.log(typeof g); // String
console.log(typeof h); // function