자바스크립트 Type 변환 (Conversion)

Number()는 숫자로 변환되고, String()은 문자열로 변환되며, Boolean()은 부울(Boolean)로 변환됩니다.


자바스크립트 Data Types

자바스크립트에는 값(values)을 가질 수 있는 5개의 data 유형(types)이 있습니다:

  • string
  • number
  • boolean
  • object
  • function

객체(objects)는 3개의 유형이 있습니다:

  • Object
  • Date
  • Array

값을 가질 수 없는 2개의 data 유형이 있습니다:

  • null
  • undefined

typeof 연산자(Operator)

typeof 연산자로 자바스크립트 변수의 data 유형을 알 수 있습니다.

Example

typeof 연산자는 변수, 객체, 함수 또는 표현식(a variable, object, function or expression)의 데이터 유형을 반환합니다.


숙지하십시오:

  • NaN의 data 유형은 number입니다.
  • array의 data 유형은 object입니다.
  • date의 data 유형은 object입니다.
  • null의 data 유형은 object입니다.
  • undefined variable의 data 유형은 undefined입니다.
  • 값을 할당하지 않은 변수의 data 유형도 undefined입니다.

typeof의 Data 유형(Type)

typeof 연산자는 변수가 아닙니다. 이것은 연산자(operator)입니다. 연산자(Operators) ( + – * / )는 data 유형(type)이 없습니다.

그러나 typeof 연산자는 항상 string을 반환합니다 (피연산자(operand) 유형(type) 포함).


생성자(constructor) 속성(Property)

constructor 속성은 모든 자바스크립트 변수(variables)의 생성자 함수(constructor function)를 반환합니다.

Example

constructor 속성은 변수 또는 객체(a variable or an object)의 생성자 함수(constructor function)를 반환합니다.


constructor 속성(property)을 체크하여 객체(an object)가 배열(an Array)(“Array” 단어 포함)인지 여부를 확인할 수 있습니다:

Example

“직접만든(home made)” isArray() 함수는 배열에 사용할 때 참(true)을 반환합니다:


또는 더 간단하게, 객체(object)가 배열 함수(an Array function)인지 체크할 수 있습니다:

Example

“직접만든(home made)” isArray() 함수는 배열에 사용할 때 참(true)을 반환합니다:


constructor 속성(property)을 체크하여 객체(an objec)가 Date(“Date” 단어 포함)인지 여부를 확인할 수 있습니다:

Example

“직접만든(home made)” isDate() 함수는 날짜(an date)에 사용할 때 참(true)을 반환합니다:


또는 더 간단하게, 객체(object)가 Date 함수인지 체크할 수 있습니다:

Example

“직접만든(home made)” isDate() 함수는 날짜(an date)에 사용할 때 참(true)을 반환합니다:



자바스크립트 유형(Type) 변환(Conversion)

자바스크립트 변수는 새 변수 및 다른 데이터 유형(a new variable and another data type)으로 변환될 수 있습니다:

  • 자바스크립트 함수를 사용하여
  • 자바스크립트 자체에 의해 자동으로(Automatically)

숫자를 문자열로 변환(Numbers to Strings)

전역(global) 메소드 String()은 숫자를 문자열로 변환 할 수 있습니다.

숫자, 리터럴, 변수 또는 표현식(numbers, literals, variables, or expressions)의 모든 유형에 사용할 수 있습니다:

Example


Number 메소드 toString()도 동일합니다.

Example

toString() 메소드는 숫자를 문자열로 변환합니다.


Number Methods 장에서 숫자를 문자열로 변환하는 데 사용할 수 있는 더 많은 메소드를 찾을 수 있습니다:

Method Description
toExponential() Returns a string, with a number rounded and written using exponential notation.
toFixed() Returns a string, with a number rounded and written with a specified number of decimals.
toPrecision() Returns a string, with a number written with a specified length

Booleans을 문자열(Strings)로 변환

전역 메소드 String()은 부울(booleans)을 문자열로 변환할 수 있습니다.


String(false)        // returns "false"
String(true)         // returns "true"

부울 메소드 toString()도 마찬가지입니다.


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

날짜(Dates)를 문자열(Strings)로 변환

전역 메소드 String() 은 날짜를 문자열로 변환 할 수 있습니다.


String(Date())      // returns "Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)"

Date 메소드 toString()도 동일합니다.


Date().toString()   // returns "Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)"

Date Methods 장에서 날짜를 문자열로 변환하는 데 사용할 수 있는 더 많은 메소드를 볼 수 있습니다:

Method Description
getDate() Get the day as a number (1-31)
getDay() Get the weekday a number (0-6)
getFullYear() Get the four digit year (yyyy)
getHours() Get the hour (0-23)
getMilliseconds() Get the milliseconds (0-999)
getMinutes() Get the minutes (0-59)
getMonth() Get the month (0-11)
getSeconds() Get the seconds (0-59)
getTime() Get the time (milliseconds since January 1, 1970)

문자열(Strings)을 숫자(Numbers)로 변환

전역 메소드인 Number() 는 문자열을 숫자로 변환할 수 있습니다.

숫자가 들어있는 문자열 (예: “3.14”)은 숫자 (예: 3.14)로 변환됩니다.

빈(Empty) 문자열은 0으로 변환됩니다.

그 외 다른 것은 NaN(Not a number)으로 변환됩니다.


Number("3.14")    // returns 3.14
Number(" ")       // returns 0 
Number("")        // returns 0
Number("99 88")   // returns NaN

Number Methods 장에서 문자열을 숫자로 변환하는 데 사용할 수있는 더 많은 메소드를 찾을 수 있습니다:

Method Description
parseFloat() Parses a string and returns a floating point number
parseInt() Parses a string and returns an integer

단항(Unary) + 연산자(Operator)

단항 + 연산자는 변수를 숫자로 변환할 수 있습니다:

Example

typeof 연산자(operator)는 변수 또는 표현식(a variable or expression)의 유형(type)을 반환합니다.




변수를 변환할 수(be converted) 없으면, 여전히 숫자이지만 값은 NaN (Not a number)입니다:

Example





부울(Booleans)을 숫자(Numbers)로 변환

전역 메소드 Number()는 부울(booleans)을 숫자로 변환할 수도 있습니다.


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

날짜(Dates)를 숫자(Numbers)로 변환

전역 메소드 Number() 는 날짜를 숫자로 변환할 수 있습니다.


d = new Date();
Number(d)          // returns 1404568027739

date 메소드 getTime() 도 동일합니다.


d = new Date();
d.getTime()        // returns 1404568027739

자동(Automatic) 유형(Type) 변환

자바스크립트는 “잘못된(wrong)” 데이터 유형(type)으로 작동하려고 하면, 값(value)을 “올바른(right)” 유형으로 변환하려고 시도합니다.

항상 기대한 결과(result)가 나오지는 않습니다:



자동(Automatic) 문자열(String) 변환

자바스크립트는 객체 또는 변수를 “출력(output)”하려고 할 때, 변수의(variable’s) toString() 함수를 자동으로(automatically) 호출합니다:


document.getElementById("demo").innerHTML = myVar;

// if myVar = {name:"Fjohn"}  // toString converts to "[object Object]"
// if myVar = [1,2,3,4]       // toString converts to "1,2,3,4"
// if myVar = new Date()      // toString converts to "Fri Jul 18 2014 09:08:55 GMT+0200"

숫자와 불린(booleans)도 변환되지만 이것은 보이지 않습니다:


// if myVar = 123             // toString converts to "123"
// if myVar = true            // toString converts to "true"
// if myVar = false           // toString converts to "false"

자바스크립트 유형(Type) 변환 표(Conversion Table)

다음은 다른 자바스크립트 값(values)을 Number, String 및 Boolean으로 변환하는 결과를 보여주는 표입니다:

Original
Value
Converted
to Number
Converted
to String
Converted
to Boolean
false 0 “false” false
true 1 “true” true
0 0 “0” false
1 1 “1” true
“0” 0 “0” true
“000” 0 “000” true
“1” 1 “1” true
NaN NaN “NaN” false
Infinity Infinity “Infinity” true
-Infinity -Infinity “-Infinity” true
“” 0 “” false
“20” 20 “20” true
“twenty” NaN “twenty” true
[ ] 0 “” true
[20] 20 “20” true
[10,20] NaN “10,20” true
[“twenty”] NaN “twenty” true
[“ten”,”twenty”] NaN “ten,twenty” true
function(){} NaN “function(){}” true
{ } NaN “[object Object]” true
null 0 “null” false
undefined NaN “undefined” false

따옴표로 묶은 값은 문자열 값을 나타냅니다.

빨간색 값은 프로그래머가 기대하지 않을 수도 있는 값을 나타냅니다.

출처: JavaScript Type Conversion

Leave a comment