타입변환과 단축평가

질문 List

타입변환과 단축 평가 🔥

1. 명시적 타입 변환이 뭔가요?
2. 명시적 타입 변환 함수를 예를 들어볼 수 있나요?
3. 암묵적 타입 변환이 뭔가요?
4. truthy / falsy 한 값이 뭔가요?

질문 & 정답 List

타입변환과 단축 평가 🔥

1. 명시적 타입 변환이 뭔가요?

• 명시적 타입 변환(=타입 캐스팅) : 개발자에 의해 의도적으로 값의 타입을 변환하는 것

2. 명시적 타입 변환 함수를 예를 들어볼 수 있나요?

1. String타입으로 변환

   1. String 생성자 함수를 new 연산자 없이 호출하는 방법

      String(1); // '1'
      String(true); // 'true'
      String(null); // 'null'
   2. Object.prototype.toString 메서드를 사용하는 방법

   (1).toString(); // '1'
   true.toString(); // 'true'
   null.toString(); // 'null'
   3. 문자열 연결 연산자를 이용하는 방법

   1 + ""; // '1'
   true + ""; // 'true'
   null + ""; // 'null'
   ```\

2. Number 타입으로 변환

   1. Number 생성자 함수를 new 연산자 없이 호출하는 방법

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

   parseInt("0"); // 0
   parseInt("-1"); // -1
   parseFloat("10.53"); // 10.53
   3. + 단항 산술 연산자를 이용하는 방법

   +"0"; // 0
   +"-1"; // -1
   +"10.53"; // 10.53

3. Boolean 타입으로 변환

   1. Boolean 생성자 함수를 new 연산자 없이 호출하는 방법

   Boolean("x"); // true
   Boolean(""); // false
   Boolean([]); // true
   Boolean({}); // true
   Boolean(function () {}); // true
   2. ! 부정 논리 연산자를 두 번 사용하는 방법

   !!"x"; // true
   !!""; // false
   !![]; // true
   !!{}; // true
   !!function () {}; // true

3. 암묵적 타입 변환이 뭔가요?

• 암묵적 타입 변환(=타입 강제 변환) : 개발자의 의도와는 상관없이 표현식을 평가하는 도중에 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되는 것

1. String 타입으로 변환

   1. +를 이항 연산자로 사용 (단한 연산자 사용 시 Number 타입으로 변환)

   1 + "2"; // '12'
   true + "2"; // 'true2'

2. Number 타입으로 변환

   1. 산술 연산자(-,*,/)를 사용하는 방법

   4 - true; // 3
   3 * "3"; // 9
   3 / "3"; // 1
   2. +를 단항 연산자로 사용

   +true; // 1
   +false; // 0
   +null; // 0
   +undefined; // NaN

3. Boolean 타입으로 변환

   1. if문, for문, 삼항 조건 연산자의 조건식으로 사용하는 방법

   if ("") console.log(x);
   // if (false) console.log(x);
   if (null) console.log(x);
   // if (false) console.log(x);
   if (undefined) console.log(x);
   // if (false) console.log(x);
   if (0) console.log(x);
   // if (false) console.log(x);
   if (NaN) console.log(x);
   // if (false) console.log(x);

4. truthy / falsy 한 값이 뭔가요?

• Truthy : Falsy한 값이 아닌 값
  • e.g. true, [], {}, 42, "0", "false", new Date(), -42, 12n, 3.14, -3.14, Infinity, -Infinity
  • 주의할 점 : 빈 배열, 빈 객체도 Truthy라는 점 !
• Falsy한 값 : false, undefined, null, 0, -0, NaN, ''

추가 질문 : 단축 평가가 뭔가요?

• 단축 평가 : 논리 평가를 결정한 피연산자의 평가 결과를 그대로 반환하는 것

1. 논리 합 연산자 || : 두 개의 피연산자 중 하나만 true로 평가되어$$도 true 반환

   "Cat" || "Dog"; // "Cat"
   false || "Dog"; // "Dog"
   "Cat" || false; // "Cat"
   false || false; // false
   • 첫 번째 피연산자가 true -> 첫 번째 값 그대로 반환(첫 번째 피연산자로 결정)
   • 첫 번째 피연산자가 false -> 두 번째 값 그대로 반환
2. 논리 곱 연산자 && : 두 개의 피연산자가 모두 true로 평가되어야 true 반환

   "Cat" && "Dog"; // "Dog"
   false && "Dog"; // false
   "Cat" && false; // false
   • 첫 번째 피연산자가 false -> false 반환
   • 첫 번째 피연산자가 true -> 두 번째 값 그대로 반환(두 번째 피연산자로 결정)

+단항 연산자는 암묵적 타입 변환인가요, 명시적 타입 변환인가요?

• • 단항 연산자를 사용한 타입 변환은 암묵적 타입 변환에 더 가깝다고 볼 수 있지만, 프로그래머의 의도에 따라 명시적 타입 변환으로도 간주될 수 있습니다. 이는 JavaScript와 같은 동적 타입 언어의 특성 때문에 경계가 모호할 수 있습니다.

Reference

• 타입 변환과 단축 평가