news 2026/8/26 13:54:04

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/8/25 13:33:46

子公司组织结构图绘制 母公司管控关系可视化

在企业规模化、多元化发展的进程中,集团型企业往往会通过设立子公司、分公司等形式拓展业务边界。子公司作为集团战略落地的重要载体,其组织结构的合理性直接影响运营效率;而母公司与子公司之间的管控关系,更是决定集团资源配置、…

作者头像 李华
网站建设 2026/8/24 4:28:43

WebSocket架构详解:从协议原理到企业级应用实践

1 引言:为什么需要WebSocket?在实时交互需求爆发的今天,传统的HTTP轮询已难以满足低延迟、高并发的场景要求。WebSocket作为HTML5的核心协议之一,通过全双工长连接实现了服务端与客户端的主动通信,成为实时系统的首选方…

作者头像 李华
网站建设 2026/8/25 13:56:31

KDTREE based RRT*类型注释版本

以下是添加了类型标注的代码: from typing import List, Tuple, Optional, Any import numpy as np import matplotlib.pyplot as plt from scipy.spatial import KDTree import math import randomclass Node:"""RRT*节点类"""def …

作者头像 李华
网站建设 2026/8/24 19:47:23

Web第三周

本文章写与2025年12月 1.初步了解数据库(MySQL) MySQL 是目前最流行的开源关系型数据库管理系统(RDBMS) 之一,广泛应用于 Web 开发、数据分析、后端服务等场景,以轻量、高效、易用、免费(社区版…

作者头像 李华
网站建设 2026/8/26 1:03:44

​从454. 四数相加 II 中学到Counter​

从454. 四数相加 II 中学到Counter,我们使用 哈希表(Counter) 将时间复杂度从暴力的 (O(n^4)) 优化到 (O(n^2))。 一、Counter 的内部数据结构 ✅ Counter 是什么? Counter 是 Python 标准库 collections 模块中的一个 字典子类…

作者头像 李华