推荐|Javascript编程基础

Javascript编程基础 – 函数入门

JavaScript Programming Essentials – Beginning of Functions

1. 数学函数

1) 数学函数的定义

说起函数，首先令我们想到的是数学里的函数，通常，会用类似下面的简单的等式来表达变量x和函数值y的关系：

y = f(x)

至于变量x如何运算，通常什么公式得到y，依据各种各样的算法逻辑。

例如，如果计算一个数的平方，那么上述公式变为：y = x * x。

在这个数学函数中，f是函数名，x和y可以是任意的数字，其定义非常简单，但也包含了几个关键点：

函数必须总是接受一个参数；
函数必须总是返回一个值；
函数应该依据接收到的参数（例如X）来运行，而不是外部环境来运行；
对于给定的参数X，函数只输出唯一的一个Y。

2) 数学函数的引申

每个函数都关联一个输入和一个输出。
这就像一台机器。例如：计算机，使用键盘和鼠标输入，而用显示器和音箱等来输出一样。

示例： 我们用一个被乘数作为输入，一个乘以2作为规则（也就是关系），可以有一系列的输出，如下表：

在这里插入图片描述
当输入值变为1024时，输出值为2048，以此类推。

2. JavaScript函数式编程

JavaScript语言并未因函数而诞生，也不是纯粹的函数式编程语言，但是它具有广泛的函数式编程的特点，可以使用函数来做大量有效的工作；而函数式编程恰恰要基于数学函数和它的思想。

JavaScript编程语言中，函数的用途是执行特定任务的代码块。所谓特定任务，就是上边提到的特定的计算方法或者逻辑。

当有任何“某物”调用它的时候，将执行这个函数；如果没有调用，那么它将不被执行，也不消耗内存。

示例：

例如，下方的函数计算并返回两个数的乘法值：

function myFunction(n1, n2) {
	    Return n1 * n2;
}

3. JavaScript函数语法

根据上面的示例，我们来看看函数的语法。

JavaScript 函数需要使用 function 关键字定义，后面紧跟函数名称（用户按照需要命名）；函数名后跟括号（）。

1) 函数名称。

函数名称可以包含字母、数字、下划线和美元符号（与变量的规则相同）。
括号可以包含用逗号分隔的参数名称：
（参数 1、参数 2 等）

2）代码块

函数要执行的代码放在大括号内：{}；大括号内的语句都属于这个代码块。
在代码块内声明的变量，作用域仅限于这个代码块。

3）函数的参数

函数参数列在函数定义的括号()内；参数可以是一个，也可以是多个，如下示例：

function name(parameter1, parameter2, parameter3) {
  // 需要执行的代码
}

函数参数是函数在调用时接收的值。未调用的参数为形式参数，实际调用使用的参数为实际参数。

在函数内部，参数（参数）表现为局部变量。

4. JavaScript函数调用

当调用函数时，函数内的代码将执行（按照语句的先后顺序执行）。

当事件发生时，例如：当用户单击按钮时；
从JavaScript代码调用它时；
自动地自调用

示例：

完成两个变量a, b 的平方和函数，并调用它，代码如下：

function quadraticSum(a, b) {
	return a * a + b * b;
}
var value = quadraticSum(2, 3);
console.log(value);

执行结果如下图所示：

在这里插入图片描述

5. JavaScrip函数的返回值

函数的return语句：当 JavaScript 到达 return 语句时，该函数将停止执行。
如果该函数是从语句调用的，则 JavaScript 将返回以在调用语句之后执行代码。

函数通常计算返回值。返回值将被返回给调用者：

示例代码如下:（计算两个数字的乘积，并且返回结果）

// 函数一旦调用，返回值将赋给x
let x = myFunction(4, 3);

function myFunction(a, b) {
// 函数返回a与b的乘积
  return a * b;
}

全部代码执行结果如下图所示：

在这里插入图片描述

6. （）操作符

在函数中，括号 () 操作符用来调用函数。

示例代码如下：（将华氏度转换成摄氏度）

function toCelsius(fahrenheit) {
// 返回摄氏度的计算结果
  return (5/9) * (fahrenheit-32);
}
// 调用函数，将华氏度77转换成摄氏度，同时赋给变量value
let value = toCelsius(77);

console.log(value);

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

Javascript函数是非常重要的部分，本文是个开端，后续还会有函数进阶的文章。

总之，技术好文不断推出，敬请关注。

喜欢就点赞哈。?