JavaScript编程基础 – 函数进阶

JavaScript编程基础 – 函数进阶

JavaScript Programming Essentials – Perfect Functions

“函数的第一条原则是要小,函数的第二条原则是要更小。“ – 罗伯特.C.马丁

前文讲述过函数多取决于数学的函数概念,以此来定义JavaScript编程语言的函数,从而实现函数式编程。

依据传统数学函数的定义,变量x和函数值y的相互关系始终遵循以下这个公式:
y = f(x)

至于输入的x如何变成y,却有诸多种方法。

尽管前文从不同角度介绍了函数,但是那些是传统的JavaScript函数思想,也就是说,随着ECMAScript标准的演进,这些东西都有可能产生变化。

本文简要介绍JavaScript函数在ECMAScript 2015,也就是ES6规范下的新的变化和新的功能,以便使读者了解函数式编程取得的新的进展能够更加有效地服务于软件服务。

1. 调用名称的函数

简而言之,函数是一段通过其名称被调用的代码,并且,它可以传递参数和返回值。
假设有一个简单函数,只返回它的参数传递的值,不进行任何复杂计算。

示例代码如下:

var simple = (a) => {return a}     // 一个最简单的函数
console.log(simple(5))           // 用函数的名称调用

运行结果如下图:
在这里插入图片描述

2. 调用方法的函数

作为一个简单的方法,用名称和其关联调用,是另一个函数示例,代码如下:

var obj = {simple : (a) => {return a }}
obj.simple(5)       // 用其名称及其关联对象调用

运行结果如下图:
在这里插入图片描述

3. 引用透明性

基于纯粹的函数定义,所有的函数对于相同的输入,都将返回相同的值。函数的这个属性被称为 引用透明性 (Reference Transparency)

以下定义几个简单函数,分别按照传原值、传加法值、传乘法值返回结果;无论传入什么作为输入,最终都会按规则把它返回。

var identity = (i) => {return i}
const add = (x, y) => x + y
const multiply = (x) => x * 5

执行结果如下图:

在这里插入图片描述
不难看出,JavaScript的表达式可以替换为它的计算值,这就是引用透明性

由于函数会为给定的输入,返回相同的值,实际上可以缓存它。

比如,有一个阶乘函数factorial,用来计算给定数值的阶乘,大家都知道5的阶乘等于120(54321 = 120),那么用户第二次调用函数factorial,结果如何呢? 答案仍然是120, 如下代码:

function factorial(n) {let ans = 1;if(n === 0)return 1;for (let i = 2; i <= n; i++)ans = ans * i;return ans;
}

执行结果如下图所示:
在这里插入图片描述

4. 命令式方法

创建一个数组,用for循环遍历它的数组元素,代码执行如下:
在这里插入图片描述

以上这段代码运行良好。但为了解决问题,需要准确地告知程序应该“怎么“做。在本中,代码告诉编译器获得数组长度,遍历数组,用索引获取每一个数组元素等。

这种方法称之为 “命令式“解决方案。命令式编程主张告诉编译器”怎么“做。

5. 声明式方法

另一种编程思路,是告诉编译器做“什么“, 而不是”怎么“做或者”如何“做。
这种方法称之为 “声明式“解决方案。声明式编程中,”怎么“做的部分被抽象到函数中。

示例代码如下,用内置的forEach函数遍历数组并打印输出它:

var array = [1, 2, 3]
array.forEach((element) => console.log(element))

执行结果如下图所示:
在这里插入图片描述
用函数方法处理循环问题
如果需要遍历一个数组,并且将结果打印输出到控制台,可用以下代码来实现:

var array = [1, 3, 5, 7, 9]
for (i = 0; i < array.length; i ++)
console.log(array[i])

执行结果如下图:
在这里插入图片描述

函数式编程中,将操作抽象成函数;如果这样做的话,需要把操作抽象为函数,以便在需要的时候能够重用,这比每次都告诉函数“怎样“去遍历要好。

6. 存储函数到变量

函数就是数据;可以把它存入一个变量。类似以下的代码:

let fn = () => {}
console.log(typeof fn)

执行结果如下图所示:
在这里插入图片描述

其功能无论如何增强,都验证了一个事实,就是函数的结果除了像返回值那样,还可以存储到(赋值)一个变量。

7. 传递函数

下面的函数示例,告诉我们接受一个参数并将参数的类型打印输出到控制台:

var tellType = (arg) => {console.log(typeof arg)
}
tellType("Welcome")

传递字符串“Welcome”作为参数,执行结果如下图:

在这里插入图片描述
可以看到,返回类型为string,如果增加传递几种参数,传递结果如下图:

在这里插入图片描述
返回类型分别为boolean, number和string.

另一个代码如下,将判断如果参数是函数,那么该函数tellType就执行它。

var tellType = (arg) => {if(typeof arg === "function") {arg()} else {console.log("The passed data is:" + arg)}    
}
var dataFn = "Welcome"
tellType(dataFn)

可以看到,通过传递dataFn(一个字符串变量)来执行tellType; 这样,成功地将dataFun传递给另一个函数tellType, 而tellType执行了传入的函数。

执行结果如下图所示:

在这里插入图片描述
函数式编程是JavaScript语言的显著特征,今后有机会将继续研究它的高级特性。

技术好文陆续推出,敬请关注。

喜欢就点赞哈。😊

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/154667.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C++类与对象(3)—拷贝构造函数运算符重载

目录 一、拷贝构造函数 1、定义 2、特征 3、内置与自定义类型 4、const修饰参数 5、默认生成 浅拷贝 深拷贝 6、总结 二、运算符重载 1、定义 2、判断是否相等 3、比较大小 4、赋值 5、总结 一、拷贝构造函数 1、定义 拷贝构造函数&#xff1a;只有单个形参…

利用 React 和 Bootstrap 进行强大的前端开发

文章目录 介绍React 和 Bootstrap设置环境使用 Bootstrap 创建 React 组件React-Bootstrap 组件结论 介绍 创建响应式、交互式和外观引人入胜的 Web 界面是现代前端开发人员的基本技能。幸运的是&#xff0c;借助 React 和 Bootstrap 等工具的出现&#xff0c;制作这些 UI 变得…

生态系统NPP及碳源、碳汇模拟实践技术应用

由于全球变暖、大气中温室气体浓度逐年增加等问题的出现&#xff0c;“双碳”行动特别是碳中和已经在世界范围形成广泛影响。碳中和可以从碳排放&#xff08;碳源&#xff09;和碳固定&#xff08;碳汇&#xff09;这两个侧面来理解。陆地生态系统在全球碳循环过程中有着重要作…

【HarmonyOS】低代码平台组件拖拽使用技巧之常用基础组件(上)

【关键字】 HarmonyOS、低代码平台、组件拖拽、常用基础组件、基础容器 1、写在前面 之前是花了一些时间介绍了在低代码平台中滚动容器、网格布局、页签容器、列表这几种容器的拖拽技巧及使用方法&#xff0c;今天我会继续来介绍咱们在应用开发中可能会经常用到的一些基础容器…

CSS 属性计算过程

CSS 属性计算过程 首先&#xff0c;不知道你有没有考虑过这样的一个问题&#xff0c;假设在 HTML 中有这么一段代码&#xff1a; <body><h1>这是一个h1标题</h1> </body>上面的代码也非常简单&#xff0c;就是在 body 中有一个 h1 标题而已&#xff…

Docker快速安装Mariadb11.1

MariaDB数据库管理系统是MySQL的一个分支&#xff0c;主要由开源社区在维护&#xff0c;采用GPL授权许可 MariaDB的目的是完全兼容MySQL&#xff0c;包括API和命令行&#xff0c;使之能轻松成为MySQL的代替品。在存储引擎方面&#xff0c;使用XtraDB来代替MySQL的InnoDB。 Mari…

Clickhouse初认识

技术主题-clickhouse 一什么是clickHouse 1&#xff09;本质上就是一款数据库管理系统&#xff0c;能提供海量数据的存储和检索 2&#xff09;基于列存储&#xff0c;数据是按照列进行存储的&#xff08;数据格式一样&#xff0c;方便进行压缩&#xff09; 3&#xff09;具备…

基于Cortex®-M4F的TM4C123GH6NMRT7R 32位MCU,LM74900QRGERQ1、LM74930QRGERQ1汽车类理想二极管

一、TM4C123GH6NMRT7R IC MCU 32BIT 256KB FLASH 157BGA Tiva™C系列微控制器为设计人员提供了基于ARMCortex™-M的高性能架构&#xff0c;该架构具有广泛的集成功能以及强大的软件和开发工具生态系统。以性能和灵活性为目标&#xff0c;Tiva™C系列架构提供了一个具有FPU的80…

人性化的微距LED显示屏备受欢迎

近年来&#xff0c;微距LED显示屏市场需求不断攀升&#xff0c;尤其是LED显示屏厂商不断推陈出新的COB和Mini LED封装技术&#xff0c;价格逐渐趋于亲民。随着智慧城市的崛起&#xff0c;微距LED显示屏成为市场上备受瞩目的热门产品。伴随LED显示屏厂商不断升级产品&#xff0c…

单片机和FreeRTOS上跑机器人ROS的应用

机器人的应用越来越广泛了&#xff0c;大家熟知的稚晖君直接创业搞机器人&#xff0c;可想而至&#xff0c;接下来的十年&#xff0c;机器人绝对是热门的行业。 目前市面上很多机器人都是基于一套叫做ROS的系统开发的&#xff0c;今天就给大家分享一个跑在MCU上&#xff0c;基…

抖店与维格表的对接只需轻松几步

通过数环通&#xff0c;您可以使用不到几分钟的时间即可实现抖店与维格表的对接与集成&#xff0c;从而高效实现工作流程自动化&#xff0c;降本增效&#xff01; 1.产品介绍 维格表是一种数据协作工具&#xff0c;具有多维度表格、实时在线编辑、数据可视化等特点。它可以帮助…

基于Python+OpenCV+Tensorflow图像迁移的艺术图片生成系统

欢迎大家点赞、收藏、关注、评论啦 &#xff0c;由于篇幅有限&#xff0c;只展示了部分核心代码。 文章目录 一项目简介 二、功能三、系统![请添加图片描述](https://img-blog.csdnimg.cn/dbda87069fc14c24b71c1eb4224dff05.png)四. 总结 一项目简介 基于PythonOpenCVTensorfl…

Apache ECharts简介

二十九、Apache ECharts 29.1 介绍 Apache ECharts 是一款基于 JavaScript 的数据可视化图表库&#xff0c;提供直观、生动、可交互、可个性化定制的数据可视化图表。 官网地址&#xff1a;https://echarts.apache.org/zh/index.html 常见效果展示&#xff1a; 1). 柱形图 …

NodeMCU ESP8266构建Web Server网页端控制设备

NodeMCU ESP8266构建Web Server网页端控制设备 前言 NodeMCU ESP8266 内部集成了TCP/IP协议栈&#xff0c;可以快速构建网络功能&#xff0c;搭建联网应用的硬件平台&#xff1b; ESP8266可以作为WiFi接入点&#xff08;Station&#xff09;&#xff0c;这样可以方便连接互联…

网站SSL证书过期了

当网站的SSL证书到期时&#xff0c;这可能会对网站的安全性和可信度产生负面影响。SSL证书是保证网站安全连接的重要组成部分&#xff0c;它通过加密传输数据&#xff0c;确保用户与网站之间的信息传输安全可靠。然而&#xff0c;一旦SSL证书过期&#xff0c;可能会引发一系列问…

VM——绘制亮度均匀性曲线

1、需求:检测汽车内饰氛围灯的亮度均匀性,并绘制均匀性曲线 2、结果: 3、方法: 主要分为3步 (1)提取氛围灯ROI,忽略背景 (2)对提取到的ROI图进行切片处理,计算出每个切片的亮度均值 (3)绘制均匀性曲线 3.1 提取氛围灯ROI step1: 转成黑白图 step2:通过blob和…

北斗成为全球民航通用卫星导航系统

北斗成为全球民航通用卫星导航系统 日前&#xff0c;包含北斗卫星导航系统&#xff08;以下简称“北斗系统”&#xff09;标准和建议措施的《国际民用航空公约》附件10最新修订版正式生效。这标志着北斗系统正式加入国际民航组织&#xff08;ICAO&#xff09;标准&#xff0c;成…

【Flink】系统架构

DataStream API 将你的应用构建为一个 job graph&#xff0c;并附加到 StreamExecutionEnvironment 。当调用 env.execute() 时此 graph 就被打包并发送到 JobManager 上&#xff0c;后者对作业并行处理并将其子任务分发给 Task Manager 来执行。每个作业的并行子任务将在 task…

2023.11.19使用flask制作一个文件夹生成器

2023.11.19使用flask制作一个文件夹生成器 实现功能&#xff1a; &#xff08;1&#xff09;在指定路径上建立文件夹 &#xff08;2&#xff09;返回文件夹的路径和建立成功与否的提示 main.py import os from flask import Flask, request, jsonify, render_templateapp F…

【外汇天眼】交易之路:从无知到觉醒,揭秘成功交易员的五个成长阶段

世界顶尖交易员的成功背后隐藏的真正秘诀引人瞩目。许多人梦想着像电影中的主角一样&#xff0c;成为一名成功的金融交易员。尽管开设交易账户相对简单&#xff0c;但要达到稳定盈利的境界确实非常不容易。众所周知&#xff0c;在衍生品市场中&#xff0c;有80%甚至90%以上的交…