JS内置对象完全指南：Math、Date、包装类与字符串方法详解-北京尧图网络

$JS内置对象完全指南：Math、Date、包装类与字符串方法详解$

前言本文是JavaScript基础系列的第九篇系统讲解JS中常用的内置对象。内容包括Math对象数学运算、Date对象日期时间、包装类基本类型与对象的转换机制以及字符串的常用方法。掌握这些内容你就能熟练运用JS自带的工具集高效开发。一、内置对象概述1.1 什么是内置对象JS中的对象分为三种对象类型说明示例自定义对象开发者自己创建的对象{ name: jack }内置对象JS语言自带的对象Math、Date、Array、String等浏览器对象浏览器提供的对象不属于ECMAScriptwindow、document、location内置对象就是指JS语言自带的一些对象这些对象供开发者使用并提供一些常用的或是最基本而必要的功能属性和方法。程序员不用管具体怎么实现直接使用就可以了帮助我们快速开发。1.2 常用内置对象Object、Function、Array、Math、Date、String、Boolean、Number、RegExp1.3 查阅文档的方法MDN文档是最好的学习资源MDN JavaScript 参考查阅文档三步走查看该方法的功能查看里面参数的意义和类型查看返回值的意义和类型通过demo进行测试二、Math对象2.1 基本概念Math是一个工具类不是构造函数无需创建对象实例直接使用其封装好的数学运算属性和方法2.2 常用属性和方法属性Math.PI; // 圆周率 ≈ 3.14159方法方法说明示例结果Math.abs(x)计算绝对值Math.abs(-5)5Math.ceil(x)向上取整Math.ceil(4.1)5Math.floor(x)向下取整Math.floor(4.9)4Math.round(x)四舍五入取整Math.round(4.5)5Math.random()生成[0,1)随机数Math.random()0.xxxMath.max(x,y,...)获取最大值Math.max(1,5,3)5Math.min(x,y,...)获取最小值Math.min(1,5,3)1Math.pow(x,y)返回x的y次幂Math.pow(2,3)8Math.sqrt(x)开方运算Math.sqrt(9)32.3 随机数应用公式// 生成0-x之间的随机整数四舍五入 Math.round(Math.random() * x); // 生成0-x之间的随机整数向下取整 Math.floor(Math.random() * (x 1)); // 生成x-y之间的随机整数四舍五入 Math.round(Math.random() * (y - x) x); // 生成x-y之间的随机整数向下取整★ 推荐 Math.floor(Math.random() * (y - x 1) x);2.4 实战案例猜数字游戏let trueNum Math.floor(Math.random() * 100 1); let num prompt(请输入数字); while (true) { if (trueNum num) { alert(大了); num prompt(请输入数字); } else if (trueNum num) { alert(小了); num prompt(请输入数字); } else { alert(恭喜你猜对了); break; } }三、Date对象3.1 基本概念在JS中使用Date来处理日期和时间。它是一个构造函数所以必须要实例化后才能使用。3.2 创建Date对象// 当前时间 let date new Date(); // 指定时间字符串格式 let d1 new Date(2025-11-15); let d2 new Date(2025/11/15 12:00:00); // 指定时间数字格式月份需-1 let d3 new Date(2025, 10, 15); // 实际为2025年11月15日注意数字格式中月份从0开始0代表1月10代表11月。3.3 实例方法方法说明返回值范围getDate()获取日期1-31getDay()获取周几0-60代表周日getMonth()获取月份0-110代表1月getFullYear()获取完整年份四位数字getHours()获取小时0-23getMinutes()获取分钟0-59getSeconds()获取秒数0-59getTime()获取时间戳毫秒数长整数3.4 时间戳及其四种获取方式时间戳从格林威治标准时间的1970年1月1日0时0分0秒到当前日期所花费的毫秒数。// 四种获取时间戳的方式 let t1 new Date().getTime(); let t2 new Date().valueOf(); let t3 new Date(); // 利用一元运算符 let t4 Date.now(); // ★ 推荐最简洁3.5 性能测试应用let start Date.now(); // 执行需要测试的代码... for (let i 0; i 1000000; i) { /* 耗时操作 */ } let end Date.now(); console.log(执行了 (end - start) 毫秒);3.6 实战案例倒计时函数function countDown(time) { let nt new Date(); // 当前时间戳 let ft new Date(time); // 目标时间戳 let ct ft - nt; // 差值毫秒 ct ct / 1000; // 转换为秒 // 计算天、时、分、秒 let date parseInt(ct / 60 / 60 / 24); let hour parseInt((ct / 60 / 60) % 24); let min parseInt((ct / 60) % 60); let sec parseInt(ct % 60); return 剩余时间${date}天${hour}小时${min}分钟${sec}秒; } console.log(countDown(2026-01-01));四、包装类4.1 基本概念JS中的数据类型分为两大类类型说明示例基本数据类型存储在栈内存中String、Number、Boolean、Null、Undefined引用数据类型存储在堆内存中Object、Array、Function等包装类将基本数据类型转换为对应的对象类型。String(); // 将字符串基本类型转换为String对象 Number(); // 将数字基本类型转换为Number对象 Boolean(); // 将布尔值基本类型转换为Boolean对象4.2 注意事项实际开发中很少使用基本数据类型的对象使用基本数据类型对象进行比较时可能产生不可预估的结果let str1 new String(hello); let str2 new String(hello); console.log(str1 str2); // false两个不同的对象4.3 底层机制let str hello; // 基本数据类型 console.log(str.length); // 底层临时使用String包装类转换为对象执行过程临时转换为String对象读取length属性转换回基本数据类型重要方法和属性只能添加给对象不能添加给基本数据类型。当我们对一些基本数据类型的值去调用属性和方法时浏览器会临时使用包装类将其转换为对象然后再调用对象的属性和方法调用完以后再将其转换为基本数据类型。五、字符串方法5.1 字符串存储特点字符串底层以字符数组形式保存let str hello; // 底层存储[h, e, l, l, o]5.2 常用方法汇总1length属性let str hello; str.length; // 52charAt() 和 str[]str.charAt(0); // h str[0]; // hES6特性更推荐3concat() — 连接字符串let str hello; str.concat( , world); // hello world // 作用和一样但更常用4indexOf() — 查找首次出现位置let str hello world; str.indexOf(o); // 4首次出现位置 str.indexOf(o, 5); // 7从索引5开始查找 str.indexOf(z); // -1找不到5lastIndexOf() — 从后往前查找str.lastIndexOf(o); // 7从后往前找6includes() — 判断是否包含str.includes(hello); // true str.includes(xyz); // false7slice() — 截取字符串支持负数let str hello; str.slice(0, 3); // hel不包含结束位置 str.slice(0, -1); // hell负数从后计算 str.slice(2); // llo省略第二个参数截取到最后8substring() — 截取字符串不支持负数str.substring(0, 3); // hel str.substring(3, 0); // hel自动交换参数位置 str.substring(-1, 3); // hel负数视为09substr() — 截取字符串指定长度str.substr(0, 3); // hel从索引0开始截取3个三种截取方法对比方法参数支持负数特点slice(start, end)开始索引结束索引✅最常用推荐substring(start, end)开始索引结束索引❌自动交换参数substr(start, length)开始索引截取长度❌已废弃不推荐10split() — 拆分为数组let str red,orange,yellow; str.split(,); // [red, orange, yellow] str.split(); // [r, e, d, ,, o, ...]11replace() — 替换字符let str hello world; str.replace(world, JavaScript); // hello JavaScript // 注意只替换第一个匹配项12toUpperCase() / toLowerCase()let str Hello World; str.toUpperCase(); // HELLO WORLD str.toLowerCase(); // hello world5.3 方法速查表方法功能返回值length获取字符串长度数字charAt(index)获取指定位置字符字符str[index]获取指定位置字符ES6字符concat(str)连接字符串新字符串indexOf(search)查找首次出现位置索引或-1lastIndexOf(search)从后往前查找索引或-1includes(search)判断是否包含true/falseslice(start, end)截取字符串新字符串substring(start, end)截取字符串新字符串substr(start, length)截取字符串新字符串split(separator)拆分为数组数组replace(old, new)替换字符新字符串toUpperCase()转换为大写新字符串toLowerCase()转换为小写新字符串总结本文系统梳理了JavaScript中常用的内置对象主题核心要点Math对象工具类无需实例化提供数学运算方法Date对象构造函数处理日期时间时间戳的四种获取方式包装类基本类型临时转换为对象调用属性和方法后再转回字符串方法截取、查找、替换、转换、拆分等常用操作掌握这些内置对象你就能在日常开发中得心应手地处理各种常见任务。

JS内置对象完全指南：Math、Date、包装类与字符串方法详解

相关推荐

三分钟掌握Pixelle-Video：AI短视频创作工作流配置终极指南

暗黑破坏神2存档编辑器终极教程：5分钟掌握网页版d2s-editor

特斯拉Model Y的音响升级改装命题：能不能装

更多资讯

Flutter+OpenHarmony开发健康睡眠记录App实践

EGE图形库入门：环境配置、坐标体系与绘图函数实操

8款实用AI论文写作工具横向实测，本硕博论文避坑全攻略

基于vux与vue全家桶的微信商城公众号接入实践

Unity2019中UMP打包后视频不播放？从dll到路径的排查清单

AI运动耳机：耳道生物传感的原理与实战指南

今日更新

基于高阶循环谱的MPSK载波频率估计与MATLAB实现

MiniPdf方：.NET开源Office转PDF的高效解决方案

Solon AI v3.10：Java全栈智能体开发框架解析

本周精选

AI驱动的自动化专利分析平台技术解析

LeetCode-Go 题解：1252. Cells with Odd Values in a Matrix（奇数值单元格计数）双解法剖析

在线答疑系统Java毕设实战：Spring Boot前后端分离与状态流转

本月热门

基于YOLO的焊缝缺陷检测：从数据标注到工业部署全流程实践

分布式服务的决策记录

创业产品的首版范围

读完文章，想聊聊您的网站？