javaScript. (4) 연산자(operator)

1. 연산자

 

- 프로그래밍에서 쓰이는 기호들.

 

 

📌 산술 연산자

사칙연산. (=arithmetic operation)

 

+ , - , * , / 그리고 나머지연산자(%)

Addition / Subtraction / Multiplication / Division / Mod(Moudlus)

 

 

❗ /는 그냥 나누기 (몫 아님). 즉, 5 / 2 = 2.5 

 

❗ +를 제외한 나머지(-와 *와 /)는 "3" 과 "2"처럼 문자열로 표현된 숫자의 계산도 해줌.

>> + 연산자는 "2"+"3" = '23' 이 됨.

 

 

 

 

📌 문자열 연산자

+ 연산자.

숫자 뿐만 아니라 문자열과 다른 데이터를 연결해줌.

>> 문자열이 아닌 데이터(예- 숫자)는 문자열로 바꾸어 연결.

 

❗ 왼쪽부터 계산되고, 문자열이 있을 경우 문자열이 우선이다.

const string = 'hello ' + 'I am ' + 23;       // 'hello I am 23'

const string2 = 2 + 3 + 'years';          // 5years
const string3 = 2 + 'years' + 3;          // 2years3

string2를 보면

숫자가 먼저 오기 때문에 먼저 숫자를 더하고, ( 2+3 )

그 후에 'years' 문자열과 더해져서 5years가 된다.

 

 

 

 

📌 증감 연산자

++ 와 -- 가 있다.

변수에 1을 더하거나 빼줌.

 

증감연산자를 붙이는 위치에 따라 결과가 달라짐.

 

• 전위 증감연산자
• 후위 증감연산자

const i = 0;

i++;   // 동작 먼저 한 후, i = i+1.
++i;   // i = i+1 먼저 한 후, 동작.

 

전위전산자 (++i)	값이 먼저 증가 -> 작업 수행
후위전산자 (i++)	작업 먼저 수행 -> 값이 증가

 

 

 

📌 대입 연산자 (=)

const name = 'yjin';

위 코드처럼 변수에 값을 대입하는 연산자.

= 기준 우측에 있는 값을 좌측의 변수에 대입함.

 

 

+) 💡 복합 대입연산자

 

+=

-=

/=

*=

%=

 

>> 단순히 코드의 양만 줄어듬. ( i = i + 2를  ▶▶  i += 2 로 줄임)

 

 

 

 

📌 비교 연산자

==	같음
!=	같지 않음
>, <	큼, 작음
>=, <=	크거나같음, 작거나같음

cf> = 하나만 쓰면 대입연산자. 같다(equal)의 의미가 아님.

 

 

❗❗ 자바스크립트에서 ==와 !=는 조심히 써야함.

 

 

📌 === 비교연산자

자바스크립트에는 변수에 자료형을 나타내는 부분 (int, string, boolean등)이 없어서

 

== 만을 사용한다면

0
''
false
[]

위 값들은 모두 같다 (==) 가 true가 된다.

== 로 비교연산을 할 때 자동으로 자료형을 바꿔버리고 값만 비교하기 때문.

 

 

>> 따라서 === 를 이용하여 값 뿐만 아니라 자료형까지 같아야 true가 됨.

 

 

 ==와 != 보다는 === 와 !==를 쓰자.

 

 

 

 

 

 

📌삼향 연산자

- (조건 ? 참 : 거짓) 으로 구성됨.

 

let ternary = i > 10? 15 : 6       // i > 10이면 해당 변수는 15가되고, 아니면 6이 됨.

 

조건은 true와 false로 나오고,

true일때의 값과

false일때의 값을 : (콜론)으로 구분하여 적는다.

 

 

📌논리 연산자

&& (AND)	True && True 여야 True True && False 또는 False && False면 False
|| (OR)	True || True 와 True || False 모두 True False || False 여야 False
! (NOT)	False면 True

❗❗ 여기서, False인 값은 단순히 Boolean값인 false만이 아님.

>> ''(공백), 0, false, NaN(Not a Number), undefined, null, document.all 이 있다.

 

 

 

___

 

❕ TIP

해당 값이 true인지 false인지 빠르게 체크하는 법 - 느낌표 두개(!!) 사용

const hello = NaN;
!!hello;    // false

const str = '';
!!str;     // false

const arr = [];
!!arr;     // true

** 공백 문자열('')은 false이지만, 빈 배열이나 객체는 true값이다!

 

___

 

 

 

코드를 줄이는 논리연산자

let hello = a && b;  // a가 참이면 hello = b 이고 거짓이면 hello = a;

let hello = a || b;   // a가 참이면 hello = a 이고 거짓이면 hello = b;

 

첫번째 줄에서

a가 존재(true인 값)한다면 a && b 에 의해서 b의 값도 검사한다.

그리고, b도 존재한다면 hello의 값은 b가 된다.

 

만약 a가 없다면(false) 무엇이 오든 false와 &&하여 false가 된다.

따라서 hello는 undefined가 된다. (b는 검사하지도 않음)

 

 

두번째 줄에서는

a가 있으면 a || b가 true이므로 b는 검사하지도 않고 바로 hello값은 a가 된다.

만약 a가 없다면 이제 b를 검사해서 hello값은 b가 된다.

 

 

 

 

** 만약, a,b,c에 각 연산자를 사용하면

 

|| 연산은

a가 아니면 b, b가 아니면 c까지 확인한다.

결국 a,b 모두 아니면 c가 되는 것.

 

&& 연산은

a도 있고 b도 있으면 c가 되고

a가 있는데 b가 없으면 b가 되고

a가 없으면 a가 되는 것.

 

 

 

 

 

+) 부울대수 계산에 대해 이해하면 편함.

 

AND / OR / NOT

 

부울대수 계산 공식

cr: jihyehwang09.github.io

 

&& 연산자는 true가 아닐 때까지 다음 것을 찾고,
|| 연산자는 false가 아닐 때까지 다음 것을 찾음.

&&는 주로 필수 조건을 의미할 때 사용. 
||는 기본값(default)를 정할 때 사용.

 

 

---

REFERENCE

https://www.zerocho.com/category/JavaScript/post/572f55d773b6f3c5fdbf4426

(JavaScript) 연산자(operator)

이 포스팅은 zerocho님의 javascript 강의와 책을 보고 작성한 글입니다.

공부+기록 용으로 작성한 것이며, 자세한 것은 위 포스팅을 참고하세요!