티스토리 뷰

Javascript

연산자

gwni0214 2022. 1. 28. 08:36

 

 

연산자

연산자란 덧셈, 뺄셈, 곱셈, 나눗셈과 같은 연산을 할 때 사용하는 기호입니다.
자바스크립트에서도 이와 같은 연산자를 이용해서 연산 작업을 수행합니다.

산술연산자

산술연산자에는 더하기, 빼기, 곱하기, 나누기, 나머지(%)가 있습니다. 산술 연산자로 연산을 하기 위해서는 연산 대상 데이터가 반드시 2개가 있어야합니다.

종류 기본형 설명
+ A+B 더하기
- A-B 빼기
* A*B 곱하기
/ A/B 나누기
% A%B 나머지

예제를 통해 산술연산자를 어떻게 사용하는지 확인합니다.

<script>
    var num1 - 15;
    var num2 = 2;
    var result;
    result = num1 + num2;
    document.write(result); //17

    result = num1 - num2;
    document.write(result); //13

    result = num1 * num2;
    document.write(result); //30

    result = num1 / num2;
    document.write(result); //7.5

    result = num1 % num2;
    document.write(result); //1
</script>

문자 결합 연산자

문자 결합 연산자는 문자형 데이터를 결합할 때 사용합니다.
ex) "do it" + "javascript" = "do it javascript"; 처럼 나타냅니다.

<script>
    var t1 = "자바스크립트";
    var t2 = "재밌다.";
    var result;

    var result = t1 + t2;
    document.write(result); // "자바스크립트 재밌다."
</script>

대입 연산자

대입 연산자는 연산된 데이터를 변수에 저장할 때 사용합니다. 복합 대입 연산자는 산술 연산자와 대입 연산자가 복합적으로 적용된 것을 말합니다.

<script>
    var num1 = 10;
    var num2 = 3;
   
    num1 += num2; // num1 = num1 (10) + num2 (3);
    documnet.write(num1); // 13

    num1 -= num2; // num1 = num1 (13) - num2 (3);
    documnet.write(num1); // 10

    num1 *= num2; // num1 = num1 (10) * num2 (3);
    documnet.write(num1); // 30

    num1 %= num2; // num1 = num1 (30) % num2 (3);
    documnet.write(num1); // 0

    //문자형 데이터에도 복합 대입 연산자를 사용 가능합니다.
    var str = "문자1"
    str += "문자2"
    str += "문자3"
    // "문자1문자2문자3"
</script>

증감 연산자

증감 연산자에는 숫자형 데이터를 1 씩 증가시키는 증가 연산자와 1씩 감소시키는 감소 연산자가 있습니다.

<script>
   var num1 = 10;
   var num2 = 20;
   var result;

   num1--;  // 9
   document.write(num1); // 9 출력

   num1++;  // 10
   document.write(num1); // 10 출력

   result = num2++; // result:20, num2:21 
   document.write(reuslt); // 21 출력
</script>

비교 연산자

비교 연산자는 두 데이터를 '크다, 작다, 같다'와 같이 비교할 때 사용합니다. 연산된 결과는 참(True) 또는 거짓(False)로 반환됩니다.

종류 기본형 비고
A > B A가 B보다 크다.  
A < B A가 B보다 작다.  
A >= B A가B보다 크거나 같다.  
A >= B A가 B보다 작거나 같다.  
A == B A와 B는 같다. 숫자를 비교할 경우 자료형은 숫자,문자 상관없이 표기된 숫자만 일치하면 True를 반환합니다.
A != B A와 B는 다르다. 숫자를 비교할 경우 자료형은 숫자,문자 상관없이 표기된 숫자만 다르면 True를 반환합니다.
A === B A와 B는 같다. 숫자를 비교할 경우 숫자와 자료형까지 다 일치하면 True를 반환합니다.
A !== B A와 B는 다르다. 숫자를 비교할 경우 숫자가 같아도 자료형이 하나라도 다르면 True를 반환합니다.
<script>
    var a = 10;
    var b = 20;
    var c = 10;
    var f = "20";
    var result;

    result = a > b; //False

    result = a < b; //True

    result = a <= b; //True

    result = b == f; //True

    result = a != b; //True

    result = b ===f; //False
</script>

논리 연산자

논리 연산자에는 ||(or), &&(and), !(not)이 있으며 연산하는 데이터가 논리형 데이터인 경우 True 또는 False를 반환합니다.

연산자 예시 설명
&& X && Y 둘다 true인 경우 true를 반환합니다.
|| X || Y 둘 중의 하나 이상이 true인 경우 true를 반환합니다.
! ! X 반대 값을 반환합니다.
<script>
    var a = 10;
    var b = 20;
        
    document.write( a > b && a < b); // 둘 중 하나가 아니므로 False.      
    
    document.write( a < b && a <= b); //둘 다 맞으므로 Treu.
    
    document.write( a > 200 || 50 > b); // 둘 중 하나가 맞기 때문에 True .   
    
    document.write( a > 200 || 50 < b); // 둘 다 아니므로 False.
    
    document.write( !(a > 200)); //원래는 False 이지만 !(not연산자)때문에 True를 반환.
</script>

연산자에는 이렇게 다양한 종류가 있습니다.  자주 쓰는 연산자를 외워두면 쓰기 편하겠죠? 

'Javascript' 카테고리의 다른 글

DOM 이란?  (0) 2022.02.04
Prompt 구구단 활용  (1) 2022.02.03
조건문 (If)  (1) 2022.01.25
자료형 (DataType)  (0) 2022.01.21
반복문으로 구구단 출력해보기  (5) 2022.01.20
댓글
© 2018 webstoryboy