JavaScript学习总结（四）_html-js-css

JavaScript学习总结（四）

自去年6月份放假以后，一直没有再接触JavaScript，忙着考研初试、复试、打寒假工、写毕业设计，一直不停地搁置了，研究生生活也过了一个学期了，又开始把JavaScript捡起来，希望能有所长进吧。

今天从JavaScript的类型转换开始学习！

类型转换，指的是将“一种数据类型”转换为“另外一种数据类型”。在JavaScript中，共有2种类型转换。

（1）隐式类型转换（2）显式类型转换

隐式类型转换，指的是JavaScript自动进行的类型转换。显式类型转换，指的是需要我们手动用代码强制进行的类型转换。这两种方式，我们从名字上就能区分开来

一、“字符串”转换为“数字”

在JavaScript中，想要将字符串转换为数字，可以有2种方式。

（1）Number()（2）parseInt()和parseFloat()

Number()方法可以将任何“数字型字符串”转换为数字。那什么是数字型字符串呢？像"123"、“3.1415”，这些只有数字的字符串就是数字型字符串，而"hao123"、"100px"等就不是。

准确来说，parseInt()和parseFloat是提取“首字母为数字的任意字符串”中的数字，其中，parseInt()提取的是整数部分，parseFloat()不仅会提取整数部分，还会提取小数部分。

举例：

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        document.write("Number('123')：" + Number("123") + "
");
        document.write("Number('3.1415')：" + Number("3.1415") + "
");
        document.write("Number('hao123')：" + Number("hao123") + "
");
        document.write("Number('100px')：" + Number("100px"));
    </script>
</head>
<body>
</body>
</html>

浏览器预览效果如图所示：

分析：

NaN指的是“Not a Number（非数字）”，从中可以看出，Number()方法只能将纯“数字型字符串”转换为数字，不能将其他字符串（即使字符串内有数字字符）转换为数字。在实际开发中，很多时候我们需要提取类似"100px"中的数字，要怎么做呢？这个时候就应该使用parseInt()和parseFloat()，而不是Number()了。

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        document.write("parseInt('123')：" + parseInt("123") + "
");
        document.write("parseInt('3.1415')：" + parseInt("3.1415") + "
");
        document.write("parseInt('hao123')：" + parseInt("hao123") + "
");
        document.write("parseInt('100px')：" + parseInt("100px")+ "
");
        document.write("parseInt('+123')：" + parseInt("+123") + "
");
        document.write("parseInt('-123')：" + parseInt("-123"));
    </script>
</head>
<body>
</body>
</html>

parseInt()会从左到右进行判断，如果第1个字符是数字，则继续判断，直到出现非数字为止（小数点也是非数字）；如果第1个字符是非数字，则直接返回NaN。但是第1个字符是加号（+）或减号（-），也就是非数字，parseInt()同样也是可以转换的。因为加号和减号在数学上其实就是表示一个数的正和负，所以parseInt()可以接受第1个字符是加号或减号。同样的，parseFloat()也有这个特点。

分析：

parseFloat()跟parseInt()非常类似，都是从第1个字符从左到右开始判断。如果第1个字符是数字，则继续判断，直到出现除了数字和小数点之外的字符为止；如果第1个字符是非数字，则直接返回NaN。在“首字母是+、-或数字的字符串”中，不管是整数部分，还是小数部分，parseFloat()同样可以转换，这一点跟parseInt()是不一样的。

二、“数字”转换为“字符串”

在JavaScript中，想要将数字转换为字符串，也有2种方式。

（1）与空字符串相加（2）toString()

举例:

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        var a = 2018;
        var b = 2018 + "";
        var c = a + 1000;
        document.write(c+"\
");
        var d = a.toString() + 1000;
        document.write(d);
    </script>
</head>
<body>
</body>
</html>

分析：

数字加上字符串，系统会将数字转换成字符串。如果想要将一个数字转换为字符串，而又不增加多余的字符，我们可以将这个数字加上一个空字符串。

a.toString()表示将a转换为字符串，也就是2018转换为"2018"，因此最终b的值为"20181000"。

在实际开发中，如果想要将数字转换为字符串来用，我们很少使用toString()方法，而更多使用隐式类型转换的方式（也就是直接跟一个字符串相加）就行了。

三、转义字符

所谓的转义字符，指的是在默认情况下某些字符在浏览器是无法显示的，不过为了能够让这些字符能够显示出来，我们可以使用这些字符对应的转义字符来代替。在JavaScript中，常见的转义字符如表所示。

实际上，JavaScript中的转义字符很多，但是我们只需要记住上面3种就可以了。此外还需要特别说明一下，对于字符串的换行，有以下2种情况。

（1）如果是在document.write()中换行，则应该用：

（2）如果是在alert()中换行，则应该用：\n

\n是转义字符，一般用于对话框文本的换行。这里如果用就无法实现了，而document.write()是在网页上添加内容，相当于HTML的一种语句，使用就可以实现换行

果是在alert()中换行，则应该用：\n**

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/939991.html

JavaScript学习总结（四）

发表评论

评论列表（0条）