Javascript 연산자

연산자

연산자란 프로그래밍 언어에서 계산하는 작업을 의미하는 기호들 입니다.
연산자에는 산술, 문자 결합, 대입(복합 대입), 증감, 비교, 논리, 삼항 조건 연산자가 있습니다.
빼기, 더하기, 곱하기, 나누기, 비교 등 을 하는 일련의 작업을 연산 작업 이라 합니다.

산술연산자

산술 연산자에는 더하기(+), 빼기(-), 곱하기(*), 나누기(/), 나머지(%)가 있습니다.
산술 연산자로 연산을 하기 위해서는 연산 대상 데이터가 반드시 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, "<br>"); //17  ----num1 변수에는 15,
    result = num1 - num2;                           num2 변수에는 2가 들어 있으므로
    document.write(result, "<br>"); //13
    result = num1 * num2;
    document.write(result, "<br>"); //30
    result = num1 / num2;
    document.write(result, "<br>"); //7.5
    result = num1 % num2;
    document.write(result, "<br>"); //1
<script>

문자 결합 연산자

문자 결합 연산자는 피연산자(연산 대상 데이터)가 문자형 데이터입니다.
여러 개의 문자를 하나의 문자형 데이터로 결합할 때 사용합니다.

다음과 같이 더하기에 피연산자로 문자형 데이터가 한 개라도 포함되어있으면 다른 피연산자의 데이터는 자동으로 문자형 데이터로 형 변환되고 문자 결합이 이루어져 하나의 문자형 데이터를 반환 합니다.

기본형
문자형 데이터 + 문자형 데이터 = 하나의 문자형 데이터
ex) "do it" + "javascript" = "do it javascript";
문자형 데이터 + 숫자형 데이터 = 하나의 문자형 데이터
ex) "100" + 200 = "100200";

대입 연산자

대입 연산자(=)는 연산된 데이터를 변수에 저장할 때 사용합니다.
복합 대입 연산자(+=, -=, *=, /=, %=)는 산술 연산자와 대입 연산자가 복합적으로 적용된 것을 말합니다.

대입 연산자의 종류
종류	풀이
A = B	A = B
A += B	A = A+B
A *= B	A = A*B
A /= B	A = A/B
A %= B	A = A%B

<script>
    var num1 = 10;
    var num2 = 3;

    num1 += num2;   //num1 = num1(10) + num2(3);
    document.write(num1, "<br>"); //13

    num1 -= num2;   //num1 = num1(13) - num2(3);
    document.write(num1, "<br>"); //10

    num1 *= num2;   //num1 = num1(10) * num2(3);
    document.write(num1, "<br>"); //30

    num1 %= num2;   //num1 = num1(30) % num2(3);
    document.write(num1, "<br>"); //0
<script>

다음은 여러 개의 문자형 데이터로 저장된 HTML 태그를 복합 대입 연산자를 이용하여 하나의 문자로 결합한 다음 출력하는 예제입니다.

<script>
    var str = "<table border='1'>";
    str += "<tr>";
    str += "<td>1</td><td>2<td/><td>3</td>";
    str += "</tr>";
    document.write(str);
<script>

결과화면

1

2

3

여러 개의 문자형 데이터가 하나의 문자로 결합되어 변수 str에 저장됩니다.
즉, 한 개의 문자형 데이터로 결합됩니다.
str을 출력하면 문자가 아닌 태그로 인식되어 표가 출력됩니다.

증감 연산자

증감 연산자에는 숫자형 데이터를 1씩 증가시키는 증가 연산자(++)와 반대로 1씩 삼소시키는 감소 연산자(--)가 있습니다.
증감 연산자는 피연산자가 한 개만 필요한 단항 연산자입니다.
증감 연산자는 변수의 어느 위치에 오는가에 따라 결괏값이 달라집니다.

기본형
변수의 값을 1만큼 감소시킵니다.
//변수--; 또는 --변수;
변수의 값을 1만큼 증가시킵니다.
변수++; 또은 ++변수;

1.먼저 a(B의 값을 1만큼 증가)가 실행되고, b(증가된 B값을 A에 대입)가 실행됩니다.
var A = ++B
2.먼저 a(B의 값을 A에 대입)가 실행되고, b(B의 값을 1만큼 증가)가 실행됩니다.
var A = B++;

다음은 증감 연산자를 사용해 변수에 저장된 숫자를 증가하거나 감소하여 문서에 출력하는 예제입니다.

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

    num1--;         //9
    document.write(num1, "<br>");

    num1++;         //10
    document.write(num1, "<br>");
    
    result = num2++;         //result: 20, num2: 21
    document.write(result, "<br>");

    result = ++num2;         //result:22, num2: 22
    document.write(num1, "<br>");
<script>

결과 화면
9
10
20
22

비교 연산자

두 데이터를 '크다, 작다, 같다'와 같이 비교할 때 사용하는 연산자입니다.
연산된 결괏값은 true(참) 또는 false(거짓)로 논리형 데이터를 반환합니다.

비교 연산자의 종류
종류	설명	비고
A > B	A가 B보다 크다.
A < B	A가 B보다 작다.
A >= B	A가 B보다 크거나 같다.
A <= B	A가 B보다 작거나 같다.
A == B	A와 B는 같다.	숫자를 비교할 경우 자료형(type)은 숫자형이든 문자형이든 상관하지 않고 표기된 숫자만 일치하면 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
    document.write(result, "<br>");
    result = a < b;          //true
    document.write(result, "<br>");
    result = a <= b;          //true
    document.write(result, "<br>");
    result = b ==f;             //true
    document.write(result, "<br>");
    result = a != b;            //true
    document.write(result, "<br>");
    result = b ==== f;          //false
    document.write(result, "<br>");
</script>

논리 연산자

논리 연산자에는 ||(or), &&(and), !(not)이 있으며, 논리 연산자는 피연산자가 논리형데이터인 true 또는 false로 결괏값을 반환합니다.
||(or)연산자는 피연산자 중 하나만 true이면 true라는 결괏값을 반환합니다.
&&(and) 연산자는 피연산자중 하나만 false이면 false라는 결괏값을 반환합니다.
!(not) 연산자는 논리 부정 연산자로, 피연산자가 true이면 false라는 반대의 결괏값을 반환합니다.

논리 연산자의 종류
종류	설명
||	or 연산자라 부르며, 피연산자 중 값이 하나라도 true가 존재하면 true로 결괏값을 반환합니다.
&&	and 연산자라 부르며, 피연산자 중 값이 하나라도 false가 존재하면 false로 결괏값을 반환합니다.
!	not 연산자라 부르며, 당항 연산자입니다. 피연산자의 값이 true이면 반대로 false로 결괏값을 반환합니다.