[JavaScript] 자바스크립트의 기초_연산자 활용

 

 

---

 

 

사이드 프로젝트를 위한 자바스크립트

인프런 한 입 크기로 잘라먹는 리엑트(React): 기초부터 실전까지
강의를 기반으로 정리하였으며, 상업적 목적이 아닌 학습 기록용 입니다.

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지| 이정환 Winterlood - 인프런 강의

 

 

목차

Null 병합 연산자

typeof 연산자

삼항 연산자

 

 

---

 

 

Null 병합 연산자

Null 병합 연산자 (??)
null 또는 undefined가 아닌 값을 찾아내는 기능을 수행하며, 여러 값 중에서 null이나 undefined가 아닌 첫 번째 값을 반환한다.
활용: 사용자 이름(userName)이 존재하지 않을 경우 닉네임(userNicName)을 표시하는 것과 같은 상황에서 활용 가능하다.

// null, undefined가 아닌 값을 찾아내는 연산자
let var1;
let var2 = 10;
let var3 = 20;

// ??: 연산에 참여하는 값들 중에 null, undefined가 아닌 값을 찾아냄
let var4 = var1 ?? var2;
// console.log(var4);

let var5 = var1 ?? var3;
// console.log(var5);

let var6 = var2 ?? var3; // 아닌 값들 중 순서 상 앞에 있는 값이 출력
// console.log(var6);

let userName;
let userNicName = "human";

// 유저이름이 존재하고, 닉네임이 undefined라면 유저이름을 저장해라
// 동시에 닉네임이 존재하고, 유저이름이 undefined라면 닉네임으로 저장해라
let dispalyName = userName ?? userNicName;
console.log(dispalyName);

 

 

---

 

 

typeof 연산자

typeof 연산자
값의 타입을 문자열로 변환하여 반환하는 기능을 수행하며, 특정 변수나 값 뒤에 해당 요소의 현재 타입을 확인할 때 사용한다.
변수의 값이 변경됨에 따라 typeof연산자의 결과도 달라질 수 있다.

// 2. typeof 연산자: 값의 타입을 문자열로 변환하는 기능을 하는 연산자
let var7 = 1;
var7 = "hello";
var7 = true;

// 뒤에 나오는 변수나 값의 타입을 문자열로 변환
let t1 = typeof var7;
// console.log(t1);

 

 

---

 

 

삼항 연산자

삼항 연산자
항을 3개 사용하는 연산자로, 조건식을 이용해서 참인 경우와 거짓인 경우 값을 다르게 반환한다.
간단한 조건에 따른 값을 할당하는 경우 if-else문 대신 사용하면 코드를 간결하게 작성 가능하다.

// 3. 삼항 연산자: 항을 3개 사용하는 연산자
// 조건식을 이용해서 참, 거짓인 경우 값을 다르게 반환
let var8 = 10;

// 요구사항: 변수 res에 var8의 값이 짝수(짝), 홀수(홀) 출력
let res = var8 % 2 === 0 ? "짝수" : "홀수";
console.log(res);