news 2026/2/13 4:26:52

JS函数语法(重点)

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
JS函数语法(重点)
函数声明(命名函数)

语法:function 函数名(参数) { 函数体; return 返回值 }

// 求和函数 function sum(a, b) { return a + b; // 返回值,无 return 则返回 undefined } // 调用函数 let result = sum(1, 2); console.log(result); // 3
函数表达式(匿名函数 / 具名函数)
// 匿名函数表达式 let sum = function(a, b) { return a + b; }; console.log(sum(3, 4)); // 7 // 具名函数表达式(便于调试) let sum2 = function fn(a, b) { return a + b; };
箭头函数(ES6+)
// 基础写法 let sum = (a, b) => { return a + b; }; // 简写:单返回语句可省略 {} 和 return let sum2 = (a, b) => a + b; // 单参数可省略 () let double = n => n * 2;

函数参数

形参和实参
  • 形参:函数声明时的参数(占位符)。
  • 实参:函数调用时传入的参数(实际值)。

⚠️ JS 允许实参和形参数量不一致:

  • 实参少 → 形参为undefined
  • 实参多 → 多余参数被忽略(可通过arguments或剩余参数获取)。
默认参数(ES6+)

给形参设置默认值,实参未传时使用。

function sayHi(name = '游客') { console.log(`你好,${name}`); } sayHi(); // 你好,游客 sayHi('张三'); // 你好,张三
剩余参数(ES6+)

语法:...变量名,接收剩余的所有实参(转为数组)。

function sum(...nums) { return nums.reduce((total, n) => total + n, 0); } console.log(sum(1, 2, 3)); // 6 console.log(sum(1, 2, 3, 4)); // 10
展开运算符(ES6+)

语法:...数组/对象,将数组 / 对象展开为单个值。

let arr = [1, 2, 3]; console.log(...arr); // 1 2 3 // 传参时展开 function sum(a, b, c) { return a + b + c; } console.log(sum(...arr)); // 6

作用域与闭包

作用域
  • 全局作用域:代码全程可见(如全局变量)。
  • 函数作用域:仅函数内部可见(var声明的变量)。
  • 块级作用域:仅{}内部可见(let/const声明的变量)。
闭包

定义:内层函数访问外层函数的变量,形成闭包(外层函数执行后,变量不被销毁)。

用途:私有化变量、缓存数据、防抖节流。

风险:内存泄漏(闭包引用的变量不会被垃圾回收,需手动释放)。

function outer() { let num = 10; // 外层变量 // 内层函数访问外层变量,形成闭包 return function inner() { console.log(num); }; } let fn = outer(); fn(); // 10(outer 执行后,num 未被销毁)

核心数组方法(高频)

方法作用是否修改原数组返回值
push()末尾添加元素新长度
pop()末尾删除元素删除的元素
unshift()开头添加元素新长度
shift()开头删除元素删除的元素
splice()增删改(万能方法)删除的元素数组
slice()截取数组(start, end)新数组(不包含 end)
concat()合并数组新数组
join()转为字符串(指定分隔符)字符串
forEach()遍历数组(无返回值)undefined
map()遍历数组,返回新数组新数组(每个元素处理后)
filter()过滤数组符合条件的新数组
reduce()累加 / 归并最终累加值
find()找第一个符合条件的元素元素 /undefined
findIndex()找第一个符合条件的索引索引 /-1
includes()判断是否包含元素true/false
sort()排序排序后的数组(默认字符序
let arr = [1, 2, 3]; // 增删改 arr.push(4); // [1,2,3,4] arr.pop(); // [1,2,3] arr.splice(1, 1, 10); // 从索引1删1个,加10 → [1,10,3] // 遍历/处理 arr.forEach(item => console.log(item)); // 1,10,3 let newArr = arr.map(item => item * 2); // [2,20,6] let filterArr = arr.filter(item => item > 5); // [10] // 归并(求和) let total = arr.reduce((sum, item) => sum + item, 0); // 14 // 查找 console.log(arr.find(item => item > 5)); // 10 console.log(arr.includes(10)); // true // 排序(注意:默认字符序,需传回调) let numArr = [10, 2, 5]; numArr.sort((a, b) => a - b); // 升序 [2,5,10] numArr.sort((a, b) => b - a); // 降序 [10,5,2]

对象

对象是键值对的集合,键(属性名)为字符串,值(属性值)可为任意类型,是 JS 面向对象的基础。

// 字面量(推荐) let user = { name: '张三', // 属性 age: 20, sayHi: function() { // 方法 console.log('你好'); } }; // 构造函数 let user2 = new Object(); user2.name = '李四'; user2.age = 21;
// 点语法(推荐,属性名合法) console.log(user.name); // 张三 // 方括号(属性名含特殊字符/变量) console.log(user['age']); // 20 let key = 'sayHi'; user[key](); // 你好
增删改属性
// 新增 user.gender = '男'; // 修改 user.age = 22; // 删除 delete user.gender;

日期

// 创建日期对象 let date = new Date(); console.log(date.getFullYear()); // 年 console.log(date.getMonth() + 1); // 月(0-11,需+1) console.log(date.getDate()); // 日 console.log(date.getHours()); // 时 console.log(date.getMinutes()); // 分 console.log(date.getSeconds()); // 秒 // 格式化日期 function formatDate() { let d = new Date(); let year = d.getFullYear(); let month = String(d.getMonth() + 1).padStart(2, '0'); let day = String(d.getDate()).padStart(2, '0'); return `${year}-${month}-${day}`; } console.log(formatDate()); // 2025-12-14
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/2/4 22:02:23

分公司组织架构图在线设计 总部分支管理模板

良功绘图网站 (https://www.lghuitu.com ) 在企业规模化发展的进程中,分公司的设立成为拓展市场、优化资源配置的重要举措。而总部分支之间的高效协同,离不开清晰、科学的组织架构作为支撑。分公司组织架构图作为直观呈现管理层级、部门设置、权责划分的…

作者头像 李华
网站建设 2026/2/5 16:40:29

KD-Tree的查询原理

好的,让我详细解释KD-Tree的查询原理,以及为什么它能将时间复杂度从O(n)降到O(log n)。 KD-Tree的基本结构 KD-Tree(k-dimensional tree)是一种用于多维空间的数据结构,特别适合范围搜索和最近邻搜索。 构建过程示例…

作者头像 李华
网站建设 2026/2/6 18:53:27

基于Mask R-CNN的道路路面损伤自动检测与分类研究

1. 基于Mask R-CNN的道路路面损伤自动检测与分类研究 1.1. 引言 随着城市化进程的加速,道路基础设施的维护变得越来越重要。传统的人工检测方法效率低下、成本高昂,且存在安全隐患。🚧 近年来,计算机视觉技术的快速发展为道路路…

作者头像 李华
网站建设 2026/2/5 13:34:03

最近在研究高速列车的主动悬挂系统,发现H无穷控制策略在这个领域挺有意思的。今天就来聊聊基于H无穷控制策略的横摆半车9自由度高速列车主动悬挂

基于H无穷控制策略的横摆半车9自由度高速列车主动悬挂首先,我们得明白什么是H无穷控制。简单来说,H无穷控制是一种鲁棒控制方法,能够在系统存在不确定性和外部干扰的情况下,保证系统的稳定性和性能。对于高速列车这种复杂系统&…

作者头像 李华
网站建设 2026/2/10 7:45:41

Ubuntu硬盘空间不够?一文带你理清过程的根分区无损扩容实战指南

复杂分区布局下的 Ubuntu 根目录无损扩容实践:从引导参数调试到扇区移位 摘要 本文详细记录了在一块 1TB NVMe 固态硬盘(WD_BLACK SN770)上,解决 Ubuntu 根分区(/)空间不足问题的全过程。本次扩容的特殊性在…

作者头像 李华
网站建设 2026/2/10 4:01:56

想让你的标书不废标应该这样做

1、检查项目编号与名称:投标文件整篇项目编号与名称是否正确。2、检查投标人名称:投标人名称与营业执照、资质证书、安全生产许可证、银行资信证明等证明证书是否一致。3、检查投标文件的排版:文本格式、字体、行数、图片是否模糊或歪斜,这些是否按照招标文件的要求…

作者头像 李华