JavaScript 类型(typeof)与转换
数据类型（typeof）
数据类型共包括字符串、数字、布尔以及对对象等多种类型，通常在JavaScript中可以使用typeof方法进行查看该值的类型，需要注意的时数组与对象的类型是一样的，都是“object”；
字符串 (string)
1
2
3
4
5
6
7
8
9
10
11
12
| <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = typeof "Hello,world";
</script>
</body>
</html>
|
数字 (number)
1
2
3
4
5
6
7
8
9
10
11
12
13
| <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = typeof 3.14;
</script>
</body>
</html>
|
布尔 (boolean)
1
2
3
4
5
6
7
8
9
10
11
12
| <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = typeof true;
</script>
</body>
</html>
|
数组 (object)
1
2
3
4
5
6
7
8
9
10
11
12
| <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = typeof ["one","two","three"];
</script>
</body>
</html>
|
对象 (object)
1
2
3
4
5
6
7
8
9
10
11
12
| <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = typeof {one:"one",two:"two",three:"three"};
</script>
</body>
</html>
|
对象(object)
1
2
3
4
5
6
7
8
9
10
11
12
| <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = typeof new Date();
</script>
</body>
</html>
|
功能 (function)
1
2
3
4
5
6
7
8
9
10
11
12
| <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = typeof function (data){};
</script>
</body>
</html>
|
未知 (unknown)
1
2
3
4
5
6
7
8
9
10
11
12
| <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = typeof unknown;
</script>
</body>
</html>
|
构造器函数（constructor）
构造器函数（constructor）与数据类型（typeof）的区别就是构造器函数可以检测该类型是否是数组还是对象。这在typeof之中是不可行的，因为在typeof之中数组与对象的类型都为“object”
字符串 (String)
1
2
3
4
5
6
7
8
9
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = "Hello,world".constructor;
</script>
</body>
</html>
|
数字 (Nbmber)
1
2
3
4
5
6
7
8
9
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = 3.14.constructor;
</script>
</body>
</html>
|
布尔 (Boolean)
1
2
3
4
5
6
7
8
9
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = true.constructor;
</script>
</body>
</html>
|
数组 (Array)
1
2
3
4
5
6
7
8
9
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = ["one","twu","three"].constructor;
</script>
</body>
</html>
|
对象 (Object)
1
2
3
4
5
6
7
8
9
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = {one:"one",two:"twu",three:"three"}.constructor;
</script>
</body>
</html>
|
自建对象 （Date)
1
2
3
4
5
6
7
8
9
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = new Date().constructor;
</script>
</body>
</html>
|
功能 (Function)
1
2
3
4
5
6
7
8
9
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
document.getElementById("data").innerHTML = function (Date){}.constructor;
</script>
</body>
</html>
|
判断是否为数值 (Constructor）
第一种写法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
var array = ["one","two","three"];
document.getElementById("data").innerHTML = isArray(array);
function isArray(myArray) {
return myArray.constructor.toString().indexOf("Array") > -1;
}
</script>
</body>
</html>
|
或
第二种写法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
var array = ["one","two","three"];
document.getElementById("data").innerHTML = isArray(array);
function isArray(myArray) {
return myArray.constructor == Array;
}
</script>
</body>
</html>
|
类型转换
数值
数值转字符串 String()
1
2
3
4
5
6
7
8
9
10
| <!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x = 123;
document.getElementById("demo").innerHTML = String(x);
</script>
</body>
</html>
|
数值转字符串方法（toString）
1
2
3
4
5
6
7
8
9
10
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
var a = 123;
document.getElementById("data").innerHTML = a.toString();
</script>
</body>
</html>
|
布尔
布尔转字符串 String()
1
2
3
4
5
6
7
8
9
10
| <!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x = true;
document.getElementById("demo").innerHTML = String(x);
</script>
</body>
</html>
|
布尔转字符串 （toString)
1
2
3
4
5
6
7
8
9
10
| <!DOCTYPE html>
<html>
<body>
<p id="data"></p>
<script>
var a = true;
document.getElementById("data").innerHTML = a.toString();
</script>
</body>
</html>
|
数值
字符串转数值 Number
1
2
3
4
5
6
7
8
9
10
| <!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x = "1";
document.getElementById("demo").innerHTML = Number(x);
</script>
</body>
</html>
|
布尔转数值 Number
1
2
3
4
5
6
7
8
9
10
| <!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x = true;
document.getElementById("demo").innerHTML = Number(x);
</script>
</body>
</html>
|
| ID |
DA |
FA |
| typeof |
查看数据类型 |
数据类型 |
| constructor |
查看构造器函数 |
|
|
|
|
| String() |
转换为字符串 |
数据转换 |
| toString() |
转换为字符串 |
|
|
|
|
| Number |
转换为数值 |
|
⬅️ Go back
