연산자 7종류 핵심 정리

 

 

연산자 7가지 종류에 대해 핵심 정리를 해보겠습니다. 산술, 문자 결합, 대입, 증감, 비교, 논리, 삼항 조건 연산자까지 살펴보겠습니다.

 

자바스크립트를 비롯한 프로그래밍 언어에서는 연산자를 이용해서 계산하고, 비교하고, 조건을 사용해서 다양하게 활용할 수 있습니다.

 

 

연산자를 이해하려면, 앞서 이야기했던 변수와 데이터의 자료형에 대해 알아두셔야 예시를 이해하실 수 있습니다.

 

변수의 개념과 사용법, 자료형 정리

 

참고로 이 글을 읽고, 이어서 제어문에 대해 정리한 글까지 보시면 프로그래밍 기초 문법은 일단 끝입니다. 왠만한 코딩을 할 수 있는 기틀을 마련했다고 봐도 무방합니다.

 

그러니 힘내서 공부해봅시다. 자 그럼 지금부터 하나씩 7가지 연산자에 대해 알아보도록 하겠습니다.

 

 

 

 

1. 산술 연산자

 

산술 연산자는 더하기(+), 빼기(-), 곱하기(*), 나누기(/), 나머지 값(%)이 있습니다.

 

나머지 값이 생소할 수 있는데 어렵지 않습니다. 10을 2로 나누면 5가 몫이죠? 남는 숫자가 없으니 나머지 값이 0 인 것입니다.

 

10을 3으로 나누면 나머지 값으로 1이 남습니다. 이게 나머지 값 입니다.

 

참고로 나머지 값은 홀수와 짝수, 배수를 구분할 때 요긴하게 쓰입니다.

 

사용하는 방법은 일반적인 계산법과 동일해서 숫자로 써도 되지만, 우리는 프로그래밍을 하니까 변수에 저장해서 써보겠습니다.

 

let q = 10;
let w = 2;

document.write(q+w+"<br>"); //10+2=12
document.write(q-w+"<br>"); //10-2=8
document.write(q*w+"<br>"); //10*2=20
document.write(q/w+"<br>"); //10/2=5
document.write(q%w) //10을 2로 나누면 남는 값이 없습니다. =0

 

 

참고로 +"<br>"이거는 줄바꿈(엔터)을 하기 위한 html 태그입니다.

 

 

2. 문자 결합 연산자

 

다음으로는 문자 + 문자, 문자 + 숫자를 해서 하나의 문자열로 만드는 문자 결합 연산자입니다.

 

아래와 같이 특정 글자를 이어서 문장을 만들 때 요긴하게 쓰입니다.

 

let userName = "큐캣";
let msg = "환영합니다.";

document.write(userName+"님 "+msg+"20"+22);

//결과값으로 큐캣님 환영합니다.2022 가 출력됩니다.

 

주의할 점은 "20"+22가 42가 아니라 2022가 된다는 것입니다.

 

문자 결합이기 때문에 문자형 숫자(큰따옴표 안의 숫자)와 숫자형 데이터를 결합했을 때 전부 문자열로 결합된다는 것을 기억해주세요.

 

만약 숫자를 연산하려면 문자형 데이터를 숫자형 데이터로 변환해야 합니다. 자료형 탐색과 변환에 대해서는 글 상단에 링크해두었습니다.

 

 

3. 대입 연산자

 

대입 연산자는 데이터를 변수에 저장하는 용도로 사용되는 연산자입니다.

 

대입 연산자에는 "A의 값은 1이다."라고 대입하는 단순 대입 연산자, A와 B를 더한 값을 A에 대입하는 등의 복합 대입 연산자가 있습니다.

 

 

let a = 10;
let b = 2;

a=b; //a의 10이 2로 대입되었습니다. a=2

document.write("a의 값은 "+a+"입니다.<br>");

a+=b; //a의 값이 a와 b를 더한 값(2+2)으로 대입되었습니다. a=4

document.write("a의 값은 "+a+"입니다.<br>");

a-=b; //a의 값이 a와 b를 뺀 값(4-2)으로 대입되었습니다. a=2

document.write("a의 값은 "+a+"입니다.<br>");

a*=b; //a의 값이 a와 b를 곱한 값(2*2)으로 대입되었습니다. a=4

document.write("a의 값은 "+a+"입니다.<br>");

a/=b; //a의 값이 a와 b를 나눈 값(4/2)으로 대입되었습니다. a=2

document.write("a의 값은 "+a+"입니다.<br>");

a%=b; //a의 값이 a와 b를 나눈 나머지 값(2%2)으로 대입되었습니다. a=0

document.write("a의 값은 "+a+"입니다.<br>");

 

단순히 값을 대입해서 저장하는 것은 숫자 뿐만 아니라 문자나 html태그, 변수 등도 대입이 가능합니다.

 

복합 대입 연산자는 어떠한 값에 추가적인 값을 더하거나 빼고 곱하고 나누고 나머지를 구할 수 있습니다.

 

이 방식은 코드를 작성할 때 상당히 축약이 됩니다. a+b를 하고 그 값을 다시 a에 대입하는 대신, 간단하게 a+=b로 쓰면 되는 것 입니다.

 

 

4. 증감 연산자

 

증감 연산자는 증가, 감소를 하는 연산자입니다.

 

숫자형 데이터를 1씩 증가하거나 감소시킬 때 쓰입니다. 사용법은 간단합니다.

 

let a =1;

a++;

document.write(a); //1에서 1이 증가해서 2가 됩니다.

a--;

document.write(a); //2에서 1이 감소해서 1가 됩니다.

 

단, 주의할 점이 있습니다. ++나 --의 위치를 앞쪽에 쓰느냐, 뒷쪽에 쓰느냐에 따라 결과값이 달라집니다.

 

let a =2;
let b =4;

let c = ++a; //a를 증가시킨 값을 변수 c에 대입합니다. c=3
let d = b--; //b의 값을 변수 d에 대입한 후, b를 감소시킵니다. d=4

document.write(c+"<br>");
document.write(d);

 

따라서 계산 후 대입(앞쪽에 기입)할 것인지, 대입하고 계산할 것인지(뒷쪽에 기입) 상황에 따라 증감 연산자를 사용하시면 되겠습니다.

 

 

5. 비교 연산자

 

이제 7개 중에 5개 째입니다. 조금만 더 힘내세요!

 

비교 연산자는 말 그대로 데이터를 비교할 때 쓰이는 연산자입니다.

 

a와 b를 비교해서 어느것이 크다, 작다, 크거나 같다, 작거나 같다, 데이터가 일치한다, 데이터가 일치하지 않는다에 대해 true와 false로 판단할 수 있습니다.

 

let result = 2>4; //false
document.write(result+"<br>");

let result = 2<4; //true
document.write(result+"<br>");

let result = 9>=10; //false
document.write(result+"<br>");

let result = 9<=10; //true
document.write(result+"<br>");

let result = 9==10; //false
document.write(result+"<br>");

let result = 10=="10"; //true. 데이터 자료형은 상관없습니다.
document.write(result+"<br>");

let result = 10!=10; //false
document.write(result+"<br>");

let result = 10==="10"; //false. 데이터 자료형까지 같아야 합니다.
document.write(result+"<br>");

let result = 10!=="10"; //true. 데이터 자료형이 다릅니다.
document.write(result+"<br>");

 

 

6. 논리 연산자

 

논리 연산자도 앞서 소개한 비교 연산자처럼 연산된 결과값을 true, false로 반환합니다. 

 

그러나 비교 연산자는 비교한 값에 대해 참이냐 거짓이냐를 판단하고, 논리 연산자는 어떠한 논리에 대해 참이냐 거짓이냐를 판단한다는 차이가 있습니다.

 

논리 연산자는 다음과 같이 3가지가 있습니다.

 

•  ||(or) : 논리가 하나라도 true면 true로 결과값을 반환합니다.
• &&(and) : 논리가 하나라도 false면 false로 결과값을 반환합니다.
• !(not) : 논리가 true면 false로, false면 true로 결과값을 반대로 반환합니다.

 

논리 연산자를 사용하는 방법은 아래에서 삼항 조건 연산자의 예제와 함께 살펴보겠습니다.

 

 

7. 삼항 조건 연산자

 

이름이 어려운데요, 3개의 연산할 항을 가진 연산자라고 이해하면 되겠습니다.

 

사용법은 다음과 같습니다.

 

조건식 ? 코드1 : 코드2

 

let result = 1<2? "참입니다.":"거짓입니다.";
document.write(result);

//결과값은 참입니다. 가 출력됩니다.

 

코드1 영역에 true일 경우 실행할 코드를, 코드2 영역에 false일 경우 실행할 코드를 입력합니다.

 

이번에는 좀 더 복잡한 예시를 살펴보겠습니다.

 

    let name = prompt("이름은?","");
    let weight = prompt("체중은?","");
    let height = prompt("키는?","");
    let recoWeight = (height - 100) * 0.9;

    let result = weight <= recoWeight && weight >= recoWeight;
    result = result ? "적정 체중입니다." : "적정 체중이 아닙니다.";

    document.write(name+" 님은 "+result);

 

앞서 살펴보았던 논리 연산자 &&(and)가 쓰였습니다.

 

입력한 체중이 적정 체중보다 적거나 같을 경우(케이스1), 입력한 체중이 적정 체중보다 크거나 같을 경우(케이스2)로 나눈 것입니다.

 

이후에 삼항 조건 연산자를 사용하여 케이스1일 경우의 메세지, 케이스2일 경우의 메세지를 출력하게 됩니다.

 

 

이처럼 논리에 따라 실행할 코드를 정하는 것을 플로우라고 합니다.

 

플로우 차트로 논리의 흐름을 도식으로 그려보고 코딩하는 것도 도움이 됩니다.

 

플로우 차트 만드는 방법

 

 

이상으로 연산자 7가지 종류(산술, 문자 결합, 대입, 증감, 비교, 논리, 삼항 조건 연산자)에 대해 핵심적인 내용을 살펴보았습니다. 읽어주셔서 감사합니다.