JavaScript(JS)函数常见内置方法

29054 阅读 0 评论 63 点赞

上一节我们详细讲解了JS闭包的应用场景（主要是创建私有变量），本节我们将详细介绍JS常用的内置函数。

JS中有很多内置方法，可以让你更方便地处理各种数据类型。以下是常见的一些内置方法：

1. 全局函数

函数	功能
`parseInt()`	字符串转整数
`parseFloat()`	字符串转浮点数
`isNaN()`	检查是否为非数字
`isFinite()`	检查是否为有限数
`encodeURI()`	URI编码
`decodeURI()`	URI解码
`encodeURIComponent()`	URI组件编码
`decodeURIComponent()`	URI组件解码
`eval()`	执行字符串代码

这里实操前三个函数：

/*全局内置函数具体操作*/
const myInt=parseInt('12345')
console.log(myInt);//打印12345
const myFloat=parseFloat('3.1415926')
console.log(myFloat);//打印3.1415926
if(isNaN('Dotcpp'))console.log('‘Dotcpp’不是数字');

2. 字符串方法

函数	功能
`charAt()`	返回指定位置字符
`indexOf()`	返回字符串位置
`lastIndexOf()`	从后往前搜索
`slice()`	提取字符串片段
`substring()`	提取子字符串
`substr()`	提取指定长度子串
`replace()`	替换字符串
`toUpperCase()`	转大写
`toLowerCase()`	转小写
`trim()`	去除两端空格
`split()`	分割字符串为数组
`concat()`	连接字符串
`includes()`	检查是否包含子串
`startsWith()`	检查是否以某字符串开头
`endsWith()`	检查是否以某字符串结尾
`repeat()`	重复字符串
`padStart()`	在开头填充字符串
`padEnd()`	在结尾填充字符串

表单提交通常会检查字符串是否有效，比如11位的电话号码(默认输入字符串都是数字)，我们可以通过trim()去除字符串两边的无效空行，通过substring()提取尾后4位数来验证身份。

/*身份证验证*/
const legal = '13508579999'//这是一个合法的手机号
const ilegal = '   135080000   '//这是一个不合法的手机号
function f(str) {
  /*去除两边空格 - 需要赋值给变量*/
  str = str.trim()
  
  if(str.length != 11) return
  
  /* 获取后4位*/
  const substr = str.substring(str.length - 4)
  console.log('后4位:', substr);
  
  return true;
}
// 测试
f(legal);//打印9999
f(ilegal);//无输出

3. 数组方法

函数	功能
`push()`	末尾添加元素
`pop()`	删除末尾元素
`shift()`	删除开头元素
`unshift()`	开头添加元素
`splice()`	添加/删除元素
`slice()`	提取数组片段
`concat()`	合并数组
`join()`	数组转字符串
`reverse()`	反转数组
`sort()`	数组排序
`indexOf()`	查找元素索引
`lastIndexOf()`	从后往前查找
`forEach()`	遍历数组
`map()`	映射新数组
`filter()`	过滤数组
`reduce()`	累加器
`reduceRight()`	从右向左累加
`some()`	检查是否有元素满足条件
`every()`	检查所有元素是否满足条件
`find()`	查找第一个满足条件的元素
`findIndex()`	查找第一个满足条件的元素索引
`includes()`	检查是否包含某元素
`flat()`	数组扁平化
`flatMap()`	映射后扁平化

数组最常见的操作就是join()和map()了。

/*数组操作*/
/*map()：对每个元素进行统一修改*/
let course = ['C++','算法竞赛教程','JavaScript','ACM与蓝桥杯竞赛指南']
course=course.map(ele=>ele+'教程')//ele标识元素，这里指给每一个元素都追加“教程”这个字符串
for(const crs of course)console.log(crs);//遍历Dotcpp教程
/*join()：数组转字符串*/
console.log(course.join());//这里打印的不再是数组，而是字符串：C++,算法竞赛教程,JavaScript,ACM与蓝桥杯竞赛指南

4. 数学方法

函数	功能
`Math.abs()`	绝对值
`Math.ceil()`	向上取整
`Math.floor()`	向下取整
`Math.round()`	四舍五入
`Math.max()`	最大值
`Math.min()`	最小值
`Math.random()`	随机数(0-1)
`Math.sqrt()`	平方根
`Math.pow()`	幂运算
`Math.sin()`	正弦
`Math.cos()`	余弦
`Math.tan()`	正切
`Math.log()`	自然对数
`Math.exp()`	e的指数

数学方法应时而变，具体看需求找函数。这里演示前三个函数：

/*abs()、ceil()和floor()*/
/*abs()：求绝对值*/
const Mabs=Math.abs(-1)
console.log(Mabs);//1
/*ceil()：向上取整*/
const Mceil=Math.ceil(0.1)
console.log(Mceil);//1
/*floor()：向下取整*/
const Mfloor=Math.floor(0.9)
console.log(Mfloor);//0

5. 日期方法

函数	功能
`Date.now()`	当前时间戳
`new Date()`	创建日期对象
`getFullYear()`	获取年份
`getMonth()`	获取月份(0-11)
`getDate()`	获取日期(1-31)
`getDay()`	获取星期(0-6)
`getHours()`	获取小时
`getMinutes()`	获取分钟
`getSeconds()`	获取秒数
`getTime()`	获取时间戳
`setFullYear()`	设置年份
`setMonth()`	设置月份
`setDate()`	设置日期

日期方法最常见的就是获取时间戳展示时间了。比如想要获取当前时间，我们可以设置一个定时器，并将时间戳转为我们熟悉的时分秒格式：

  /* 通过时间戳显示时间 */
// 时间戳转时分秒格式
function showTimestamp() {
    const timestamp = Date.now();
    const date = new Date(timestamp);
    
    const hours = date.getHours().toString().padStart(2, '0');
    const minutes = date.getMinutes().toString().padStart(2, '0');
    const seconds = date.getSeconds().toString().padStart(2, '0');
    
    console.log(`${hours}:${minutes}:${seconds}`);
}
// 每秒更新
setInterval(showTimestamp, 1000);
showTimestamp(); // 立即执行一次

6. 对象方法

函数	功能
`Object.keys()`	获取所有属性名
`Object.values()`	获取所有属性值
`Object.entries()`	获取所有键值对
`Object.assign()`	合并对象
`Object.create()`	创建新对象
`Object.freeze()`	冻结对象
`Object.seal()`	密封对象
`Object.hasOwnProperty()`	检查自身属性

实操前两个函数，分别遍历对象的所有键和所有值。

/* Object.keys()和Object.values() */
  const obj ={brand:'Dotcpp编程',website:'dotcpp.com',content:'do coding',storage:99999999}//准备一个对象
  const keys=Object.keys(obj)//获取所有键
  const values=Object.values(obj)//获取所有值
  console.log(keys);//['brand', 'website', 'content', 'storage']
  console.log(values);//['Dotcpp编程', 'dotcpp.com', 'do coding', 99999999]

总结：这些是JS中常见的内置方法，掌握它们的使用技巧可以让你更好地利用JS的强大功能。