js常用函数总结
目录
一、基础操作函数
1. 类型判断
2. 数据转换
二、数组常用函数
1. 遍历与映射
2. 聚合与计算
3. 增删改查
4. 其他常用
三、字符串常用函数
1. 查找与截取
2. 替换与分割
3. 其他常用
四、对象常用函数
1. 属性操作
2. 对象操作
五、日期与时间函数
1. 基础操作
2. 时间戳
3. 格式化(需自定义函数)
六、正则表达式函数
1. 正则测试
2. 字符串匹配
七、其他常用函数
1. 数学函数(Math 对象)
2. 浏览器 API
总结与建议
以下是 JavaScript 中常用的函数分类及示例,涵盖基础操作、数组、字符串、对象、日期、正则表达式等核心场景,帮助你快速掌握常用功能:
一、基础操作函数
1. 类型判断
函数 / 方法 | 作用 | 示例 |
---|---|---|
typeof | 返回变量的数据类型 | typeof 'abc' → "string" ;typeof 123 → "number" |
instanceof | 判断对象是否为某构造函数的实例 | [] instanceof Array → true |
Object.prototype.toString.call() | 精准判断复杂类型 | Object.prototype.toString.call([]) → "[object Array]" |
2. 数据转换
函数 / 方法 | 作用 | 示例 |
---|---|---|
parseInt() | 字符串转整数(按进制) | parseInt('12px', 10) → 12 |
parseFloat() | 字符串转浮点数 | parseFloat('3.14em') → 3.14 |
String() | 转字符串 | String(123) → "123" |
JSON.stringify() | 对象转 JSON 字符串 | JSON.stringify({a: 1}) → "{\"a\":1}" |
JSON.parse() | JSON 字符串转对象 | JSON.parse('{"a":1}') → {a: 1} |
二、数组常用函数
1. 遍历与映射
函数 / 方法 | 作用 | 示例 |
---|---|---|
forEach() | 遍历数组,执行回调(无返回值) | [1,2,3].forEach(x => console.log(x)) |
map() | 遍历数组,返回新数组(映射处理) | [1,2,3].map(x => x*2) → [2,4,6] |
filter() | 过滤数组,返回符合条件的元素 | [1,2,3].filter(x => x>2) → [3] |
find() | 查找第一个符合条件的元素 | [{a:1}, {a:2}].find(x => x.a === 2) → {a:2} |
2. 聚合与计算
函数 / 方法 | 作用 | 示例 |
---|---|---|
reduce() | 聚合数组为单个值(累加、累减等) | [1,2,3].reduce((sum, x) => sum + x, 0) → 6 |
some() | 判断数组中是否至少有一个元素符合条件 | [1,2,3].some(x => x>2) → true |
every() | 判断数组中所有元素是否都符合条件 | [1,2,3].every(x => x<4) → true |
3. 增删改查
函数 / 方法 | 作用 | 示例 |
---|---|---|
push() | 向数组末尾添加元素,返回新长度 | let arr = [1]; arr.push(2) → arr: [1,2] |
pop() | 删除数组末尾元素,返回删除的元素 | let arr = [1,2]; arr.pop() → 2 , arr: [1] |
shift() | 删除数组开头元素,返回删除的元素 | let arr = [1,2]; arr.shift() → 1 , arr: [2] |
unshift() | 向数组开头添加元素,返回新长度 | let arr = [2]; arr.unshift(1) → 2 , arr: [1,2] |
splice() | 插入 / 删除 / 替换数组元素(修改原数组) | let arr = [1,2,3]; arr.splice(1, 1, 'a') → arr: [1, 'a', 3] |
concat() | 合并数组,返回新数组 | [1,2].concat([3,4]) → [1,2,3,4] |
4. 其他常用
函数 / 方法 | 作用 | 示例 |
---|---|---|
slice() | 截取数组片段,返回新数组(不修改原数组) | [1,2,3].slice(1, 3) → [2,3] |
sort() | 数组排序(默认按 Unicode 码,可自定义比较函数) | [3,1,2].sort((a,b)=>a-b) → [1,2,3] |
includes() | 判断数组是否包含某个元素 | [1,2].includes(2) → true |
flat() | 扁平化数组(可指定深度) | [1, [2, [3]]].flat(2) → [1,2,3] |
三、字符串常用函数
1. 查找与截取
函数 / 方法 | 作用 | 示例 |
---|---|---|
indexOf() | 查找子字符串首次出现的索引(未找到返回 -1 ) | 'abc'.indexOf('b') → 1 |
lastIndexOf() | 查找子字符串最后一次出现的索引 | 'ababa'.lastIndexOf('a') → 4 |
substring() | 截取字符串(start 到 end,不包含 end) | 'abcde'.substring(1, 3) → 'bc' |
substr() | 截取字符串(从 start 开始,取 length 长度) | 'abcde'.substr(1, 2) → 'bc' |
slice() | 截取字符串(支持负数索引) | 'abcde'.slice(-2) → 'de' |
2. 替换与分割
函数 / 方法 | 作用 | 示例 |
---|---|---|
replace() | 替换字符串(支持正则) | 'a1b2c'.replace(/\d/g, '*') → 'a*b*c' |
split() | 分割字符串为数组 | 'a,b,c'.split(',') → ['a','b','c'] |
trim() | 去除字符串首尾空格 | ' abc '.trim() → 'abc' |
trimStart() /trimLeft() | 去除字符串开头空格 | ' abc'.trimStart() → 'abc' |
trimEnd() /trimRight() | 去除字符串末尾空格 | 'abc '.trimEnd() → 'abc' |
3. 其他常用
函数 / 方法 | 作用 | 示例 |
---|---|---|
charAt() | 返回指定索引的字符 | 'abc'.charAt(1) → 'b' |
charCodeAt() | 返回指定索引字符的 Unicode 编码 | 'a'.charCodeAt(0) → 97 |
repeat() | 重复字符串指定次数 | 'a'.repeat(3) → 'aaa' |
toLowerCase() | 转小写 | 'AbC'.toLowerCase() → 'abc' |
toUpperCase() | 转大写 | 'AbC'.toUpperCase() → 'ABC' |
四、对象常用函数
1. 属性操作
函数 / 方法 | 作用 | 示例 |
---|---|---|
Object.keys() | 返回对象所有属性名组成的数组 | Object.keys({a:1, b:2}) → ['a','b'] |
Object.values() | 返回对象所有属性值组成的数组 | Object.values({a:1, b:2}) → [1,2] |
Object.entries() | 返回对象所有键值对组成的数组 | Object.entries({a:1, b:2}) → [['a',1], ['b',2]] |
hasOwnProperty() | 判断对象是否包含自身属性(非继承) | {a:1}.hasOwnProperty('a') → true |
2. 对象操作
函数 / 方法 | 作用 | 示例 |
---|---|---|
Object.assign() | 合并对象(浅拷贝) | Object.assign({a:1}, {b:2}) → {a:1, b:2} |
JSON.parse() /JSON.stringify() | 对象与 JSON 互转 | 见 “基础操作函数” 部分 |
Object.create() | 创建继承指定原型的对象 | let proto = {foo: 'bar'}; let obj = Object.create(proto); → obj.foo → 'bar' |
delete 操作符 | 删除对象属性 | let obj = {a:1}; delete obj.a; → obj 变为 {} |
五、日期与时间函数
1. 基础操作
函数 / 方法 | 作用 | 示例(以 new Date('2023-10-01') 为例) |
---|---|---|
getFullYear() | 获取年份 | 2023 |
getMonth() | 获取月份(0-11) | 9 (10 月对应 9) |
getDate() | 获取日期(1-31) | 1 |
getDay() | 获取星期(0-6,0 为周日) | 0 (假设 2023-10-01 是周日) |
2. 时间戳
函数 / 方法 | 作用 | 示例 |
---|---|---|
Date.now() | 获取当前时间戳(毫秒) | 16961568000000 (假设为 2023-10-01 00:00:00) |
getTime() | 获取 Date 对象的时间戳 | new Date().getTime() → 同上 |
3. 格式化(需自定义函数)
javascript
// 示例:格式化日期为 'YYYY-MM-DD'
function formatDate(date) {const year = date.getFullYear();const month = String(date.getMonth() + 1).padStart(2, '0'); // 补零const day = String(date.getDate()).padStart(2, '0');return `${year}-${month}-${day}`;
}
formatDate(new Date()) → '2023-10-01'
六、正则表达式函数
1. 正则测试
函数 / 方法 | 作用 | 示例 |
---|---|---|
test() | 测试字符串是否匹配正则 | /\d/.test('a1b') → true |
exec() | 执行匹配,返回匹配结果数组 | /(\d)/.exec('a1b') → ['1', '1', index: 1, input: 'a1b'] |
2. 字符串匹配
函数 / 方法 | 作用 | 示例 |
---|---|---|
match() | 字符串匹配正则,返回匹配结果数组 | 'a1b2c'.match(/\d/g) → ['1','2'] |
replace() | 结合正则替换字符串 | 'a1b2c'.replace(/\d/g, '*') → 'a*b*c' |
split() | 结合正则分割字符串 | 'a1b2c'.split(/\d/) → ['a','b','c'] |
七、其他常用函数
1. 数学函数(Math
对象)
函数 / 方法 | 作用 | 示例 |
---|---|---|
Math.random() | 生成 [0,1) 随机数 | Math.random() → 0.3456... |
Math.floor() | 向下取整 | Math.floor(3.9) → 3 |
Math.ceil() | 向上取整 | Math.ceil(3.1) → 4 |
Math.round() | 四舍五入取整 | Math.round(3.6) → 4 |
Math.max/min() | 求最大值 / 最小值 | Math.max(1,3,2) → 3 ;Math.min(1,3,2) → 1 |
2. 浏览器 API
函数 / 方法 | 作用 | 示例 |
---|---|---|
setTimeout() | 延迟执行函数(单次) | setTimeout(() => console.log('延迟 1 秒'), 1000) |
setInterval() | 循环执行函数(间隔执行) | setInterval(() => console.log('每秒执行'), 1000) |
clearTimeout() /clearInterval() | 清除定时器 | 与上述函数配合使用,停止定时器 |
console.log() | 控制台输出 | console.log('Hello World!') |
总结与建议
- 记忆技巧:按场景分类记忆(如数组、字符串、对象),优先掌握高频函数(如
forEach
、map
、filter
、split
、replace
等)。 - 实践建议:通过刷题(如 LeetCode)或项目练习巩固,注意不同函数的副作用(如
splice
修改原数组,slice
返回新数组)。 - 查阅文档:熟练使用 MDN 文档(MDN Web Docs)查询函数细节和兼容性。