// 🎯 주의할 것 중심

// 숫자 타입
NaN + '';             // "NaN"
Infinity + ''         // "Infinity"

// null 타입
null + '';            // "null"

// undefined 타입
undefined + '';       // "undefined"

// 심벌 타입
(Symbol()) + '';      // TypeError: Cannot convert a Symbol value to a string

// 객체 타입
({}) + '';            // "[object Object]"
Math + '';            // "[object Math]"
[] + '';              // ""
[10, 20] + '';        // "10,20"
(function(){}_ + '';  // "function(){}"
Array + '';           // "function Array() { [native code] }"

// 문자열 타입
+""; // 0
+"0"; // 0
+"1"; // 1
+"string" + // NaN
  // 불리언 타입
  true; // 1
+false; // 0

// null 타입
+null; // 0

// undefined 타입
+undefined; // NaN

// 심벌 타입
+Symbol(); // TypeError: Cannot convert a Symbol value to a number

// 객체 타입
+{}; // NaN
+[]; // 0
+[10, 20]; // NaN
+function () {}; // NaN

// 💡 자바스크립트 엔진이 Falsy 값으로 판단하는 값

+ false
+ undefined
+ null
+ 0, -0
+ NaN
+ ''(빈 문자열)

// 1. String 생성자 함수를  new 키워드 없이 호출하는 방법
String(1);              // "1"
String(NaN);            // "NaN"
String(Infinity);       // "Infinity"

String(true);           // "true"
String(false);          // "false"

// 2. Object.prototype.toString 메서드를 사용하는 방법
(1).toString();         // "1"
(NaN).toString();       // "NaN";
(Infinity).toString();  // "Infinity"

(true).toString();      // "true"
(false).toString();     // "false"

// 3. 문자열 연결 연산자를 이용하는 방법
1 + '';                 // "1"
...

// 1. Number 생성자 함수를 new 키워드 없이 호출하는 방법
Number("0"); // 0
Number("-1"); // -1
Number("10.53"); // 10.53

Number(true); // 1
Number(false); // 0

// 2. parseInt, parseFloat 함수를 사용하는 방법(문자열만 숫자 타입으로 변환 가능)
parseInt("0"); // 0
parseInt("-1"); // -1
parseInt("10.53"); // 10
parseFloat("10.53"); // 10.53

// 산술 연산자를 사용하는 방법
+"0"; // 0

// 1. Boolean 생성자 함수를 new 키워드 없이 호출하는 방법
Boolean('x');       // true
Boolean('');        // false
Boolean('false');   // true

Boolean(0);         // false
Boolean(1);         // true
Boolean(NaN);       // false
Boolean(Infinity);  // true

Boolean(null);      // false

Boolean(undefined); // false

Boolean({});        // true
Boolean([]);        // true

// 2. !(부정 논리 연산자를 두 번 사용하는 방법
!!'x';  // true ( !(!'x') === !(false) -> true )
...

"Apple" && "Banana"; // Banana

"Apple" && "Banana"; // Apple

// 💡 논리 연산자 단축 평가 - 기본

// 논리합(||) 연산
"Cat" || "Dog"; // "Cat"
false || "Dog"; // "Dog"
"Cat" || false; // "Cat"

// 논리곱(&&) 연산
"Cat" && "Dog"; // "Dog"
false && "Dog"; // "false"
"Cat" && false; // "false"

// 💡 논리 연산자 단축 평가 - if문 대체 -> 값 할당 시 깔끔함

var done = true;
var message = "";

// 💩 조건문으로 값 할당
if (done) message = "값";

// 👍 논리 연산자(논리곱)으로 값 할당
meessage = done && "값";

// 💡 "객체"를 가리키기를 기대하는 변수가 null 또는 undefined 가 아닌지 확인하고 프로퍼티를 참조할 때
// 객체는 { 키 : 값 } 으로 구성된 프로퍼티(property)의 집합
// 객체를 가리키기를 기대하는 변수의 값이 객체가 아닌 null 이나 undefined 인 경우, 객체 참조시 TypeError가 발생 -> 프로그램 강제 종료

// 💩
var elem = null;
var value = elem.value; // TypeError: Cannot read property 'value' of null

// 👍
// elem이 null 또는 undefined 같은 "Falsy 값"이면 elem 값으로 평가
// elem이 "Truthy 값"이면 elem.value 로 평가
var elem = null;
var elem = elem && elem.value; // null

// 💡 함수 매개변수에 기본값을 설정할 때
// 함수를 호출할 때 인수를 전달하지 않으면 매개변수에는 undefined 가 할당

// 💩 인수를 전달하지 않을 경우
function getStringLength(str) {
  return str.length;
}
getStringLength(); // TypeError: Cannot read property 'length' of undefined

// 👍 단축 평가를 사용한 매개변수의 기본값 설정
function getStringLength(str) {
  str = str || "";
  return str.length;
}
getStringLength(); // 0

// 👍 Es6의 매개변수 default parameter 설정
function getStringLength(str = "") {
  return str.length;
}
getStringLength(); // 0

var elem = null;
var value = elem?.value; // undefined

var elem = null;
var value = elem && elem.value; // null (elem의 null)

// 💡 논리곱(&&) 연산자 vs 옵셔널 체이닝 연산자

// 💩 논리곱(&&) 연산자 = 좌항 피연산자가 Falsy값이면, 좌항 피연산자를 그대로 반환한다. (단, 0 또는 ''은 객체로 평가될 때도 있다.)
var str = ""; //
var length = str && str.length; // ''

// 👍 옵셔널 체이닝 = 좌항 피연산자가 Falsy값이라도 null 또는 undefined 만 아니면, 우항의 프로퍼티를 참조한다.
var str = "";
var length = str?.length; // 0

var foo = null ?? "default string"; // "default string"

// 💡 논리합(||) 연산자 vs null 병합 연산자

// 💩 논리합(||) 연산자 = 좌항의 피연산자가 Falsy값이면, 우항의 피연산자를 반환 (단, 0 이나 ''은 기본값으로서 유호하다면 예기치 않은 동작이 발생 !)
var foo = "" || "default string"; // "default string"

// 👍 null 병합 연산자 = 좌항의 피연산자가 Falsy값이라도 null 또는 undefined 가 아니면, 좌항의 피연산자를 그대로 반환한다.
var foo = "" ?? "default string"; // ''