자바스크립트 유형 변환


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

JavaScript 데이터 유형

JavaScript에는 5가지 데이터 유형이 있습니다.

  • string

  • 숫자

  • 부울

  • 객체

  • 함수

3가지 객체 유형:

  • 객체

  • 날짜

  • 배열

값이 없는 데이터 유형 2개:

  • null

  • 정의되지 않음

typeof 연산자

typeof 연산자를 사용하여 JavaScript 변수의 데이터 유형을 볼 수 있습니다.

인스턴스

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>

<p> typeof 操作符返回变量、对象、函数、表达式的类型。</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 
    typeof "john" + "<br>" +
    typeof 3.14 + "<br>" +
    typeof NaN + "<br>" +
    typeof false + "<br>" +
    typeof [1,2,3,4] + "<br>" +
    typeof {name:'john', age:34} + "<br>" +
    typeof new Date() + "<br>" +
    typeof function () {} + "<br>" +
    typeof myCar + "<br>" +
    typeof null;
</script>

</body>
</html>

인스턴스 실행»

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요

참고:

  • NaN의 데이터 유형은 숫자입니다.

  • 배열(Array)의 데이터 유형은 객체입니다.

  • date(Date)의 데이터 유형은 object

  • null의 데이터 유형은 object

  • 정의되지 않은 변수 데이터 유형이 정의되지 않았습니다

객체가 JavaScript Array 또는 JavaScript Date인 경우 둘 다 Object를 반환하므로 typeof를 통해 해당 유형을 판단할 수 없습니다.

생성자 속성

생성자 속성은 모든 JavaScript 변수의 생성자를 반환합니다.

인스턴스

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>

<p> constructor 属性返回变量或对象的构造函数。</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 
    "john".constructor + "<br>" +
    (3.14).constructor + "<br>" +
    false.constructor + "<br>" +
    [1,2,3,4].constructor + "<br>" +
    {name:'john', age:34}.constructor + "<br>" +
    new Date().constructor + "<br>" +
    function () {}.constructor;
</script>

</body>
</html>

인스턴스 실행»

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요

생성자 속성을 사용하여 객체가 배열인지 확인할 수 있습니다. ("배열" 문자열 포함):

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>

<p>判断是否为数组。</p>
<p id="demo"></p>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = isArray(fruits);
function isArray(myArray) {
    return myArray.constructor.toString().indexOf("Array") > -1;
}
</script>

</body>
</html>

인스턴스 실행»

"인스턴스 실행"을 클릭합니다. 버튼 온라인 예제 보기

생성자 속성을 사용하여 객체가 날짜인지 확인할 수 있습니다 (문자열 "날짜" 포함):

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>

<p>判断是否为日期。</p>
<p id="demo"></p>
<script>
var myDate = new Date();
document.getElementById("demo").innerHTML = isDate(myDate);
function isDate(myDate) {
    return myDate.constructor.toString().indexOf("Date") > -1;
}
</script>

</body>
</html>

인스턴스 실행»

"인스턴스 실행"을 클릭합니다. 버튼 온라인 예시 보기

JavaScript 유형 변환

JavaScript 변수는 새로운 변수나 다른 데이터 유형으로 변환될 수 있습니다.

  • JavaScript 함수를 사용하여

  • JavaScript 자체를 통한 자동 변환

숫자를 문자열로 변환

전역 메서드 String()으로 변환 가능 Convert 숫자를 문자열로.

이 방법은 모든 유형의 숫자, 문자, 변수, 표현식에 사용할 수 있습니다.

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>

<p> String() 方法可以将数字转换为字符串。</p>
<p id="demo"></p>
<script>
var x = 123;
document.getElementById("demo").innerHTML =
    String(x) + "<br>" +
    String(123) + "<br>" +
    String(100 + 23);
</script>
</body>
</html>

실행 인스턴스 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요

숫자 메서드 toString()도 동일한 효과를 갖습니다.

인스턴스

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>

<p>toString() 方法将数字转换为字符串。</p>
<p id="demo"></p>
<script>
var x = 123;
document.getElementById("demo").innerHTML =
    x.toString() + "<br>" +
   (123).toString() + "<br>" +
   (100 + 23).toString();
</script>

</body>
</html>

인스턴스 실행»

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요

숫자 방법 장에서 숫자를 문자열로 변환하는 더 많은 방법을 찾을 수 있습니다.

方法描述
toExponential()把对象的值转换为指数计数法。
toFixed()把数字转换为字符串，结果的小数点后有指定位数的数字。
toPrecision()把数字格式化为指定的长度。

부울 값을 문자열로 변환

전역 메서드 String()을 사용하면 부울 값을 문자열로 변환할 수 있습니다.

문자열(false)  // "false" 반환
문자열(true)  // 반환 "true"

부울 메서드 toString()도 동일한 효과를 갖습니다.

false.toString() // "false"를 반환합니다
true.toString() // "true"를 반환합니다


날짜를 문자열로 변환

전역 메서드 String()을 사용하면 날짜를 문자열로 변환할 수 있습니다.

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

날짜 방법toString( )도 같은 효과가 있습니다.

예

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

Date 메소드 장에서, 날짜를 문자열로 변환하는 더 많은 기능을 볼 수 있습니다:

方法描述
getDate()从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay()从 Date 对象返回一周中的某一天 (0 ~ 6)。
getFullYear()从 Date 对象以四位数字返回年份。
getHours()返回 Date 对象的小时 (0 ~ 23)。
getMilliseconds()返回 Date 对象的毫秒(0 ~ 999)。
getMinutes()返回 Date 对象的分钟 (0 ~ 59)。
getMonth()从 Date 对象返回月份 (0 ~ 11)。
getSeconds()返回 Date 对象的秒数 (0 ~ 59)。
getTime()返回 1970 年 1 月 1 日至今的毫秒数。


문자열을 숫자로 변환

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

숫자를 포함하는 문자열(예: "3.14")은 숫자(예: 3.14)로 변환됩니다.

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

다른 문자열은 NaN(숫자 아님)으로 변환됩니다.

숫자("3.14") // 3.14 반환
숫자(" ") // 0을 반환
숫자("") // 0을 반환
숫자("99 88") // NaN 반환

숫자 방법 장에서 문자열을 숫자로 변환하는 더 많은 방법을 볼 수 있습니다:

方法描述
parseFloat()解析一个字符串，并返回一个浮点数。
parseInt()解析一个字符串，并返回一个整数。

단항 연산자 +

연산자 + 를 사용하여 변수를 숫자로 변환할 수 있습니다:

인스턴스

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>

<p> typeof 操作符返回变量或表达式的类型。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction() {
    var y = "5";
    var x = + y;
    document.getElementById("demo").innerHTML =
		typeof y + "<br>" + typeof x;
}
</script>

</body>
</html>

인스턴스 실행»

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요

변수를 변환할 수 없는 경우에도 여전히 숫자여야 하지만 값은 NaN입니다. (숫자 아님):

인스턴스

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>

<p> typeof 操作符返回变量或表达式的类型。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction() {
    var y = "John";
    var x = + y;
    document.getElementById("demo").innerHTML =
		typeof x + "<br>" + x;
}
</script>

</body>
</html>

인스턴스 실행»

"인스턴스 실행" 버튼을 클릭하여 확인하세요. 온라인 인스턴스

부울 값을 숫자로 변환

전역 메서드 Number() 부울 값을 숫자로 변환합니다.

숫자(false) // 0을 반환
숫자(true) // 1을 반환


날짜를 숫자로 변환

전역 메서드 Number() 날짜를 숫자로 변환합니다.

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

날짜 방식 getTime()도 동일한 효과를 갖습니다.

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


자동 유형 변환

JavaScript가 "잘못된" 데이터 유형에 대해 작업을 시도하면 자동으로 "올바른" 데이터 유형으로 변환됩니다.

다음 출력은 예상한 것과 다릅니다.

5 + null // 5를 반환합니다. null은 0으로 변환됩니다
"5" + null // "5null"을 반환합니다. null은 "null"로 변환됩니다.
"5" + 1 // "51"을 반환합니다. 1이 "1"로 변환됨
"5" - 1 // 4 반환 "5"는 5로 변환됩니다


자동으로 문자열로 변환

객체나 변수를 출력하려고 하면 JavaScript가 자동으로 변수의 toString() 메서드를 호출합니다. 🎜>

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

// if myVar = {name:"Fjohn"} // toString 변환 For "[object Object]"
// if myVar = [1,2,3,4] // toString은 "1,2,3,4"로 변환됩니다
// if myVar = new Date() // toString은 "Fri Jul 18 2014 09:08:55 GMT+0200"
으로 변환됩니다. 숫자와 부울 값은 서로 변환되는 경우도 많습니다.

// if myVar = 123       // toString은 "123" "True"로 변환됩니다. <<>
// myvar = false인 경우 // tostring을 "false"로 변환
←
→