当前位置: 首页 > news >正文

29-JavaScript基础语法(函数)

知识目标

  1. 理解函数的基本概念;
  2. 掌握函数的定义和调用;
  3. 理解函数参数和返回值及作用域;
  4. 掌握函数高阶用法。

1. 理解函数的基本概念

明确函数在 JavaScript 里是一段可重复使用的代码块,它能接收输入参数,执行特定任务,并返回结果。
明白函数在程序设计中的重要性,比如实现代码复用、模块化编程,提高代码的可维护性和可读性。

2. 掌握函数的定义和调用

2.1 函数声明

学会使用 function 关键字来定义函数,掌握函数名、参数列表和函数体的语法。

2.1.1 声明函数

function 函数名(参数1, 参数2, ...) {
// 函数体语句块;return 返回值;
}

函数由函数名、参数、函数体和返回值4部分组成。
函数名是调用函数时引用的名称。
函数参数位于括号内,可以是常量、变量或表达式,甚至是函数,也可以不需要参数。
函数体放在花括号{}内,{}中的语句是函数被调用时执行的语句。
函数执行完后可以有返回值,也可以没有返回值。可以返回一个值,也可以是数组,对象等。有返回值使用return语句,无返回值则省略return语句。

2.1.2 声明函数表达式

  1. 把函数表达式赋值给一个变量,格式如下:
var 变量名 = function 函数名(参数1, 参数2, ...) {// 函数体语句块;return 返回值;
}

变量名将作为函数名,这种方法的本质是把函数当作数据赋值给变量。

  1. 网页事件直接调用函数表达式
// 网页加载时触发
window.onload =  function 函数名(参数1, 参数2, ...) {// 函数体语句块;return 返回值;
}

2.2 函数的调用

学会如何调用已定义的函数,传递参数并接收返回值。

函数名(传递给函数的参数1, 传递给函数的参数2,...); 
// 例如:
const result = greet('John');
console.log(result);

3. 理解函数参数和返回值及作用域

3.1 函数参数

函数括号里的即为参数,函数定义时为形式参数,函数调用时为实际参数。可以在声明函数时设置参数的默认值,这样如果调用函数未传参时会使用默认值。

3.2 函数返回值

  • 理解函数返回值的概念,知道如何使用 return 语句从函数中返回一个值。
  • 明白如果函数没有显式的 return 语句,默认返回 undefined。
    如下案例返回了值。
function calculateArea(radius) {return Math.PI * radius * radius;
}
const area = calculateArea(5);
console.log(area);

3.3 函数的作用域

变量的作用域是指可以访问该变量的代码区域。在JavaScript中,根据变量的作用范围,可分为全局变量和局部变量。
全局变量是指在整个HTML文档都可以使用的变量,通常指在函数体外定义的变量。在函数外部使用var、let或不使用var、let定义的变量都是全局变量。在函数内部不使用var、let定义的变量也是全局变量。
局部变量是只能在局部范围内使用的变量,通常是在函数体内定义的变量,因此只在该函数体内有效,其他函数无法访问。只有在函数内使用var、let定义的变量才是局部变量。

4. 函数高阶用法。

4.1 回调函数

回调函数,即把一个函数作为参数传递给另一个函数,在合适的时候调用。

function doSomething(callback) {console.log('Doing something...');callback();
}
function printMessage() {console.log('Message printed.');
}
doSomething(printMessage);

4.2 闭包函数

闭包是指有权访问另一个函数作用域中的变量的函数。

function outerFunction() {const outerVariable = 'I am from outer function';function innerFunction() {console.log(outerVariable);}return innerFunction;
}
const closure = outerFunction();
closure();
http://www.xdnf.cn/news/69319.html

相关文章:

  • JavaScript 中的单例模式
  • AI Agent开发第34课-用最先进的图片向量BGE-VL实现“图搜图”-下
  • C# 的 字符串插值($) 和 逐字字符串(@) 功能
  • 高效Java面试题(附答案)
  • 鸿蒙系统的 “成长烦恼“:生态突围与技术迭代的双重挑战
  • KRaft面试思路引导
  • Linux环境准备(安装VirtualBox和Ubuntu,安装MySQL,MySQL启动、重启和停止)
  • promise.resolve,promise.reject,promise.all的理解和运用
  • Java 性能优化:从硬件到软件的全方位思考
  • 深入解析 Python 函数:从基础到进阶
  • Python利用shp文件裁剪netcdf文件
  • Linux-scp命令
  • 高尔夫球规则及打法·棒球1号位
  • 软件模块设计质量之内聚
  • 大模型AI的运行逻辑与准确性保障机制——以DeepSeek与豆包为例
  • 当socket的状态为SOCK_SYNSENT时,不可能同时存在Sn_IR_TIMEOUT中断标志被置位的情况
  • 基于SpringBoot的高校体育馆场地预约管理系统-项目分享
  • jinjia2将后端传至前端的字典变量转换为JS变量
  • 使用 Flutter 遇坑小计
  • 经典文献阅读之--SSR:(端到端的自动驾驶真的需要感知任务吗?)
  • 纷析云开源财务软件:助力企业实现数字化自主权
  • 跳跃游戏(每日一题-中等)
  • 【leetcode题解】算法练习
  • 零基础上手Python数据分析 (20):Seaborn 统计数据可视化 - 轻松绘制精美统计图表!
  • 使用Python可视化莫比乌斯带
  • 数据库—MySQL事务
  • 基于Python Socket的多线程聊天程序案例分析
  • 一页概览:虚拟机的备份
  • 一周学会Pandas2 Python数据处理与分析-Pandas2索引标签操作
  • 多模态大语言模型arxiv论文略读(三十三)