연산자
자바스크립트에서는 다양한 연산자를 제공하여 변수나 상수를 다양한 방법으로 조작할 수 있습니다. 이번에는 자바스크립트의 연산자에 대해서 알아보겠습니다.
[1] 산술 연산자(arithmetic operators)
[1]-1. 더하기 연산자(+)
console.log(2 + 3); // 5
console.log("2" + "3"); // "23"
console.log("2" + 3); // "23"
console.log(2 + "3"); // "23"
위의 예제에서는 더하기 연산자를 사용하여 숫자나 문자열을 더할 수 있습니다. 이때, 더하기 연산자는 숫자와 문자열을 함께 사용할 경우, 자동으로 문자열로 변환합니다.
[1]-2. 빼기 연산자(-)
console.log(5 - 2); // 3
console.log("5" - "2"); // 3
console.log("5" - 2); // 3
console.log(5 - "2"); // 3
console.log("five" - 2); // NaN
위의 예제에서는 빼기 연산자를 사용하여 숫자를 뺄 수 있습니다. 이때, 빼기 연산자는 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환합니다.
[1]-3. 곱하기 연산자(*)
console.log(2 3); // 6
console.log("2" "3"); // 6
console.log("2" 3); // 6
console.log(2 "3"); // 6
console.log("two" * 3); // NaN
위의 예제에서는 곱하기 연산자를 사용하여 숫자를 곱할 수 있습니다. 이때, 곱하기 연산자는 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환합니다.
[1]-4. 나누기 연산자(/)
console.log(6 / 3); // 2
console.log("6" / "3"); // 2
console.log("6" / 3); // 2
console.log(6 / "3"); // 2
console.log("six" / 3); // NaN
위의 예제에서는 나누기 연산자를 사용하여 숫자를 나눌 수 있습니다. 이때, 나누기 연산자는 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환합니다.
[1]-5. 나누기 연산자(%)
console.log(7 % 3); // 1
console.log("7" % "3"); // 1
console.log("7" % 3); // 1
console.log(7 % "3"); // 1
console.log("seven" % 3); // NaN
위의 예제에서는 나머지 연산자를 사용하여 나눗셈의 나머지를 구할 수 있습니다. 이때, 나머지 연산자는 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환합니다.
[2] 할당 연산자(assignment operators)
[2]-1. 등호 연산자(=)
let x = 10;
console.log(x); // 10
x = 5;
console.log(x); // 5
위의 예제에서는 등호 연산자를 사용하여 변수에 값을 할당할 수 있습니다.
[2]-2. 더하기 등호 연산자(+=)
let x = 10;
console.log(x); // 10
x += 5;
console.log(x); // 15
위의 예제에서는 더하기 등호 연산자를 사용하여 변수에 값을 더할 수 있습니다.
[2]-3. 빼기 등호 연산자(-=)
let x = 10;
console.log(x); // 10
x -= 5;
console.log(x); // 5
위의 예제에서는 빼기 등호 연산자를 사용하여 변수에서 값을 뺄 수 있습니다.
[2]-4. 빼기 등호 연산자(-=)
let x = 10;
console.log(x); // 10
x *= 5;
console.log(x); // 50
위의 예제에서는 곱하기 등호 연산자를 사용하여 변수에 값을 곱할 수 있습니다.
[2]-5. 나누기 등호 연산자(/=)
let x = 10;
console.log(x); // 10
x /= 5;
console.log(x); // 2
위의 예제에서는 나누기 등호 연산자를 사용하여 변수에서 값을 나눌 수 있습니다.
[2]-6. 나머지 등호 연산자(%=)
let x = 10;
console.log(x); // 10
x %= 3;
console.log(x); // 1
위의 예제에서는 나머지 등호 연산자를 사용하여 변수에서 값을 나눈 나머지를 구할 수 있습니다.
[3] 비교 연산자(comparison operators)
[3]-1. 일치 연산자(===)
console.log(2 === 2); // true
console.log("2" === 2); // false
console.log(2 === "2"); // false
위의 예제에서는 일치 연산자를 사용하여 두 값이 같은지 비교할 수 있습니다. 이때, 일치 연산자는 자료형까지 비교합니다.
[3]-2. 불일치 연산자(!==)
console.log(2 !== 2); // false
console.log("2" !== 2); // true
console.log(2 !== "2"); // true
위의 예제에서는 불일치 연산자를 사용하여 두 값이 다른지 비교할 수 있습니다. 이때, 불일치 연산자는 자료형까지 비교합니다.
[3]-3. 작다(<) 연산자
console.log(2 < 3); // true
console.log(2 < "3"); // true
console.log("2" < 3); // true
위의 예제에서는 작다 연산자를 사용하여 두 값을 비교할 수 있습니다. 이때, 작다 연산자는 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환합니다.
[3]-4. 크다(>) 연산자
console.log(2 > 3); // false
console.log(2 > "3"); // false
console.log("2" > 3); // false
위의 예제에서는 크다 연산자를 사용하여 두 값을 비교할 수 있습니다. 이때, 크다 연산자는 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환합니다.
[3]-5. 작거나 같다(<=) 연산자
console.log(2 <= 3); // true
console.log(2 <= "3"); // true
console.log("2" <= 3); // true
console.log(2 <= 2); // true
위의 예제에서는 작거나 같다 연산자를 사용하여 두 값을 비교할 수 있습니다. 이때, 작거나 같다 연산자는 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환합니다.
[3]-6. 크거나 같다(>=) 연산자
console.log(2 >= 3); // false
console.log(2 >= "3"); // false
console.log("2" >= 3); // false
console.log(2 >= 2); // true
위의 예제에서는 크거나 같다 연산자를 사용하여 두 값을 비교할 수 있습니다. 이때, 크거나 같다 연산자는 숫자와 문자열을 함께 사용할 경우, 자동으로 숫자로 변환합니다.
[4] 논리 연산자(logical operators)
[4]-1. 논리곱(&&) 연산자
console.log(true && true); // true
console.log(true && false); // false
console.log(false && true); // false
console.log(false && false); // false
위의 예제에서는 논리곱 연산자를 사용하여 두 값을 비교할 수 있습니다. 이때, 논리곱 연산자는 두 값이 모두 true일 경우에만 true를 반환합니다.
[4]-2. 논리합(||) 연산자
console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false
위의 예제에서는 논리합 연산자를 사용하여 두 값을 비교할 수 있습니다. 이때, 논리합 연산자는 두 값 중 하나라도 true일 경우 true를 반환합니다.
[4]-3. 논리부정(!) 연산자
console.log(!true); // false
console.log(!false); // true
console.log(!(2 > 1)); // false
위의 예제에서는 논리부정 연산자를 사용하여 값을 반대로 바꿀 수 있습니다. 이때, 논리부정 연산자는 true를 false로, false를 true로 바꿉니다.
[5] 삼항 연산자(ternary operator)
[5]-1. 삼항 연산자(?:)
let x = 10;
let result = (x > 5) ? "크다" : "작다";
console.log(result); // "크다"
위의 예제에서는 삼항 연산자를 사용하여 조건에 따라 값을 선택할 수 있습니다. 이때, 삼항 연산자는 조건식 ? true일 때의 값 : false일 때의 값 형태로 사용합니다.
[6] 타입 연산자(type operators)
[6]-1. typeof 연산자
console.log(typeof 123); // "number"
console.log(typeof "123"); // "string"
console.log(typeof true); // "boolean"
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object"
console.log(typeof {}); // "object"
console.log(typeof []); // "object"
console.log(typeof function(){}); // "function"
위의 예제에서는 typeof 연산자를 사용하여 값의 자료형을 확인할 수 있습니다. 이때, typeof 연산자는 원시 자료형의 경우, 해당 자료형의 이름을, 객체나 함수의 경우, "object" 또는 "function"을 반환합니다. typeof null의 경우 "object"를 반환하는 버그가 있습니다.
