百度官网推广平台,宁波seo排名优化平台,编程培训机构名字,微商软文推广平台JavaScript#xff1a;函数 函数的作用函数的声明和调用函数声明函数调用函数重复声明 函数传参传参语法参数默认值与参数数量问题传参数量过多传参数量太少参数默认值 函数的返回值函数表达式匿名函数立即执行函数 函数的作用
在我们编程过程中#xff0c;会出现一种情况函数 函数的作用函数的声明和调用函数声明函数调用函数重复声明 函数传参传参语法参数默认值与参数数量问题传参数量过多传参数量太少参数默认值 函数的返回值函数表达式匿名函数立即执行函数 函数的作用
在我们编程过程中会出现一种情况我们在多处需要用到同样的一串代码那么此时将这样的一段代码重复写多次就会十分冗余。此时我们就可以将其放到一个函数里面在需要时我们只需要引用这个函数就相当于执行了函数内部的代码。 函数可以理解为一个特定的代码块容器它可以完成特定的需求并且可以重复使用。 如果还是不能理解不妨继续看下去用着用着就理解了。 函数的声明和调用
函数声明
函数的声明过程其实就是将这样一串代码放到一个可以重复使用的盒子中的过程。 声明语法
function 函数名() {函数体
}函数声明有三个基本部分分别是关键字function,函数名和函数体。 关键字 这个关键字function用于告诉浏览器此处后面的一段代码正在声明一段函数。 函数名 由于我们在编程时往往不止把一段代码放到函数中而是会需要多个函数此时为了区分开不同的函数我们要给每个函数取一个名字。 函数体 函数体就是我们需要封装的代码每当调用这个函数我们函数体内的代码就会执行。 以下面的代码为例
function sayHi() {document.write(hi!!);document.write(hi!!);document.write(hi!!!);
}以上代码中function是函数关键字代表函数的声明sayHi是函数名三句document.write(hi!!);是函数体。 在后续调用函数时就会执行三次document.write(hi!!);。 函数调用
我们已经把代码放进了一个可以重复使用的函数中那我们要如何使用这个函数 这就涉及到函数的调用了 调用语法函数名()。 函数的调用只需要在函数名后面加一对小括号即可。 调用之后函数内的代码就会执行一次如果我们想要调用刚刚的sayHi函数那么就是sayHi();此处末尾的引号可有可无。
示例 当我们想要重复调用那就多写几次调用语句比如我想要写九个”Hi!!!“就调用三次函数 函数重复声明
函数的重复声明是指两个函数使用了同一个函数名这就会导致浏览器无法搞清楚调用函数时调用哪一个在很多其它编程语言中会直接禁止两个函数用一个函数名的做法。但是在JavaScript中是允许的 在JavaScript中当两个函数使用了同一个函数名会执行后一个函数的函数体。 示例 在此我声明了两个sayHi函数第一个函数输出三个Hi第二个函数输出一个Hi。 由于只输出一个Hi的函数在后面不论在何处调用此函数都只输出一个Hi了。 函数传参
函数的功能其实远远不止复用一段代码这么单调它其实还可以在每次复用代码的时候处理的数据不同。 比如我们刚刚的sayHi函数我们是否可以来指定输出几次Hi呢通过函数传参我们可以实现这个功能。 传参的过程其实就是给函数内部数据的过程就好比如炒菜给厨子西红柿和鸡蛋就可以得到一盘西红柿炒蛋我们也可以给厨子青椒和猪肉得到青椒炒肉。 这里的函数就好比厨子而食材就是我们的数据。
传参语法
function 函数名(参数) {函数体
}相比于刚刚的基本结构我们的参数需要放在括号里面这就是我们给函数的参数或者说是数据。这个参数在函数内部可以随意使用接下来我们以刚刚的sayHi函数为例
function sayHi(n) {for (let i 0; i n; i){document.write(Hi!!!);}}在我们的改版函数中我们将输出Hi的语句放在了一个循环中循环的次数由n来决定而n是一个参数是由外部传入的数据我们想输出几次Hi外部就传入数字几。 那么我们要怎么传入这个数据呢我们只需要在调用的时候把数据传进去这个过程称为传参。 传参语法函数名(参数)。 我们只需要在调用函数的时候把我们对应的数据放在括号里面即可。 示例 我们在调用函数时传入了数字5此时我们的Hi就输出了5次这就是传参的作用。 函数的参数是可以有无数多个的在面对多个参数我们在声明时用逗号隔开每个参数在调用时也用逗号隔开每个传入的数据。 比如我们要用一个函数来实现加法
function sum(x, y) {document.write(x y);}我们执行加法需要两个数据此处的两个数据xy就要用逗号隔开。 如果我们想得到1 2的结果传参语法就是sum(1,2);用一个逗号将两个参数隔开。 参数默认值与参数数量问题
如果我们传参的时候传入的参数和函数需要的参数个数不一样会发生什么 这分两种情况
传参数量过多
当传入的参数数目大于函数需要的数目那么函数在接收参数时只接收前几个参数后面超出的参数全部被忽略。 示例 我们在对sum的加法传参时sum只需要两个参数但是我们传入了五个参数此时函数只取前两个参数12而后面的三个参数全部被忽略了。
传参数量太少
当我们传入的参数数目太少了此时就会启用参数的默认值什么是默认值我们先来讲解一下参数默认值
参数默认值
参数是可以设置默认值的当我们传入参数过少的时候就会启用默认值。 设置默认值语法
function 函数名(参数 默认值) {函数体
}为参数设置默认值只需要在声明参数的时候参数 默认值即可。 示例 我们在现在为sum函数设置了x的默认值为3y的默认值为5。我们后续调用sum函数时一个参数也没有传入此时参数就取默认值完成了 3 5 8。
如果不设置默认值参数的默认是就是undefined。
以上就为大家介绍完了参数的默认值。现在回到传参数目不足的问题上 刚刚为大家演示的都是一个参数都不传的情况如果我们传参传一半又会咋样 答案是有几个能用的参数就用几个参数不够的参数取默认值。 示例 我们在传参时只传入了一个参数而sum函数需要三个参数此时传入的第一个参数就代替了函数的第一个参数x而后续的yz两个参数由于没有被传入参数采取了默认值。于是输出9(传入的参数)2(y默认值)8(z默认值)。 函数的返回值
什么是函数的返回值 我们刚刚以厨子做菜解释了函数的参数问题我们以同样的例子来讲解返回值。当厨子炒好了菜就应该把菜端出来给客户吃客户得到这盘菜的过程就是函数返回的过程。
刚刚的sum函数我们在将数据加完之后能不能让函数的外部得到这个加好的值呢是可以的此时就需要用到return关键字。 返回语法
function 函数名(参数 默认值) {函数体return 返回值;
}函数的返回值需要放在return关键字后面这样函数就会把return后面的数据返回给函数的外面。 我们来完善一下sum函数的返回值
function sum(x, y, z) {let a x y z;return a;}我们将a作为返回值返回而a就是xyz的和这样我们就可以在函数外面得到三个数字的和了。 那么函数外面要如何得到这个返回的值嘞 只需要用一个变量来接收即可let b sum(参数)这样b就可以得到这个返回值了。 实验一下 可以看到b最后的值就是456之和。 函数表达式
函数表达式是指将一个函数的声明过程赋值给一个变量。 比如这样 在声明sum函数的同时让a等于这个函数注意我们之前在讲返回值的时候变量赋值的是调用结果而这里是赋值声明结果。以上一整段代码就称为一个函数表达式。 使用函数表达式后我们可以通过变量名称来调用函数 这里我们成功通过a来调用了这个函数那么我们再试试能不能通过函数原名sum来调用 我们发现函数原名sum居然不能用了这个过程就好比一个函数的改名过程当这个函数被赋值给了a那么sum就不再是它的函数名了a才是它的函数名。那原本这个函数名不就没有意义了吗所以一般在使用函数表达式时会使用匿名函数接下来讲解匿名函数是什么 匿名函数
我们至此已经讲完了函数的主体结构的五大要素关键字函数名参数函数体返回值
function 函数名(参数 默认值) {函数体return 返回值;
}前面已经讲解返回值和参数都是可以省略的除此之外函数的名字也是可以省略这样的函数称为匿名函数。语法如下function () {}此处同时省略了返回值和参数便于讲解。 尝试创建一个匿名函数 发现这个函数报错了因为这个函数没有名字创建了之后无法调用这一大串代码毫无意义。所以我们此时就需要函数表达式来为其命名 报错消失了这个语法是正确的匿名函数的使用一般都要搭配函数表达式来使用或者将这个函数作为其它函数的参数总之就是要保证这个函数虽然是匿名的但是依然会被调用那么这个函数就可以匿名。 立即执行函数
我们先前的所有函数在声明的时候都是不会发生调用的只有后续对其调用函数才会执行。JavaScript在此提供了两种语法让函数在声明的同时就立刻执行一次 语法(function 函数名(){ })();或(function 函数名(){ }());。 我们来解析一下这个语法 首先两个语法中都有相同的部分function 函数名(){ }这就是一个函数的声明过程。 先解析前者我们刚刚已经拆分出了函数声明那么前者的语法就可以被简化为(函数声明)()这个语法先将函数声明放在一个小括号中在后面再追加了一对小括号看到后面这对小括号不知你是否能联想到一般的函数调用过程函数名()就是在函数名末尾追加一个小括号此处就是把前面的整个函数声明过程用小括号括起来当作了函数名然后对其调用。于是函数在声明时就会立即执行一次。 对于后者其就可以拆分为(函数声明());其实原理大概是一致的这里就不额外解析了因为在实战中这种方法可读性没有前者好不常使用。
实验其功能 在上面这个立即执行函数中红色框内是函数声明满足(函数声明)()结构于是它立刻执行了一次完成了123 6的加法过程。 那么我们是否可以对立即执行函数传参呢也是可以的我们在一般函数调用过程参数是这样的函数名(参数)。对比于立即执行函数那么就应该这样传参(函数声明)(参数)。 再实验一次 可以看到这个立即执行函数完成了传入参数4 5 6 15的过程。
那么立即执行函数的函数名可以省略吗 这也是可以的我们先前在讲解匿名函数的时候提到了匿名函数的准则要保证这个函数虽然是匿名的但是依然会被调用那么这个函数就可以匿名。 此处我们将函数匿名后会立刻调用一次所以该函数是可以匿名的 示例 可以看到我们删掉函数的名字使其称为匿名函数后它依然可以正常执行。
