[JavaScript] 타입변환과 단축평가

(1) 묵시적 타입 변화(자동 타입변환)

- 특정 타입의 값을 기대하는 곳에 다른 타입의 값이 오면, 자동으로 타입을 변환되는 것이다.

var x = "14", y = 20;
var a = x + y;
console.log(typeof a, a); // string, 1420
a = x - y;
console.log(typeof a, a); // number, -6
a = x * y;
console.log(typeof a, a); // number, 280

(2) 명시적 타입 변환

- 사용자에 의해 의도적으로 값의 타입을 변환하는 것이다.

- Number( ) : 문자를 숫자로 변환한다.

- String( ), .toString() : 숫자나, 불린 등을 문자형으로 변환한다.

- Boolean( ) : 문자나 숫자 등을 불린 형으로 변환한다. // 값이 1이거나 존재하면 true, 0이거나 존재하지 않으면 false,

- Object( ) : 모든 자료형을 객체형으로 변환한다 // 하위에 값을 줄 수 있게 된다.

- parseInt( ) : 문자를 int형으로 변환한다. (정수) // 소수점 아래 숫자를 자른다.

- parseFloat( ) : 문자를 float형으로 변환한다. (소수) // 소수점 아래 숫자까지 살려준다.

var x = 10;
var y = "10";
var z = "10.111";
console.log(typeof String(x), String(x));           // string 10
console.log(typeof Number(z), Number(z));           // number 10.111
console.log(typeof Boolean(x), Boolean(x));         // boolean true
console.log(typeof Object(x), Object(x));           // object [Number: 10]
console.log(typeof parseInt(z), parseInt(z));       // number 10
console.log(typeof parseFloat(z), parseFloat(z));   // number 10.111

(3) 단축 평가

- 논리 평가를 할 때 중간에 평가 결과가 나오면 끝까지 평가하지 않고 평가 결과를 반환해 버린다.

- ||(논리합) 연산자의 단축 평가 : 왼쪽이 true면 왼쪽 그대로 반환, 왼쪽이 false면 오른쪽 값을 반환한다.

true || false;     // true (오른쪽의 false는 볼 것도 없이, 왼쪽의 true 반환) 
true || true;      // true (오른쪽의 true는 볼 것도 없이, 왼쪽의 true 반환)
"apple" || false;  // "apple" 
"apple" || true;   // "apple"

false || true;     // true  (오른쪽 값이 반환된다) 
false || false;    // false (오른쪽 값이 반환된다)
false || "banana"; // "banana"

"apple" || "banana"; // "apple" (왼쪽 값이 빈 문자열이 아니므로 true로 평가되고 왼쪽이 true로 평가되기 때문에 왼쪽 값 apple 반환)

- &&(논리곱) 연산자의 단축 평가 : 둘 다 true여야 true이므로 왼쪽이 false면 오른쪽을 평가하지 않고 왼쪽 값 반환, 왼쪽이 true면 오른쪽 값을 그대로 반환한다.

false && true;        // false (오른쪽은 볼 것도 없이, false) 
false && false;       // false (오른쪽은 볼 것도 없이, false)
false && "banana";    // false (왼쪽이 false이므로 왼쪽 값 false 반환)
null && false;        // null  (왼쪽이 false이므로 왼쪽 값 null 반환)

true && true;         // true  (왼쪽이 true이므로 오른쪽 값 true를 그대로 반환) 
true && false;        // false (왼쪽이 true이므로 오른쪽 값 false를 그대로 반환)
"apple" && true;      // true  (왼쪽이 문자열(true)이므로 오른쪽 값 true를 그대로 반환)
"apple" && false;     // false (왼쪽이 문자열(true)이므로 오른쪽 값 false를 그대로 반환)

"apple" && "banana"   // "banana" (왼쪽 값이 빈 문자열이 아니므로 true로 평가되므로 오른쪽 값 banana 반환)

- 주로 null / undefined체크, 함수 매개변수 기본 값 설정, 조건부 변수 값 할당에 유용하게 쓰인다.

const a = null; 
const b = a && a.name;             // a가 null이면 false로 평가되므로, 오른쪽은 볼 것도 없이 왼쪽 값인 a(null)이 할당된다.
console.log(b);                    // null


function a(name){ 
	const b= name || "이름없음"; 
	return b; 
}; 
a('wangi')                         // "wangi" 
a();                               // "이름없음"