Operator 2022.02.26

잔잔바리디자이너·2022년 2월 28일
0

Javascript

목록 보기
5/12
post-thumbnail

연산자

하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산 등을 수행하여 하나의 값을 만든다.

피연산자

연산의 대상을 피연산자 라고 한다. 피연산자는 값으로 평가될 수 있는 표현식이어야 한다. 피연산자 + 연산자 조합으로 이루어진 연산자 표현식 또한 값으로 평가될 수 있는 표현식이다.

산술 연산자

  • 이항산술 연산자:

    두개의 피연산자를 산술 연산하여 숫자 값을 만든다. 모든 이항 산술 연산자는 피연산자의 값을 변경하는 부수효과가 없다.
  • 단항산술 연산자:

    1개의 피연산자를 산술 연산하여 숫자 값을 만든다.
    ++ 증가, 부수효과 있음
    -- 감소, 부수효과 있음
    +어떠한 효과도 없다, 부수효과 없음
    -양수를 음수로, 음수를 양수로 반전한 값을 반환, 부수효과 없음
    흥미로운점: 증가/감소 연산자는 위치에 따라 의미가 다르다.
//증가/감소의 부수효과 - 암묵적 할당이 이루어지기때문에!

var x = 1;
x++; // x = x + 1;
console.log(x); // 2

//위치에 따른 작동

var x = 5, result;

//선할당 후증가
result = x++;
console.log(result, x); // 5 5

//선감소 후할당
result = --x;
console.log(result, x); // 5 6
  • 문자열 연결 연산자:

    +연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다. 그 외의 경우는 산술 연산자로 동작한다.
//문자열 연결 연산자
자바스크립트 엔진은 압묵적으로 타입을 자동 변환한다.
암묵적 타입 변환(타입 강제 변환)이라고 한다.

'1' + 2; // '12'

1 + true; // 2 (true가 1로 타입 변화 됐다.)

할당 연산자

우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당한다. 좌항의 변수에 값을 할당하므로 당연히 변수 값이 변하는 부수 효과가 있다. 할당문은 표현식인 문이다.

  • -=
  • +=
  • -=
  • *=
  • /=
  • %=

비교 연산자

비교 연산자는 좌항과 우항의 피연산자를 비교한 후 그 결과를 불리언 값으로 반환한다. 부수효과는 없다.

동등/일치 비교

동등 비교 연산자와 일치 비교 연산자는 비교하는 엄격성의 정도가 다르다. 앞서 보았듯이 자바스크립트 엔진은 암묵적 타입 변환을 한다. 동등 비교 연산자는 좌항과 우항의 피연산자를 비교할때 먼저 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교한다.

  • == 동등비교 : 좌항과 우항의 값이 같음
  • === 일치비교 : 좌항과 우항의 값과 타입이 같음
var z = '1';
var a = 1;
z == a // true
z === a //false

주의할 점은 NaN이다.
NaN은 자신과 일치하지 않는 유일한 값이다.

NaN === NaN; // false

띠용?
예를들어 우리가 어떤 값이 NaN인지 아닌지 궁금 할 때는 어떻게하지?
NaN은 지 스스로와 일치하지 않는 값이기 때문에 아래처럼 비교해서는 조사 할 수 없다.

var x = 1 + undefined; // NaN
x === NaN // false

그래서 빌트인 함수 Number.isNaN을 사용 할 수 있다.

Number.isNaN(x) // true
Number.isNaN(x) === Number.isNaN(NaN) // true

또는 ES6에서 도입된 Object.is 메서드를 사용하여 정확한 비교 결과를 반환 할 수 있다.

-0 === +0; // true
Object.is(-0, +0); // false

NaN === NaN; // false
Object.is(NaN,NaN) // true

대소 관계 비교 연산자

>, <, >=, <= 이 있다.

삼항 조건 연산자(Ternary operator)

조건식의 평가 결과에 따라 반환할 값을 결정한다. 부수 효과는 없다.
조건식 ? 조건식이 true일 때 반환할 값 : 조건식이 false일 때 반환할 값.

var x = 2;
var result = x%2 ? '홀수' : '짝수'
result // 짝수

삼항 조건 연산자의 첫 번째 피연산자는 조건식이므로 삼항 조건 연산자 표현식은 조건문이다. 아래처럼 표현 가능하다.

var x = 2, result;
if (x%2) result = '홀수';
else result = '짝수';

그러나 삼항 조건 연산자 표현식은 값처럼 사용 가능 하지만, if else 문은 값처럼 사용할 수 없다. if esle 문은 표현식이 아니라 '문'이다.

논리 연산자

논리합, 논리곱, 부정
논리 부정(!) 연산자는 언제나 분리언 값을 반환한다.

//암묵적 타입 변환
!0 // true
!'Hello' // false

단축 평가

논리합 또는 논리곱 연산자 표현식의 평과 결가는 불리언 값이 아닐 수도 있다. 언제나 2개의 피연산자 중 어느 한쪽으로 '평가'된다.

//단축 평가
'Cat' && 'Dog' // 'Dog'

typeof 연산자

number, boolean, undefined, symbol, object, funcction 중 하나를 반환한다.

  • 주의할 점: null값은 typeof 연산자로 연산 했을 때 object를 반환한다.
    따라서 값이 null 타입인지 확인하려면===를 사용해야 한다.
var foo = null;
typeof foo === null; //false
foo === null; // true

지수 연산자

좌항의 피연산자를 밑으로, 우항의 피연산자를 지수로 거듭제곱 하여 숫자 값을 반환.

2 ** 2; //4

var x = 5;
x **= 2; // 25

0개의 댓글