연산자 기초

자바스크립트의 연산자는 크게 5가지 타입의 연산자로 구분합니다.

산술, 비교, 논리, 삼항, 비트 연산자 5가이며, 비트 연산자를 제외한 나머지 4가지는 기초 중의 기초이므로 꼭 상세 부분까지 알아두는 것이 좋습니다.

산술 연산자

더하기(+), 빼기(-), 곱하기(*), 나누기(/) 의 사칙 연산을 하는 연산자를 말합니다.

문자열의 경의 더하기 연산자를 사용할 수 있습니다.

그 외에 나머지(%), 제곱(**), 음수/양수(-/+), 증가/감소(++/--) 연산자가 있습니다.

증가/감소 연산자는 숫자 변수의 값을 1 증가, 또는 1 감소합니다.

증가/감소 연산자는 변수 앞과 뒤에 모두 붙여 사용할 수 있습니다.

단, 앞에 붙이냐 뒤에 붙이냐에 따라 의미가 조금 다르게 사용되므로 사용할 때 개념을 정확히 알고 사용해야 합니다.

앞에 불일 경우 1 증가/감소 후(선 적용) 변수가 포함된 연산식에 적용됩니다. 출력문에도 동일하게 적용됩니다.

뒤에 붙일 경우 포함된 연산식의 실행이 완료된 후 1 증가/감소(후 적용)가 됩니다.

let x = 1;console.log(x++); // 1 출력 후 1 증가console.log(++x); // 1 증가 후 3출력console.log(x); // 3 출력

사칙 연산자는 등호와 결합해 산술 등호 연산자(+=, *=, -=, /=)로 사용할 수 있습니다.

사칙 연산자는 반드시 등호 앞에 와야 합니다. 

사칙 연산자가 등호 뒤에 오면, 사칙 연산자는 무시되고 등호만 적용됩니다.

에러는 발생하지 않습니다.

x += 3 => x = x + 3

으로 풀어서 사용하는 것과 같습니다.

비교 연산자

두개의 값을 비교해 값이 같은지, 또는 크거나 같은지를 비교합니다.

같은지를 비교하는 일치 연산자, 크거나 작은지를 비교하는 관계 연산자로 구분합니다.

값이 같은지를 비교하는 일치 연산자는 등호와 느낌표로 여러가지 일치 여부 조건을 결정합니다.

==, !=, ===, !== 4개의 일치 연산자가 있습니다.

관계 연산자는 두 값의 크기를 비교하는 연산자입니다.

>, <, >=, <= 4개의 비교 연산자가 있습니다.

관계 연산자 비교시 숫자형 외에 문자열도 비교를 할 수 있습니다.

문자열 비교시에는 대문자보다보다 소문자가 크다는 점만 주의하면 됩니다.

아스키II 순서 기준에 따라 'Alphabet' 보다는 'alphabet' 가 더 큰 값이 됩니다. ( 숫자 < 대문자 < 소문자 )

console.log('5' == 5);console.log('5' === 5);console.log('5' !== 5);console.log(null == undefined);console.log(null === undefined);
console.log('5' > 5);console.log('Alphabet' < 'alphabet');console.log('abc' >= 5);console.log('abc' < 0);console.log('0' < 'a');

삼항 연산자

if 조건 비교 구문을 대신해 사용하며, 비교 결과에 따른 값의 대입을 간결하게 표현해주기 때문에 사용 빈도가 아주 높습니다.

자바스크립트에서 유일하게 3개의 항을 가진 연산자입니다. 나머지는 모두 이항 연산자(2개의 항을 비교)입니다.

let 변수 = 조건비교문 ? 참인 경우:거짓인경우;

구조로 사용합니다.

let result = a > b ? 1 : 2;let canDrink = age > 19 ? 'adult' : 'kid';let bool = friend == '라이언' ? true : false;cond ? console.log('true') : console.log('false');

형태로 사용합니다.

반환하는 결과값이 필요 없는 경우 처리 로직을 넣을 수도 있습니다.

논리 연산자

참/거짓을 나타내는 2개의 불리언 항을 비교해 참인지 거짓인지를 판단하는 연산자입니다.

비교하는 좌우 두 항도 불리언이며, 결과도 불리언이 됩니다.

논리 연산자는 AND, OR, NOT 3개의 연산자가 있습니다.

자바스크립트에서 사용하는 논리 연산자의 실제 사용 기호는 &&(AND), ||(OR), !(NOT) 입니다.

NOT 연산자는 각 비교항의 앞에 붙일 수 있으며, AND, OR 연산자는 두 항의 사이에 위치해 참/거짓을 비교합니다.

자바스크립트에서 Undefined, Null, 0, NaN, '' 은 false 이며, 그 외에는 모두 true로 캐스팅 됩니다.

따라서 다양한 데이터 타입과, 데이터를 논리 연산자로 비교할 수도 있습니다.

단, 두 항을 비교할 때 나중에 나오는 항의 데이터 타입은 반드시 불리언 타입이어야 합니다.

캐스팅 원칙에 따라 뒤에 나오는 항의 데이터 타입을 따라가게 됩니다.

&&(AND) 연산자는 두 항이 모두 참일때 true를 반환합니다.

||(OR) 연산자는 둘중 한 항이 참이면 true를 반환합니다. 두 항 모두 거짓이면 false를 반환합니다.

!(NOT) 연산자는 !가 붙은 항이 참이면 거짓으로, 거짓이면 참으로 변경합니다.

!! 두개를 연달아 붙이면 NOTNOT이 되어 원래의 참/거짓으로 돌아옵니다.

문자열 값의 불리언 결과를 얻어서 사용해야 하는 경우 !!으로 참/거짓 값을 가져옵니다.

OR(||) 연산자는 비교할 때 먼저 나오는 항이 참이면 뒤에 오는 항은 확인을 하지 않고 참을 반환합니다.

console.log(!!'문자열');console.log(1<2 && 3<3);console.log(1 && true);console.log((!!'문자열' || false));console.log(null || !!undefined);
console.log(false || null);console.log(null || true);

비트 연산자

바이너리 데이터 제어 용도 외에는 사용 빈도가 높지는 않은 연산자입니다.

웹에서는 이미지 필터 적용이나, 암호화 데이터를 생성하는 용도로 많이 사용합니다.

2진수 비트 데이터를 제어하는 연산자는 총 7개가 있습니다.