ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

函数 - JavaScript 核心概念

2022-10-29 21:41:42  阅读:168  来源: 互联网

标签:javaJDK java 虚拟机 布局 数据 代码 程序


功能

第 1 部分 什么是函数?

以下是一些定义:

  1. 代码
    块 = 执行操作或返回值

  2. 自定义代码
    = 由程序员定义,可重用
    → 可以使程序更加模块化和高效

...

第 2 部分 函数定义

选项 1:关键字function

代码示例
function newEvent() {
    console.log(‘New event created!’)
}
应用
  1. 以关键字开头function

  2. 后跟函数名称

  3. 函数名称遵循与变量
    相同的规则 = 可以包含字母、数字、下划线和美元符号
    → 经常用驼峰大小写
    书写 → 名称后跟一组括号: 可用于可选参数

  4. 函数
    代码 = 包含在大括号中
    → 像 for 语句或 if 语句

  5. 什么都不会发生
    = 在调用/调用函数之前→不会执行
    任何代码

选项 2:函数表达式

创造

= 将函数分配给变量

代码示例

= 使用上面的
示例 → 直接将返回值应用于变量 (
addsum)

const sum = function add(x, y) {
    return x + y;
}

// Invoked function to find the sum
sum(20, 5);

= 输出:25
→常量变量是一个函数
sum

添加简洁

= 将其转换为匿名函数(又名未命名函数)
→ 目前,函数名称为
→ 但是对于函数表达式,不需要命名函数
add

因此,通常省略名称,如下所示:

代码示例

const sum = function(x, y) {
    return x + y;
}

//Invoke function to find the sum
sum(100, 3);

= 函数名称:已删除
→ 将其转换为匿名函数
add

保留函数名称

= 可用于帮助调试
→但是,通常省略名称

选项 3:箭头函数

目的

= 从 ECMAScript 6 开始定义函数的更新、更简洁的方法 → 由等号表示,后跟大于号:
= 始终匿名函数
→ 它们是一种函数
表达式
=>

基本示例

= 求 2 个数字的乘积:

const multiply = (x, y) => {
    return x * y;
}

// Invoke function to find product
multiply(30, 4);

= 而不是写出关键字
→ 已使用箭头:指示一个函数 = 否则,它的工作方式类似于正则函数
表达式
→ 有一些高级差异
function=>

Benefits
  1. Concise Syntax

  2. 隐式返回
    = 允许我们编写单行代码

  3. 当您在另一个函数中使用箭头函数
    时,不会重新绑定 = 有助于执行单击处理程序等操作。
    this

应用
转换为箭头函数

= 变成箭头函数

  1. 删除关键字function

  2. 添加一个胖箭头:
    = 它与→做
    同样的事情 当 ged 时,你会得到同样的东西
    =>functionconsole.log

  3. 如果只有 1 个参数
    ,请删除括号 = 尽管您可以将括号保留为样式选择
    → 示例:在回调函数(即映射函数)中,最好将它们省略为干净的语法

1 参数

= 括号可以排除
示例:平方 ,只需要将 1 个数字作为参数传递
x

= 括号已被省略:

代码示例

const square = x => {
    return x * x;
}   

square(8);

= 输出:64 → 这些示例仅包含一个语句

→ 因此: 箭头函数允许进一步减少语法
return

单线return

如果函数只有一行:
= 大括号和语句都可以省略
returnreturn

代码示例

const square = x => x * x;

square(10);

= 输出:100

无参数/参数

= 箭头函数
中仍然需要一组空括号 → 也可以使用下划线代替→ 下划线 = 一次性变量:B / c 我们实际上正在创建一个名为但不使用它
的变量
→它根本没有任何意义
_()__

= 可以使用任何变量名称
→ 只是扔掉(因为它周围没有括号)

代码示例

names.map(_ => `Angeline Wang`);
names.map(x => `Angeline Wang`);
names.map(boo_yaa => `Angeline Wang`);

= 你可以随心所欲地做这件事

返回
隐式与显式

隐式返回

  1. 许多用JS编写的回调函数只是一个行=我们只是在一行

    中立即返回一些东西 → 不需要一大堆行

  2. 箭头函数的唯一目的是返回一些东西
    =不需要关键字
    return

箭头函数中的隐式返回

  1. 删除return

  2. 把它放在一行上

  3. 删除大括号
    = 将成为隐式返回 → 意味着我们不需要指定要返回

    的内容→ 将假设我们正在这样做
    →将再次看到同样的事情
    console.log

显式返回
= 显式写入要返回的内容
return

命名函数与匿名函数
命名函数

= 函数附加了一个名称

命名示例
这是命名函数的样子:

function sayMyName(name) {
    alert(`Hello ${name}`);
}

命名函数
的好处 = 在堆栈跟踪的情况下:当您遇到错误
时 →找出出了问题的地方

= 行号可能不是很有帮助
→ 需要知道它被调用的函数的名称

箭头功能匿名

但是,如果使用箭头函数
= 您无法将它们
命名 → 箭头函数都没有名称
→ 箭头函数始终是匿名函数

解决方案
= 可以将箭头函数放入变量
→ 这意味着您将向箭头函数传递名称并以这种方式创建函数声明

const sayMyName = (name) => {alert(`Hello ${name}!`)}

sayMyName(‘Angeline Wang’);

= 这仍然是一个匿名函数,它不会给我们很好的堆栈跟踪
→但是如果你不关心堆栈跟踪:你可以这样做

选择哪个选项

= 3 种不同类型的语法产生相同的输出
→ 使用哪种语法取决于偏好/公司编码标准,以决定如何构建自己的函数

...

第 3 部分 函数调用

如何调用函数

= 写下函数名称后跟括号
→ 并且可以根据需要多次重复使用

代码示例

newEvent();

...

第4部分 函数参数

定义

= 作为名称传递到函数中并表现为局部变量的输入

目的

  1. 通过创建动态函数使代码更加动态

  2. 添加其他功能

  3. 使代码更灵活

代码示例

示例:添加事件日期

function newEvent(date) {
    console.log(`New event on ${date}!`);
}

= 函数名称为 new事件
→ 现在括号内有单个参数
→ 参数名称遵循与命名变量相同的规则

在函数中使用参数

= 要在字符串中使用参数:→而不是静态字符串:
添加模板 文本字符串
包含参数
不表现为局部变量

参数值分配

  1. 如果参数未在任何地方
    定义 = 调用函数时可以为其赋值 → 值与函数
    调用
    →的括号一起放置 它被用作参数

  2. 每次在函数
    中使用参数时 = 使用函数调用期间传递的值

真实世界用例

= 例如,该函数将从数据库中提取用户名,而不是直接提供名称作为参数值

...

第 5 部分 函数内部的声明

= 变量可以在函数
内声明 → 称为局部变量
它们将仅存在于其自己的功能块的范围内

可变范围

= 确定变量的可访问性
→ 即函数内部定义的变量:函数外部无法访问
但可以与整个程序中使用函数同时使用

...

第 6 部分 返回值

允许的参数数量

= > 1 可以在函数
中使用参数 → 您可以将多个值传递到函数中并返回一个值

代码示例

= 创建函数以查找 2 个值
的总和 → 表示为 和
xy

// Initialize add function
function add(x, y) {
    return x + y;
}

// Invoke function to find the sum
add(9, 7);

= 定义参数为 x 和 y
的函数 → 然后将值 9 和 7 传递给函数
→ 当我们运行程序时,我们将收到这些数字的总和作为输出

标签:javaJDK,java,虚拟机,布局,数据,代码,程序
来源:

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有