5. 표현식과 연산자

최용석·2024년 4월 29일

연산자

표현식과 연산자

표현식이란 어떤 값으로 평가 되는 것을 뜻한다. 표현식을 평가한다는 말은 표현식의 값과 변수, 함수 등의 값을 바탕으로 식의 값을 계산하는 행위를 뜻한다.
연산자를 사용하면 표현식을 조합하여 더욱 복잡한 표현식을 만들 수 있다.

a + b

이 코드에서 + 부분이 연산자이고, a와 b는 연산 대상이 되는 표현식으로 피연산자라고 한다.

문자열 제어하기

문자열 연결

"Hello " + "World!" // -> "Hello World!"
"1" + "2" // -> "12"
1 + {} // -> "1[object Obejct]"

자바스크립트의 문자열은 불변이어서 replacetoUpperCase 메서드 등은 새로운 문자열을 반환하며 메서드를 호출한 문자열은 수정하지 않는다.

논리 연산자와 관계 연산자

== (동일 연산자)

  1. 좌우 피연산자의 타입이 같은 경우
    • 값이 같으면 true, 다르면 false
  2. 좌우 피연산자의 타입이 다른 경우
    • undefinednull의 값은 같은 것으로 친다.
    • 한쪽이 숫자고 다른 한쪽이 문자열이면 문자열을 숫자로 변환해서 비교한다.
    • 둘 중에 한족이 논리갑이면 ture는 1, false는 0으로 변환해서 비교한다.
    • 한쪽이 객체고 다른 한쪽이 숫자 또는 문자열이면 객체를 toString이나 valueOf 메서들르 사용해서 원시 타입으로 변환한 다음 비교한다.
    • 앞의 규칙에서 벗어난다면 모두 '같지 않음'으로 판정한다.
null == undefined // -> true
1 == "1" // -> true
"0xff" == 255 // -> true
true == 1 // -> true
true == "1" // -> true
(new String("a")) == "a" // -> true
(new Number(2)) == 2 // -> true
[2] == 2 // -> true

=== (일치 연산자)

피연산자를 평가한 후에 타입을 변환하지 않은 상태의 두 값을 엄격하게 비교. 타입과 값이 모두 같아야 같다고 판정한다.
단, NaN은 NaN을 포함한 모든 값과도 같지 않다고 판정.

null === undefined // -> false
1 === "1" // -> false
"0xff" === 255 // -> false
true === 1 // -> false
true === "1" // -> false
(new String("a")) === "a" // -> false
(new Number(2)) === 2 // -> false
[2] === 2 // -> false

논리 연산자

연산자예제예제의 뜻
&&논리곱a && ba와 b가 모두 true면 true, 그 외에는 false
||논리합a || ba와 b 중 하나라도 true면, true, 모두가 false면 false
!부정!aa가 true면 false, false면 true

피연산자의 평가

피연산자평가되는 값
0, -0, 빈 문자열(""), NaN, null, undefinedfalse
0을 제외한 숫자, 빈 문자열을 제외한 문자열, 모든 객체, 심벌true

논리곱 연산자와 논리합 연산자의 단락 평가

논리곱(&&) 연산자와 논리합(||) 연산자는 단락 평가를 한다. 단락 평가란 첫 번재 피연산자의 값이 표현식을 결정하면 다음 피연산자를 평가하지 않는 것을 의미한다.

a && b // a가 false인 경우 b를 평가하지 않는다

이러한 성질을 이용해서 다음과 같이 사용할 수 있다.

var time = time_interval || animationSettings.time || 33;

time의 값으로 time_interval이 정의되어 있다면 time_interval을 사용하고, 정의되지 않았다면 animationSettings.time을 판단하여 사용한다. animationSettings.time도 정의되어 있지 않다면 33을 사용한다.

명시적 타입 변환

숫자를 문자열로 변환

  • 숫자 + 문자열
    10 + "cookies" // -> "10cookies"
    100 + "" // -> "100"
  • Number 객체의 메서드를 활용
    var n = 26;
    n.toString() // -> "26"
  • String 함수를 활용
    String(26) // -> "26"
    // new를 붙이는 경우 String 객체가 반환되고, new를 붙이지 않으면 String 함수의 반환값으로 문자열로 반환된다.

문자열을 숫자로 변환

  • 수식 안에서 묵시적으로 변환
    var s = "2";
    s - 0 // -> 2
    +s // -> 2
  • parseInt와 parseFloat 함수를 사용하는 방법
    parseInt("3.14) // -> 3
    parseFloat("3.14) // -> 3.14
  • Number 함수를 활용
    Number("2.71828") // -> 2.71828
    // new를 붙이는 경우 Number 객체가 반환되고, new를 붙이지 않으면 Number 함수의 반환값으로 숫자가 반환된다.
profile
호기심이 많은 백엔드 개발자

0개의 댓글