자바스크립트의 증감연산자 또한 산술연산자의 한 종류이다. 자동으로 1을 더하지만 선행계산인지 후행계산인지 산술연산자의 위치에 따라 달라진다. 보통 반복문과 같이 반복되는 상황에서 자주 사용되는 것으로 익숙해지면 편리하다.
자바스크립트 증감연산자
산술연산자의 증감 사용 javascript arithmetic operator
산술연산자 중 증감연산자는 반복문에 자주 사용된다.
++, -- 2종류이다.
이것은 변수의 위치에 따라 계산의 순서가 선행할지 후행할지가 달라진다.
보통은 신경써서 작성하지 않기도 한다.
자주 사용할 정도로 익숙한 것이기 때문에 생각하기 전에 손이 먼저 타자를 치고 있게 되는 것이기도 하다.
산술연산자를 이용해 두 수를 계산하는 것은 이전 포스팅에서 다루었다.
생각이 나지 않거나 한다면 참고하면 된다.
종류
증감연산자의 특징은 어떤 수를 반복적으로 1씩 증가시키거나 1씩 감소시킨다.
1씩 증가시킬 경우 ++ 을 사용한다.
1씩 감소시킬 경우 -- 을 사용한다.
하지만 이 증감연산자가 변수의 앞과 뒤에 위치하는 경우 증가값은 달라진다.
단순히 1의 차이를 보이지만 결과만 놓고 보면 큰 차이를 보일 수 있다.
// 증가연산
++변수 또는 변수++
//감소연산
--변수 또는 변수--사용법
위에서 언급한 것은 증감연산자의 사용문법이다.
++ 와 -- 을 사용하지만 전체적인 사용법인 4가지이다.
변수 vA가 있을 경우 증감연산자의 사용과 뜻은 다음과 같다.
- ++vA
변수 vA의 값을 1 증가시키고 vA가 포함된 구문을 실행한다. - vA++
변수 vA가 포함된 구문을 실행한 후 값을 1 증가시킨다. - --vA
변수 vA의 값을 1 감소시키고 vA가 포함된 구문을 실행한다. - vA--
변수 vA가 포함된 구문을 실행한 후 값을 1 감소시킨다.
코드 샘플
위의 사용법을 글로 적는 것보다 코드와 결과화면을 보는 것이 가장 빠를 수 있다.
초기값을 4가지를 주고 5번 반복한다.
증감연산자의 위치가 선행이냐 후행이냐에 따라 다르다.
<!DOCTYPE html>
<html>
<body>
<h1>자바스크립트 사칙연산 산술연산자</h1>
<script>
let vNumIncBefore = 5;
let vNumIncAfter = 5;
let vNumDecBefore = 5;
let vNumDecAfter = 5;
console.log("초기값 : ", (vNumIncBefore), (vNumIncAfter), (vNumDecBefore), (vNumDecAfter));
console.log("----------");
for(let lp = 0; lp < 5; lp++){
console.log(lp + "번째 : ", (++vNumIncBefore), (vNumIncAfter++), (--vNumDecBefore), (vNumDecAfter--));
}
</script>
</body>
</html>결과화면을 보자.
초기값은 모두 5이다.
코드를 보면 알 수 있듯이 증감연산자의 위치가 다 다르다.
- 첫번째 : 선행증가연산
변수의 값을 +1 증가시킨 후 출력한다. - 두번째 : 후행증가연산
변수의 값을 출력하고 +1 증가시킨다. - 세번째 : 선행감소연산
변수의 값을 -1 감소시킨 후 출력한다. - 네번째 : 후행감소연산
변수의 값을 출력하고 -1 감소시킨다.
반응형
'programming > javascript' 카테고리의 다른 글
| 자바스크립트 할당연산자 산술연산자와 혼합 사용하기 (0) | 2021.10.20 |
|---|---|
| 자바스크립트 할당연산자 사용하는 방법 javascript assignment operator (0) | 2021.10.19 |
| 자바스크립트 사칙연산 하기 산술연산자 사용 javascript arithmetic operator (0) | 2021.10.17 |
| 자바스크립트 연산자 종류와 의미 javascript operator (0) | 2021.10.16 |
| 자바스크립트 변수 var let const 차이와 사용법 javascript varibable (0) | 2021.10.14 |
댓글