夜光带你走进JavaScript（二十二）擅长的领域

最新推荐文章于 2019-12-01 20:35:23 发布

GeniusTeam-夜光

最新推荐文章于 2019-12-01 20:35:23 发布

阅读量259

点赞数

分类专栏： Genius-JavaScript

本文链接：https://blog.csdn.net/weixin_41987706/article/details/102580889

版权

Genius-JavaScript 专栏收录该内容

59 篇文章 2 订阅

订阅专栏

夜光序言：

我一生中最幸运的两件事：

一件是时间终于将我对你的爱消耗殆尽;

一件是很久很久以前有一天，我遇见你。

正文：

JavaScript 类型转换

JavaScript 变量可以转换为新变量或其他数据类型：

通过使用 JavaScript 函数
通过 JavaScript 自身自动转换

将数字转换为字符串

全局方法 String() 可以将数字转换为字符串。

该方法可用于任何类型的数字，字母，变量，表达式：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>夜光</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() 也是有同样的效果。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>夜光</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>

将布尔值转换为字符串

全局方法 String() 可以将布尔值转换为字符串。

String(false) // 返回 "false"
String(true) // 返回 "true"

Boolean 方法 toString() 也有相同的效果。

false.toString() // 返回 "false"
true.toString() // 返回 "true"

将日期转换为字符串

Date() 返回字符串。

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

全局方法 String() 可以将日期对象转换为字符串。

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

Date 方法 toString() 也有相同的效果。

更多关于日期转换为字符串的函数：

方法	描述
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 (不是个数字)。

Number("3.14")    // 返回 3.14
Number(" ")       // 返回 0
Number("")        // 返回 0
Number("99 88")   // 返回 NaN

更多关于字符串转为数字的方法：

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

嗯唔，帅气~~ 一元运算符 +

Operator + 可用于将变量转换为数字：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>夜光</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>夜光</title>
</head>
<body>

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

</body>
</html>

嗯唔~~ 将布尔值转换为数字

全局方法 Number() 可将布尔值转换为数字。

Number(false) // 返回 0
Number(true) // 返回 1

将日期转换为数字

全局方法 Number() 可将日期转换为数字。

d = new Date();
Number(d) // 返回 1404568027739

日期方法 getTime() 也有相同的效果。

d = new Date();
d.getTime() // 返回 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;

myVar = {name:"Genius"} // toString 转换为 "[object Object]"
myVar = [1,2,3,4] // toString 转换为 "1,2,3,4"
myVar = new Date() // toString 转换为 "Fri Jul 18 2019 09:08:55 GMT+0200"

数字和布尔值也经常相互转换：

myVar = 123             // toString 转换为 "123"
myVar = true            // toString 转换为 "true"
myVar = false           // toString 转换为 "false"

重点概念 → undefined 与 null 的区别：

表面上 undefined 与 null 都是什么都没有的意思

但是实际上 undefined 是未定义（就是变量没有初始化），null 是一个变量初始化了，但是什么值都没给，只给了一个空对象；进一步说，undefined 与 null是值相等，类型不相等。

NaN 是一个特殊的数值，NaN 即非数值（Not a Number），这个数值用于本来要返回数值的操作数未返回数值的情况。

NaN 与任何值都不相等，包括 NaN 本身。

可以通过 isNaN() 方法来判断某个数值是否是NaN这个特殊的数，使用 isNaN() 方法会将传入的数值如果是非数值的会将其自动转换成数值类型，若能转换成数值类型，那么这个函数返回 false，若不能转换成数值类型，则这个数就是 NaN，即返回 true。

GeniusTeam-夜光

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
夜光带你走进JavaScript（二十二）擅长的领域

夜光序言：我一生中最幸运的两件事：一件是时间终于将我对你的爱消耗殆尽;一件是很久很久以前有一天，我遇见你。正文：JavaScript 类型转换JavaScript 变量可以转换为新变量或其他数据类型：通过使用 JavaScript 函数通过 JavaScript 自身自动转换将数字转换为字符串全局方法 ...
复制链接

扫一扫

专栏目录