一、typeof、null和undefined
1、typeof操作符
使用typeof操作符来检测变量的数据类型。
实例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript基础知识学习</title>
</head>
<body>
<p> typeof 操作符返回变量或表达式的类型。</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof null + "<br>" +
typeof NaN + "<br>" +
typeof undefined + "<br>" +
typeof "john" + "<br>" +
typeof 3.14 + "<br>" +
typeof false + "<br>" +
typeof [1, 2, 3, 4] + "<br>" +
typeof {
name: 'john',
age: 34
};
</script>
</body>
</html>输出结果：
注意：
- 在JavaScript中，数组是一种特殊的对象类型，因此typeof []返回object。
- typeof null会返回“object”，这是一个历史遗留问题，实际上null是一个空或不存在的值，不是一个对象。
- typeof NaN会返回“number”，这是因为NaN是一个特殊的数值类型，表示Not a Number（不是一个数字）。
2、null
在JavaScript中，null表示“什么都没有”。
null是一个特殊类型，表示一个空对象引用。
var person = null; // 值为 null(空), 但类型为对象
3、undefined
在 JavaScript 中, undefined 是一个没有设置值的变量。
typeof 一个没有值的变量会返回 undefined。
var person; // 值为 undefined(空), 类型是undefined
var person = undefined; // 值为 undefined, 类型是undefined
任何变量都可以通过设置值为 undefined 来清空。
4、undefined 和 null 的区别
实例：
<body>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof undefined + "<br>" +
typeof null + "<br>" +
(null === undefined) + "<br>" +
(null == undefined);
</script>
</body>输出结果：
备注：null 和 undefined 的值相等，但类型不等。
二、JavaScript类型转换
1、数据类型
在JavaScript中有6种不同的数据类型：
- string
- number
- boolean
- object
- function
- symbol
3种对象类型：
- Object
- Date
- Array
2个不包含任何值的数据类型：
- null
- undefined
示例：可以使用typeof操作符来查看JavaScript变量的数据类型
注意：
- NaN的数据类型是number
- 数组（Array）的数组类型是object
- 日期（Date）的数据类型是object
- null的数据类型是object
- 未定义变量的数据类型为undefined
2、数据类型转换
1）、将数字转化为字符串
全局方法String()可以将数字转化为字符串。
该方法可用于任何类型的数字、字母、变量、表达式：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript数据类型转换</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) + "<br>" +
"Number的toString()方法也能达到相同的效果：" + "<br>" +
x.toString() + "<br>" +
(123).toString() + "<br>" +
(100 + 23).toString();
</script>
</body>
</html>运行结果：
当然，Number的toString()方法也能达到相同的效果。
我们也有其它方法将数字转化为字符串的方法：
| 方法 | 描述 |
| toExponential() | 把对象的值转化为指数计数法。 |
| toFixed() | 把数字转化为字符串，结果的小数点后有指定位数的数字。 |
| toPrecision() | 把数字格式化为指定的长度。 |
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript数据类型转换</title>
</head>
<body>
<p> 更多将数字转化为字符串的方法。</p>
<p id="demo"></p>
<script>
var value = 2.13456;
document.getElementById("demo").innerHTML =
value.toExponential() + "<br>" +
value.toExponential(2) + "<br>" +
value.toPrecision() + "<br>" +
value.toPrecision(2) + "<br>" +
value.toFixed() + "<br>" +
value.toFixed(2);
</script>
</body>
</html>运行结果：
2）、将布尔值转换为字符串
全局方法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() 也有相同的效果：
obj = new Date()
obj.toString() // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript数据类型转换</title>
</head>
<body>
<p> 将日期转换为字符串。</p>
<p id="demo"></p>
<script>
var value = 2.13456;
var date = new Date();
document.getElementById("demo").innerHTML =
Date() + "<br>" +
String(new Date()) + "<br>" +
date.getDate() + "<br>" +
date.getDay() + "<br>" +
date.getFullYear() + "<br>" +
date.getHours() + "<br>" +
date.getMilliseconds() + "<br>" +
date.getMinutes() + "<br>" +
date.getMonth() + "<br>" +
date.getSeconds() + "<br>" +
date.getTime() + "<br>" +
date.toString();
</script>
</body>
</html>运行结果：
4、将字符串转换为数字
全局方法 Number() 可以将字符串转换为数字。
字符串包含数字(如 "3.14") 转换为数字 (如 3.14).
空字符串转换为 0。
其他的字符串会转换为 NaN (不是个数字)。
Number("3.14") // 返回 3.14
Number(" ") // 返回 0
Number("") // 返回 0
Number("99 88") // 返回 NaN
更多将数字转化为字符串的方法
5、将布尔值转换为数字
全局使用Number()方法可将布尔值转换为数字
Number(false) //返回 0
Number(true) //返回 1
6、将日期转换为数字
全局使用Number()方法可将日期转换为数字
var date = new Date();
Number(date ) //返回 1702517251327
日期有getTime()方法也有相同的效果。
var date = new Date();
date .getTime() //返回 1702517251327
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript数据类型转换</title>
</head>
<body>
<p> 将日期转换为数字。</p>
<p id="demo"></p>
<script>
var value = 2.13456;
var date = new Date();
document.getElementById("demo").innerHTML =
Number(date) + "<br>" +
date.getTime() + "<br>" +
date.toString();
</script>
</body>
</html>运行结果：
7、自动转换类型
当JavaScript尝试操作一个“错误”的数据类型时，会自动转换为“正确”的数据类型。
比如：
5 + null // 返回 5 null 转换为 0
"5" + null // 返回"5null" null 转换为 "null"
"5" + 1 // 返回 "51" 1 转换为 "1"
"5" - 1 // 返回 4 "5" 转换为 5
三、JavaScript正则表达式
1、什么是正则表达式
正则表达式是由一个字符序列形成的搜索模式。
当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容。
正则表达式可以是一个简单的字符，或一个更复杂的模式。
正则表达式可用于所有文本搜索和文本替换的操作。
2、语法
/正则表达式主体/修饰符(可选)
实例解析：
var patt = /runoob/i
/runoob/i 是一个正则表达式。
runoob 是一个正则表达式主体 (用于检索)。
i 是一个修饰符 (搜索不区分大小写)。
3、使用字符串方法
1）、search()方法使用字符串
实例：检索字符串中子串
var str = "Visit Runoob!";
var n = str.search("Runoob");
2）、replace()方法使用字符串
实例：使用正则表达式不区分大小写将字符串microsoft替换为Runoob
var str = document.getElementById("demo").innerHTML;
var txt = str.replace(/microsoft/i,"Runoob");
当然，也有其它方法实现字符串内容替换
var str = document.getElementById("demo").innerHTML;
var txt = str.replace("Microsoft","Runoob");
正则表达式整体示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript数据类型转换</title>
</head>
<body>
<p> 将日期转换为数字。</p>
<p id="demo"></p>
<script>
var date = new Date();
var str = "Visit Runoob!";
var strReplace = "Visit Microsoft!";
var str2 = "Visit Microsoft!";
document.getElementById("demo").innerHTML =
"搜索字符串 Runoob, 并显示匹配的起始位置:" + "<br>" +
str.search("Runoob") + "<br>" +
"使用正则表达式将 Microsoft替换为Runoob" + "<br>" +
strReplace.replace(/microsoft/i, "Runoob") + "<br>" +
"不使用正则表达式将 Microsoft替换为Job" + "<br>" +
str2.replace("Microsoft", "Job") + "<br>" +
date.toString();
</script>
</body>
</html>运行结果：
