기본 연산자(수학)

자바스크립트에서의 수학 연산에관해 정리해보려고 합니다.

피연산자, 단항, 이진

피연산자: 연산자가 적용되는 대상을 말한다.

아래의 코드에서 보면, num1과 num2를 곱하고 있다.
여기서 num1과 num2를 각각 왼쪽 피연산자, 오르쪽 피연산자라고 부른다.
피연산자라는 용어 말고 다르게 부르고 싶으면 인수라고 부르면 된다.

let num1 = 7, num2 = 80;

let result = num1 * num2;

단항: 단일 피연산자만 있는 경우 단항이라고 말한다.

한 가지 예를 들어서 보면 단일 피연산자 앞에 -를 붙이면 단항 부정이 된다.
여기서 -를 붙이면 해당 숫자의 부호를 반대로 바꾸게 된다.

let num1 = 9;
// 아래의 코드를 보면, 기존 num1은 양수 9였는데 앞에 -부정 연산자를 붙임으로써 -9로 음수를 만들어버린다.
num1 = -num1; 
console.log(num1); // -9가 찍힌다.

이진: 연산자는 두 개의 피연산자가 있는 경우 이진이 된다.
동일한 -가 있는 이진 형식으로도 존재하는데 아래의 코드를 한번 살펴볼 것이다.

let a = 7, b = 9;
let result = a - b

console.log(result); //-2

a와 b는 양의 정수이다. 두 변수에 담긴 값이 모두 동일한 +기호를 가지고 있다. 하지만 밑의 계산식에서 부호를 반전시키는 - 부정 연산자를 뒤의 변수에 적용해 주었기때문에 a - (b)가 되면서 숫자에서 다른 숫자를 빼는 이항 연산자, 빼기 연산이 되어버렸다.

만약 b가 9가 아니라 음수 -9라면 위의 계산과는 결과가 또 다르게 나오게 된다. 아래의 코드를 한번 살펴볼 것이다.

let a = 7, b = -9;
// 7 - (-9)에서 -9가 앞에 부정 연산자를 만나 +로 바뀌고, 그 다음에 앞의 피연산자인 7과 더해져서 16이라는 결과가 나온다.
let result = a - b;
console.log(result); //16

자바스크립트에서 쓰이는 수학 연산들

기존에 알고있던 산술 연산자는 4가지가 있다. 덧셈, 뺄셈, 곱셈, 나눗셈이다. 연산하는 방법은 숫자 값(리터럴 또는 변수)을 피연산자로 받아 하나의 숫자 값을 반환한다.

( + ) : 덧셈
( - ) : 뺄셈
( * ) : 곱셈
( / ) : 나눗셈
( % ) : 나머지
( ** ) : 거듭제곱(지수)

덧셈, 뺄셈, 곱셉, 나눗셈의 경우 평상시에도 사용을 많이 해서 익숙한 개념이지만, 나머지와 거듭제곱에 대한 개념을 조금 더 알아봤으면 해서 그 두가지를 알아볼 것이다.

나머지(%)

나머지 연산자는 왼쪽 피연산자를 오르쪽 피연산자로 나눴을 때의 나머지를 반환한다. 아래의 코드를 통해 살펴 볼 것이다.

let result = 9 % 2; // 나머지는 1이 된다.
console.log(result); // 1

거듭제곱, 지수 (**)

거듭제곱, 지수 연산자는 왼쪽 피연산자를 곱하는 수로 두고, 오른쪽 피연산자를 곱할 횟수로 둔다. 아래의 코드를 통해 살펴 볼 것이다.

//숫자 2를 4번 곱해서 result에 결과를 담는다.
let result = (2 ** 4);
console.log(result); //16

거듭제곱 연산자는 오른쪽부터 결합하는 특성이 있다.
a ** (b ** c)

//숫자가 담긴 변수 3개가 있다. 
let num1 = 5, num2 = 3, num3 = 2;

//아래와 같이 3개의 변수를 거듭제곱 연산통해 변수 3개의 거듭제곱 연산을 해볼 수 있다. 오른쪽에서 2개를 먼저 묶어서 결합한 후 계산하고, 그 결과를 다시 왼쪽 변수에 적용하게 된다.

//(num2) ** (num3)의 결과인 9가 num1에 곱해지는 횟수, 숫자가 된다.
//5를 9번 곱하면 그 결과는 1953125가 된다.
let result = num1 ** (num2 ** num3); //num1 ** num2 ** num3;
console.log(result); // 1953125

+로 문자열 연결하기

(+)는 숫자 연산뿐만 아니라 문자들을 연결해줄 수도 있다.

연결 연산자 (+)는 두 문자열 값을 연결하고,두 문자열이 합쳐진 새로운 문자열을 반환한다.
아래의 코드를 통해 살펴 볼 것이다.

1. 피연산자가 모두 문자열인 경우

let str = "Hello" + " JavaScript!";
console.log(str); // "Hello JavaScript!"

2. 피연산자 중 숫자가 있는 경우, 문자열과 +연산을 하게되면, 숫자가 문자로 연산된다.

let result1 = '3' + 4; 
console.log(resut1); // "34"

let result2 = 2 + '79'; 
console.log(result2); //"279"

//7 + 9의 연산을 먼저한 결과인 16을 뒤의 피연산자와 연산하려고 보니, 문자열 '34'가 있다. 그래서 문자열로 연산 결과가 바뀐다. 
// 16 + '34' --> '1634'가 된다.
let result3 = 7 + 9 +'34';
console.log(result3); // "1634"

//맨 앞의 피연산자가 문자열이기 때문에 뒤에 연산자들도 문자열로 연산이 된다. 
// '13' + 3 --> '133'
// '133' + 5 --> '1335'
let result4 = '13' + 3 + 5;
console.log(result4); // "1335"

문자열로 감싸진 (-)와 (/)의 연산을 살펴보기

(+)연산과는 다르게 (-)와 (/)의 연산을 살펴보면, 다른 산술 연산자들은 숫자로만 작동하고, 항상 피연산자를 숫자로 변환하는 것을 확인할 수 있다.

let result1 = '7' - '4';
console.log(result1); // 3

let result2 = '64' / '8';
console.log(result2); // 8

숫자로 변환하기, 단항 +

(+)는 이진 형식과 단항 형식 이 두가지 형식으로 쓸 수 있다.

단항 더하기, 단일값을 가진 피연산자에 +가 적용되면 숫자의 경우 아무런 변화가 일어나지 않는다. 하지만, 피연산자가 숫자가 아니라면 단항 더하기는 피연산자를 숫자로 변환시킨다.

//숫자인 피연산자에 +를 붙여봤자 아무런 변화가 없다.
let num1 = 8;
console.log(+num1); // 8

let num2 = -20;
console.log(+num2); // 20



//숫자가 아닌 피연산자에 +를 붙이면 피연산자를 숫자로 변환한다.
//boolean 값인 true는 숫자로 변환하면 1로 반환된다.
let num3 = true;
console.log(+true); // 1

//""빈 문자열은 boolean 값으로 변환하게되면 false로 변환되고, 그 결과를 숫자로 바꿔주면 0이 반환된다.
let num4 = "";
console.log(+num4); // 0

위에서 (+)를 통해서 숫자가 아닌 값들을 숫자로 변환할 수 있는 걸 알아보았다. 숫자로 형변환하는 방법에는 Number( )를 사용하는 방법도 있다.

하지만 이 방법보다 (+)를 사용하면 훨씬 빠르게 숫자로 변환할 수 있는 장점이 있다.

문자열을 숫자로 변환해야 하는 경우가 자주 발생할 수 있는데, 숫자이지만 문자열로 감싸져있는 값들을 (+)연산자를 통해 더하면 '숫자+숫자'의 형태로 값이 반환되는 것을 확인했었다.

그러면 문자열로 감싸진 숫자를 어떻게 숫자로 연산할 수 있을까?

숫자로 계산하려면 먼저 (+)를 통해 숫자로 변환한 다음에 합산하면 된다.

let str1 = '345';
let str2 = '678';
let result = (+str1 + +str2); // 345 + 678
console.log(result); // 1023

할당 연산

할당 = 연산자는 우선순위가 낮다.
변수를 선언하고 값을 할당할 때나 표현식의 결과를 변수에 할당할 때 쓰인
다.

아래의 코드를 통해 할당에 대해 살펴볼 것이다.

let num = 7;
let result = num * 3 + 30; //(7 * 3) + 30
console.log(result); // 51

할당 = 값을 반환한다.

자바스크립트의 모든 연산자는 값을 반환한다.
+, -에 대해서는 작동하는 원리를 분명하게 알 수 있지만

= 연산자는 변수에 값을 할당하고, 어떠한 값을 할당받은 변수를 반환한다.
아래의 코드를 보면 이해가 쉽다.

let x = 9;
let y = 7;

// 1. ()소괄호 안에서 y + 5가 가장 먼저 계산된다.
// 2. x에는 1의 결과값 12가 다시 할당된다.
// 3. result에는 10 - 12의 결과인 -2가 할당되고, 그 결과를 반환한다.
let result = 10 - (x = y + 5); // 10 - (9 = 7 + 5)
console.log(result); // -2

위의 코드에서 result를 x = y + 5에서 x는 12가 된다.
이런식으로 표현할 수도 있긴 하지만, 작동방식을 이해하기 위해 작성한 코드일 뿐 이런식으로 코드를 작성하는 것은 코드를 명확하게 읽는 것이 어렵기때문에 권장하지 않는다고 한다.

연결 할당

=을 이용해서 연결할당을 할 수 있다.

let x, y, z;

x = y = z = 7 * 4;

console.log('x : ' + x); // 28
console.log('y : ' + y); // 28
console.log('z : ' + z); // 28

연결 할당은 오르쪽에서 왼쪽으로 평가가 된다.

맨 오르쪽에 있는 표현식 7 * 4가 가장먼저 실행되고, 변수 z에 할당된다.
그다음에는 z의 값이 y에 할당되고, y의 값이 x에 할당된다.

하지만, 위에처럼 연결해서 할당할 수 있다해도 가독성 측면에서 각각 따로 할당해주는 것이 좋다.

let x, y, z;

z = 7 * 4;
y = z;
x = y;

증가, 감소 연산

증가 연산자 ++

증가연산자 ++은 변수의 값에 1만큼 증가시키는 일을 한다.

let num1 = 9;
num1++;
console.log(num1); //10

감소 연산자 --

감소연산자 --는 변수의 값을 1만큼 감소시키는 일을 한다.

let num2 = 3;
num2--;
console.log(num2); // 2

모던자바스크립트를 공부한 뒤 작성하였습니다.
https://javascript.info/operators