2024. 01. 02(화) Today I Learned

What I Did Today

1. 알고리즘 문제 해결 시도 (Baekjoon) - (링크)
2. JavaScript 문법 강의 2회차 수강(진행중)

---

JavaScript 문법 주요 내용

변수의 5가지 주요 개념
1. 변수 이름 : 변수에 저장된 값의 이름
2. 변수 값 : 변수에 저장된 값
3. 변수 선언 : 변수를 사용한다고 컴퓨터에 알리는 행위
4. 변수 할당 : 변수에 값을 저장하는 행위
5. 변수 참조 : 변수에 할당된 값을 읽어오는 행위

변수의 선언과 할당

let a;			// 변수 선언
a = "hello";	// 변수 할당

let a = "hello";	// 변수의 선언과 할당

변수 선언 키워드

키워드	동일 이름 재선언	재할당(값 덮어쓰기)
var	가능	가능
let	불가능	가능
const	불가능	불가능

동일한 이름의 변수를 선언

// var
var myVar = "Hello";
var myVar = "Goodbye";		// 가능
console.log(myVar);			// Goodbye

// let
let myLet = "Hello";
let myLet = "Goodbye";		// 불가능
console.log(myLet);			// SyntaxError: Identifier 'myLet' has already been declared

// const
const myConst = "Hello";
const myConst = "Goodbye";	// 불가능
console.log(myConst);		// SyntaxError: Identifier 'myConst' has already been declared

재할당(값 덮어쓰기)

// var
var myVar = "Hello";
myVar = "Goodbye";		// 가능
console.log(myVar);		// Goodbye

// let
let myLet = "Hello";
myLet = "Goodbye";		// 가능
console.log(myLet);		// Goodbye

// const
const myConst = "Hello";
myConst = "Goodbye";	// 불가능
console.log(myConst);	// TypeError: Assignment to constant variable

const

• 재선언과 재할당이 모두 불가능한 변수 선언 키워드
• 상수처럼 사용되는 변수이므로 반드시 선언과 초기화(할당)를 동시에 해야 한다.

const myConst;				// X
const myConst = "Hello";	// O

• 하지만, const로 선언한 객체의 값은 변경할 수 있다.

const person = {name: "Kim"};
person.name = "Park";
console.log(person);	// {name: "Park"}

---

데이터 타입의 형 변환

암시적 형 변환

1. 문자열(String)

	// 문자열을 포함하여 + 연산자를 사용하면 결과값은 항상 String 타입이 된다.
	console.log(1 + "2");			// 12
	console.log("1" + true);		// 1true
	console.log("1" + null);		// 1null
	console.log("1" + undefined);	// 1undefined

2. 숫자(Number)

	// +를 제외한 연산자(-, *, /, % 등)를 사용하면 결과값은 항상 Number 타입이 된다.
	console.log(1 - "2");		// -1
	console.log("2" * "3");		// 6
	console.log(true / 2);		// 0.5

	// 빈 문자열("") 또는 공백 문자열(" ")은 0으로 변환된다.
	console.log("" - 2);		// -2

명시적 형 변환

1. 문자열(String)

	// String() 함수를 사용한다.
	console.log(String(123));		// 123
	console.log(String(true));		// true
	console.log(String(false);		// false
	console.log(String(null));		// null
	console.log(String(undefined));	// undefined
	console.log(String(NaN));		// NaN
	console.log(String({}));		// [object Object]

2. 숫자(Number)

	// Number() 함수를 사용한다.
	console.log(Number("123"));		// 123
	console.log(Number(true));		// 1 (true = 1)
	console.log(Number(false));		// 0 (false = 0)
	console.log(Number(" "));		// 0 (공백 문자열 = 0)
	console.log(Number(""));		// 0 (빈 문자열 = 0)
	console.log(Number(null));		// 0 (null = 0)
	console.log(Number(undefined));	// NaN (Not a Number)
	console.log(Number(NaN));		// NaN (Not a Number)
	console.log(Number({}));		// NaN (Not a Number)

3. 논리값(Boolean)

	// Boolean() 함수를 사용한다.
	console.log(Boolean("123"));		// true
	console.log(Boolean({}));			// true (객체 = true)
	console.log(Boolean(" "));			// true (공백 문자열 = true)
	console.log(Boolean(""));			// false (빈 문자열 = false)
	console.log(Boolean(0));			// false (0 = false)
	console.log(Boolean(null)); 		// false (null = false)
	console.log(Boolean(undefined));	// false (undefined = false)
	console.log(Boolean(NaN));			// false (NaN = false)

---

논리 연산자의 단축 평가

단축 평가(Short Circuit Evaluation)

• 왼쪽부터 오른쪽 순서로 조건식을 평가하는 도중에 평가 결과가 정해지면,
  그 즉시 결과를 반환하고 나머지 조건식은 평가하지 않는다.
• 결과값으로 마지막으로 평가한 조건식의 값을 반환한다. (논리값 x)

논리곱 연산자(&&, AND)의 단축 평가와 활용

Pattern	결과값
value && true	true
true && value	value
value && false	false
false && value	false
value1 && value2	value2

// 조건부 실행
let x = 10;

(x>0) && console.log("x는 양수입니다.");	// x는 양수입니다. (true && value => value)

논리합 연산자(||, OR)의 단축 평가와 활용

Pattern	결과값
value || true	value
true || value	true
value || false	value
false || value	value
value1 || value2	value1

// 변수의 초기값 설정
let x;
let y = x || 10;
console.log(y);		// 10 (false(undefined) || value => value)