지역 사회
배우다
도구 라이브러리
AI 도구
여가
찾다
한국어

자바스크립트 유형 변환

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

JavaScript 데이터 유형

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

    object

    • function

  • 3개 객체 유형:

  • Object

  • Date

Array

  • 2개 데이터 유형:

  • null

  • 정의되지 않음

typeof 연산자

    • typeof 연산자를 사용하여 JavaScript 변수의 데이터 유형을 확인할 수 있습니다. 
  • <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>PHP中文网(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)의 데이터 유형은 object

데이터 유형은 날짜( Date) is object

    null의 데이터 유형은 object

    • 정의되지 않은 변수의 데이터 유형은 정의되지 않음

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

  • constructor 속성

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

    <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>PHP中文网(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>
    • 프로그램을 실행하고 시도해 보세요

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

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>PHP中文网(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>

프로그램을 실행하고 시도해 보세요. it

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

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>PHP中文网(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 유형 Conversion

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

JavaScript 자체에 의한 자동 변환

JavaScript 함수를 사용하여

숫자를 문자열로 변환

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

    이 메서드는 모든 유형의 숫자, 문자, 변수, 표현식에 사용할 수 있습니다.

    Instance 

    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文网(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>

    프로그램을 실행하여 사용해 보세요.

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

    Instance

    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文网(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>

    프로그램을 실행하고 사용해 보세요

    숫자를 문자열로 변환하는 방법:

    MethodDescription
    toExponential( ) 값을 변환합니다. 지수 계산 방법에 대한 객체입니다.
    toFixed()숫자를 문자열로 변환하며 결과는 소수점 이하 지정된 자릿수를 갖습니다.
    toPrecision()숫자 형식을 지정된 길이로 지정합니다.

    부울 값을 문자열로 변환

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

    String(false) // "false"를 반환
    String(true) // "true"를 반환

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

    false.toString() // "false"를 반환
    true.toString() // "true"를 반환

    날짜를 문자열로 변환

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

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

    Date 메소드 toString()도 동일한 효과를 갖습니다.

    Date().toString() // 2014년 7월 17일 목요일 15:38:19 GMT+0200(서부 유럽 일광 절약 시간)을 반환합니다.

    날짜를 문자열로 변환하는 함수:

    method 설명
    getDate()Date 객체에서 해당 월의 일자(1 ~ 31)를 반환합니다.
    getDay()Date 객체에서 요일(0~6)을 반환합니다.
    getFullYear()Date 객체에서 연도를 4자리 숫자로 반환합니다.
    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(숫자 아님)으로 변환됩니다.

    Number("3.14") // 3.14를 반환
    Number(" ") // 0
    Number("")를 반환 // 0
    Number("99 88")을 반환 // NaN

    문자열 메서드를 반환 숫자로 변환하려면:

    메서드 Description
    parseFloat()문자열을 구문 분석하고 부동 소수점 숫자를 반환합니다.
    parseInt()문자열을 구문 분석하고 정수를 반환합니다.

    단항 연산자 +

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

    Example

    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文网(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입니다(숫자가 아님):

    Instance 

    <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>PHP中文网(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>

    프로그램을 실행하여 시도해 보세요.

    부울 값을 숫자로 변환

    Global Number() 메서드는 부울 값을 숫자로 변환할 수 있습니다. ​​​​​​​​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은 "[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"으로 변환됩니다.
    // if myVar = true // toString은 "true"로 변환됩니다
    // if myVar = false // toString은 "false"로 변환됩니다


지속적인 학습
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>PHP中文网(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>
제출하다코드 재설정
이전 섹션 다음 섹션
튜토리얼 목록
도움을 받다
  • 코스 추천
  • 코스웨어 다운로드
현재 코스웨어를 다운로드할 수 없습니다. 현재 직원들이 정리하고 있습니다. 앞으로도 본 강좌에 많은 관심 부탁드립니다~

이 강좌를 시청한 학생들도 학습하고 있습니다.

최신 ThinkPHP 5.1 세계 최초 비디오 튜토리얼(PHP 전문가 온라인 교육 과정이 되기까지 60일)  493114회 재생