一、数值¶
定义：表示整数、浮点数以及特殊数值（如Infinity和NaN）
特点：
- 所有数字均以64位双精度浮点数存储
- 支持十进制、十六进制（
0xFF）、二进制（0b1010）和八进制（0o777）表示 - 包含特殊值：
Infinity（无穷大）、-Infinity、NaN（非数字）
示例展示：
// 基本示例
const age = 25; // 整数
const price = 99.95; // 浮点数
const hex = 0x2F; // 十六进制47
const scientific = 2.5e6; // 科学计数法2500000
// 特殊值
console.log(1 / 0); // Infinity
console.log(Math.sqrt(-1)); // NaN
具体操作：
1、创建一个名为css-study的文件夹并使用VSCode打开，再创建一个名为4-1.JavaScript常用数据类型-数值.html
二、字符串¶
定义：表示文本数据，由0个或多个16位Unicode字符组成
特点：
- 可用单引号（
''）、双引号（""）或反引号（``````）定义 - 支持转义字符（如
\n换行） - 模板字符串（反引号）支持多行文本和插值表达式（
${}）
示例展示：
const name = "Alice"; // 双引号
const msg = 'Hello\nWorld'; // 单引号+转义
const html = `
<div class="box">
${name}的年龄：${age}
</div>
`; // 模板字符串
// 常见操作
console.log(name.length); // 5（长度）
console.log(msg[0]); // "H"（索引访问）
三、布尔值¶
定义：表示逻辑真/假的两种状态
特点：
- 仅有两个值：
true和false - 常用于条件判断和逻辑运算
- 其他类型可通过
Boolean()转换为布尔值
示例展示：
const isAdult = age >= 18; // true
const hasError = false;
// 逻辑运算
console.log(true && false); // false（逻辑与）
console.log(true || false); // true（逻辑或）
console.log(!true); // false（逻辑非）
四、数组（Array）¶
定义：有序的元素集合，通过索引访问
特点：
- 可存储混合数据类型
- 动态长度，自动扩容
- 提供丰富的方法：
push()、map()、filter()等
示例展示：
const fruits = ["苹果", "香蕉", 3]; // 混合类型
const matrix = [[1,2], [3,4]]; // 多维数组
// 常用操作
fruits.push("橙子"); // 添加元素
console.log(fruits[0]); // "苹果"
console.log(fruits.length); // 4（当前长度）
五、对象（Object）¶
定义：键值对的集合，表示复杂实体
特点：
- 键（属性名）为字符串类型
- 值可以是任意数据类型
- 使用点符号（
.）或方括号（[]）访问属性
const user = {
name: "Bob",
age: 30,
isAdmin: true,
sayHi() {
console.log(`你好，我是${this.name}`);
}
};
// 属性操作
console.log(user.age); // 30
user.email = "bob@example.com"; // 添加属性
user.sayHi(); // 调用方法
六、undefined和null¶
undefined：
- 变量声明但未赋值时的默认值
- 函数无返回值时默认返回
undefined
null：
- 表示明确的"空值"
- 需显式赋值，常用于重置变量
let testVar; // undefined
console.log(testVar); // undefined
const empty = null; // 显式空值
const obj = { name: null }; // 属性设为空
// 类型区别
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object"（历史遗留）
undefined和null的区别：
- undefined是缺少值的默认状态，声明变量但是没有赋值
- null用来显示指定变量为空的状态，重置变量或者释放某个对象的引用
七、获取数据类型typeof¶
作用：返回变量或值的类型字符串
特点：
- 对原始类型有效，对数组/对象返回"object"
typeof null返回"object"（设计缺陷）- 精确判断需结合
Array.isArray()或instanceof
console.log(typeof 42); // "number"
console.log(typeof "text"); // "string"
console.log(typeof true); // "boolean"
console.log(typeof [1,2]); // "object"
console.log(typeof {a:1}); // "object"
console.log(typeof null); // "object"
console.log(typeof undefined); // "undefined"
// 精确判断
console.log(Array.isArray([])); // true
console.log(null === null); // true
八、综合使用¶
1、创建一个名为css-study的文件夹并使用VSCode打开，再创建一个名为4.JavaScript常用数据类型-综合使用.html
<!DOCTYPE html>
<html>
<script>
// 定义数值
let myNumber = 10;
const myFloat = 3.14;
// 定义字符串
let myString = "Hello World!"
// 定义布尔值
let isTrue = true
let isFalse = false
// 定义对象
let myInfo = {
name: "zq",
age: 18,
city: "beijing",
QQ: "12345678"
}
// 定义数组
let myArray = [ 1, 2, 3, 4]
// 定义undefined
let myUndefined;
isFalse = null
console.log(myUndefined, myArray)
// 打印数值类型
console.log("myNumber:", typeof(myNumber))
// 打印myUndefined类型
console.log("myUndefined:", typeof(myUndefined))
// js遗留问题,属于js的设计错误,返回object,实际属于null
console.log("isFalse null:", typeof(isFalse))
// 对象取值
console.log(myInfo.QQ)
console.log(myInfo["age"])
// 对象添加一个值
myInfo["phone"] = 11111111
console.log("myInfo:",myInfo)
// 删除一个对象的值
delete(myInfo.QQ)
// 数组取值,数组的下标是从开始的,取值的方法是数组名[下标]
console.log("数组的第一个值:",myArray[0])
console.log("数组的第二个值:",myArray[1])
// 数组末尾添加值
myArray.push("a","b","c")
// 数组开头添加值,遵循先进后出的原则
myArray.unshift("x")
myArray.unshift("y")
// 输出名为myArray的数组的值
console.log("myArray: ",myArray)
// 删除数据-从后面进行删除
myArray.pop()
// 删除数据-从前面进行删除
myArray.shift()
console.log("删除后的myArray:",myArray)
// 拼接数组
console.log("拼接: ",myArray.join("-"))
// 排序-正序
console.log("排序后(正序):",myArray.sort())
// 排序-倒序
console.log("排序后(倒序):",myArray.reverse())
</script>
</html>
2、双击【4.JavaScript常用数据类型-综合使用.html】后按F12，点击【控制台】可以展示相关输出内容信息
