文章目录
- 一.基础内置对象(最常用)
- 二.其他常用内置对象
-
- 1.Boolean:布尔值相关
- 2.Object:所有对象的原型
- [3.JSON:JSON 数据处理](#3.JSON:JSON 数据处理)
- 4.RegExp:正则表达式
- 三.内置对象使用注意事项
- 四.总结
JavaScript 内置对象(内部对象)是 JS 引擎预定义的、可直接使用的对象,提供了核心功能支持(如 数据处理、 日期操作、 数学计算等).它们无需手动创建,直接通过 「对象名.方法 / 属性」调用
一.基础内置对象(最常用)
1.Number:数字相关操作
用于处理数字类型(整数、浮点数),提供常量和工具方法(注意:需通过 Number.方法() 调用,或 num.方法() 调用实例方法).
核心属性 / 方法:
| 类型 | 名称 | 说明 | 示例 |
|---|---|---|---|
| 常量 | Number.MAX_VALUE |
最大安全整数(≈1.79e+308) |
console.log(Number.MAX_VALUE) |
| 常量 | Number.MIN_VALUE |
最小安全正数(≈5e-324) |
console.log(Number.MIN_VALUE) |
| 常量 | Number.NaN |
非数字(Not a Number) |
Number('abc') → NaN |
| 方法 | Number.isNaN(x) |
判断 x 是否为 NaN(比全局 isNaN 准确) |
Number.isNaN(NaN) → true; Number.isNaN('NaN') → false |
| 方法 | Number.isInteger(x) |
判断 x 是否为整数 |
Number.isInteger(5) → true; Number.isInteger(5.0) → true; Number.isInteger(5.1) → false |
| 方法 | num.toFixed(n) |
保留 n 位小数(返回字符串) |
(3.1415).toFixed(2) → "3.14" |
| 方法 | num.toString(radix) |
转为 radix 进制字符串(2-36 进制) |
(10).toString(2) → "1010"(二进制) |
示例:
javascript
// 数字验证
console.log(Number.isInteger(100)); // true
console.log(Number.isNaN(5 + 'a')); // true(5+'a' 结果为 NaN)
// 格式化数字
const pi = 3.1415926;
console.log(pi.toFixed(3)); // "3.142"(四舍五入)
console.log((16).toString(16)); // "10"(十六进制)
2.String:字符串操作
处理字符串类型,提供字符串拼接、截取、查找等核心方法(字符串实例直接调用).
高频方法:
| 方法名 | 说明 | 示例 |
|---|---|---|
str.length |
获取字符串长度 | "abc".length → 3 |
str.charAt(index) |
获取索引 index 对应的字符 |
"hello".charAt(1) → "e" |
str.slice(start, end) |
截取字符串([start, end),支持负数) |
"abcdef".slice(1,4) → "bcd"; "abcdef".slice(-3) → "def" |
str.indexOf(substr) |
查找子串位置(找不到返回 -1) |
"hello world".indexOf("world") → 6 |
str.replace(old, new) |
替换子串(默认只替换第一个) | "aaa".replace("a", "b") → "baa"; "aaa".replace(/a/g, "b") → "bbb"(正则全局替换) |
str.split(sep) |
按分隔符分割为数组 | "a,b,c".split(",") → ["a","b","c"] |
str.trim() |
去除首尾空白字符(空格、换行、制表符) | " hello ".trim() → "hello" |
str.toUpperCase() |
转为大写 | "hello".toUpperCase() → "HELLO" |
示例:
字符串格式化与验证
javascript
const username = ' Alice123 ';
// 去除空格 + 验证长度
const cleanName = username.trim();
console.log(cleanName); // "Alice123"
console.log(cleanName.length >= 6 && cleanName.length <= 12); // true(验证用户名长度)
// 替换敏感字符
const content = 'Hello JavaScript!';
console.log(content.replace('JavaScript', 'JS')); // "Hello JS!"
3.Array:数组操作
JS 数组是动态集合(可存任意类型数据),内置大量方法用于增删改查、遍历、排序等,是开发中最常用的对象之一.
核心方法分类:
| 功能 | 方法名 | 说明 | 示例 |
|---|---|---|---|
| 增删元素 | arr.push(...items) |
尾部添加元素(返回新长度) | [1,2].push(3) → [1,2,3] |
| 增删元素 | arr.pop() |
尾部删除元素(返回删除值) | [1,2,3].pop() → 3 |
| 增删元素 | arr.unshift(...items) |
头部添加元素(返回新长度) | [2,3].unshift(1) → [1,2,3] |
| 增删元素 | arr.shift() |
头部删除元素(返回删除值) | [1,2,3].shift() → 1 |
| 截取 / 拼接 | arr.slice(start, end) |
截取子数组(不修改原数组) | [1,2,3,4].slice(1,3) → [2,3] |
| 截取 / 拼接 | arr.concat(arr2) |
拼接数组(不修改原数组) | [1,2].concat([3,4]) → [1,2,3,4] |
| 遍历 / 转换 | arr.map(fn) |
遍历并转换元素(返回新数组) | [1,2,3].map(x => x * 2) → [2,4,6] |
| 遍历 / 转换 | arr.filter(fn) |
过滤元素(返回满足条件的新数组) | [1,2,3,4].filter(x => x % 2 === 0) → [2,4] |
| 遍历 / 转换 | arr.reduce(fn, init) |
累积计算(返回最终结果) | [1,2,3].reduce((sum, x) => sum+x, 0) → 6 |
| 排序 | arr.sort((a,b) => a-b) |
排序(默认按字符串排序,需传比较函数) | [3,1,2].sort((a,b) => a-b) → [1,2,3] |
| 查找 | arr.find(fn) |
查找第一个满足条件的元素 | [1,2,3].find(x => x>2) → 3 |
示例:
数组数据处理
javascript
const users = [
{ name: 'Alice', age: 25 },
{ name: 'Bob', age: 18 },
{ name: 'Charlie', age: 30 }
];
// 1. 筛选成年用户(age≥18)
const adults = users.filter((user) => user.age >= 18);
console.log(adults); // 所有用户(均≥18)
// 2. 提取所有用户名
const names = users.map((user) => user.name);
console.log(names); // ["Alice", "Bob", "Charlie"]
// 3. 计算平均年龄
const totalAge = users.reduce((sum, user) => sum + user.age, 0);
const avgAge = totalAge / users.length;
console.log(avgAge); // 24.333...
4.Date:日期与时间
用于获取、处理日期和时间(如当前时间、日期格式化、时间差计算).
核心用法:
- 创建
Date对象:
javascript
const now = new Date(); // 当前时间
const date1 = new Date('2025-12-01'); // 指定日期(ISO格式)
const date2 = new Date(2025, 11, 1); // 年(4位)、月(0-11)、日(月从0开始!)
- 获取日期 / 时间组件(返回数字):
| 方法名 | 说明 | 示例(now 为 2025-12-01 10:30:00) |
|---|---|---|
getFullYear() |
年(4 位) | now.getFullYear() → 2025 |
getMonth() |
月(0-11)→ 需 + 1 |
now.getMonth() + 1 → 12 |
getDate() |
日(1-31) | now.getDate() → 1 |
getHours() |
时(0-23) | now.getHours() → 10 |
getMinutes() |
分(0-59) | now.getMinutes() → 30 |
getTime() |
时间戳(毫秒数,从 1970-01-01 开始) | now.getTime() → 1754053800000 |
- 日期格式化(自定义格式):
javascript
function formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 补0为两位数
const day = String(date.getDate()).padStart(2, '0');
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}`;
}
const now = new Date();
console.log(formatDate(now)); // 输出 "2025-12-01 10:30"
- 计算时间差:
javascript
const start = new Date('2025-01-01');
const end = new Date('2025-12-31');
const diffMs = end.getTime() - start.getTime(); // 时间差(毫秒)
const diffDays = Math.floor(diffMs / (1000 * 60 * 60 * 24)); // 转为天数
console.log(diffDays); // 364(2025年不是闰年)
5.Math:数学计算
提供常量(如 π)和数学函数(如三角函数、对数、随机数),所有方法都是静态的,需通过 Math.方法() 调用.
高频属性 / 方法:
| 类型 | 名称 | 说明 | 示例 |
|---|---|---|---|
| 常量 | Math.PI |
圆周率 π(≈3.14159...) | Math.PI → 3.141592653589793 |
| 常量 | Math.E |
自然常数 e(≈2.718...) | Math.E → 2.718281828459045 |
| 方法 | Math.abs(x) |
绝对值 | Math.abs(-5) → 5 |
| 方法 | Math.floor(x) |
向下取整(地板函数) | Math.floor(3.9) → 3 |
| 方法 | Math.ceil(x) |
向上取整(天花板函数) | Math.ceil(3.1) → 4 |
| 方法 | Math.round(x) |
四舍五入取整 | Math.round(3.5) → 4; Math.round(3.4) → 3 |
| 方法 | Math.max(...nums) |
求最大值 | Math.max(1,3,5) → 5 |
| 方法 | Math.min(...nums) |
求最小值 | Math.min(1,3,5) → 1 |
| 方法 | Math.random() |
生成 [0,1) 之间的随机浮点数 |
Math.random() → 0.123... |
| 方法 | Math.pow(base, exp) |
求 base 的 exp 次方(base ^ exp) |
Math.pow(2,3) → 8 (2³=8) |
| 方法 | Math.sqrt(x) |
求平方根 | Math.sqrt(16) → 4 |
示例:
实用场景
javascript
// 1. 生成 [1, 100] 之间的随机整数
const randomInt = Math.floor(Math.random() * 100) + 1;
console.log(randomInt); // 1-100 随机数
// 2. 计算圆的面积(半径 r=5)
const r = 5;
const area = Math.PI * Math.pow(r, 2);
console.log(area.toFixed(2)); // 78.54(π×5²≈78.54)
// 3. 取数组最大值
const scores = [85, 92, 78, 95];
const maxScore = Math.max(...scores); // 展开数组
console.log(maxScore); // 95
二.其他常用内置对象
1.Boolean:布尔值相关
用于处理布尔类型(true/false),但日常开发中直接使用字面量(true/false)即可,无需手动创建 Boolean 实例.
核心方法:
Boolean(value):将值转为布尔类型(等价于!!value);falsy值(转为false):0、""、null、undefined、NaN、false;truthy值(转为true):非falsy的所有值(如 1、"hello"、[]、{}).
示例:
javascript
console.log(Boolean(0)); // false
console.log(Boolean('')); // false
console.log(Boolean([])); // true(空数组是 truthy)
console.log(Boolean({})); // true(空对象是 truthy)
2.Object:所有对象的原型
Object 是 JS 中所有对象的顶层原型(除了 null),提供了通用的对象操作方法(如创建对象、遍历属性、判断类型等).
高频静态方法:
| 方法名 | 说明 | 示例 |
|---|---|---|
Object.keys |
(obj) 获取对象自身的所有可枚举属性名(数组) | Object.keys({a:1, b:2}) → ["a","b"] |
Object.values(obj) |
获取对象自身的所有可枚举属性值(数组) | Object.values({a:1, b:2}) → [1,2] |
Object.entries |
(obj) 获取对象自身的属性名 - 值对(二维数组) | Object.entries({a:1}) → [["a",1]] |
Object.assign(target, ...sources) |
合并对象(浅拷贝) | Object.assign({a:1}, {b:2}) → {a:1, b:2} |
Object.prototype.hasOwnProperty(key) |
判断对象自身是否有该属性(跳过原型链) | const obj={a:1}; obj.hasOwnProperty("a") → true; obj.hasOwnProperty("toString") → false (toString 是原型方法) |
示例:
对象遍历与合并
javascript
const user = { name: 'Alice', age: 25 };
// 1. 遍历对象属性
Object.keys(user).forEach((key) => {
console.log(`${key}: ${user[key]}`); // name: Alice;age:25
});
// 2. 合并对象(浅拷贝)
const userWithHobby = Object.assign({}, user, { hobby: 'coding' });
console.log(userWithHobby); // { name: "Alice", age:25, hobby: "coding" }
3.JSON:JSON 数据处理
用于 JSON 字符串与 JS 对象的相互转换(前后端数据传输常用).
核心方法:
JSON.stringify(obj):将 JS 对象转为JSON字符串(注意:函数、undefined、Symbol会被忽略);JSON.parse(str):将JSON字符串转为JS对象(注意:字符串必须是合法JSON格式,否则报错).
示例:
javascript
// JS 对象 → JSON 字符串
const user = { name: 'Bob', age: 20, isStudent: true };
const jsonStr = JSON.stringify(user);
console.log(jsonStr); // '{"name":"Bob","age":20,"isStudent":true}'
// JSON 字符串 → JS 对象
const jsonStr2 = '{"name":"Charlie","age":30}';
const user2 = JSON.parse(jsonStr2);
console.log(user2.name); // "Charlie"
4.RegExp:正则表达式
用于字符串匹配、查找、替换等复杂操作(如验证手机号、邮箱格式).
核心用法:
- 创建正则对象:
javascript
const reg1 = /^\d{11}$/; // 字面量形式(推荐,无需转义双重反斜杠)
const reg2 = new RegExp('^\\d{11}$'); // 构造函数形式(需转义反斜杠)
- 常用方法:
reg.test(str):判断字符串是否匹配正则(返回true/false);str.match(reg):查找字符串中匹配的内容(返回数组或null).
示例:
格式验证
javascript
// 验证手机号(11 位数字)
const phoneReg = /^\d{11}$/;
console.log(phoneReg.test('13800138000')); // true
console.log(phoneReg.test('123456')); // false
// 验证邮箱(简单规则)
const emailReg = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
console.log(emailReg.test('test@example.com')); // true
console.log(emailReg.test('test@.com')); // false
三.内置对象使用注意事项
静态方法vs实例方法:
静态方法:通过「对象名.方法」调用(如Math.max()、Number.isInteger());
实例方法:通过「实例.方法」调用(如str.trim()、num.toFixed()).- 类型转换陷阱:
Number("")→ 0,Number(" ")→ 0(空字符串 / 空格字符串转数字为 0);
Math.random()生成的是[0,1)区间, 需加 1 才能包含 1
(如Math.floor(Math.random()*5)+1生成 1-5);
Date.getMonth()返回 0-11,需 +1 才是实际月份. 浅拷贝vs深拷贝:
Object.assign()、数组slice()/concat()都是浅拷贝,
嵌套对象/数组仍会引用原数据;
深拷贝需用递归(如之前讲的deepClone)或JSON.parse(JSON.stringify())注意:会忽略函数、undefined.- 正则表达式的贪婪匹配:
正则默认贪婪匹配(尽可能多匹配),如需非贪婪,加 ?(如 /.+?/).
四.总结
JS 内置对象是开发的「工具库」,核心常用的是:
数据处理 :Number、String、Array、Math;
时间处理 :Date;
对象 / JSON 操作 :Object、JSON;
字符串匹配 :RegExp.