🌞函数声明
-
使用 函数声明 创建函数。
-
function
关键字首先出现,然后是 函数名,然后是括号之间的 参数 列表(用逗号分隔,在上述示例中为空),最后是花括号之间的代码(即“函数体”)。
function showMessage() {
alert( 'Hello everyone!' );
}
- 调用
showMessage()
执行函数的代码。
🌞局部变量
- 在函数中声明的变量只在该函数内部可见。
function showMessage() {
let message = "Hello, I'm JavaScript!"; // 局部变量
alert( message );
}
showMessage(); // Hello, I'm JavaScript!
alert( message ); // <-- 错误!变量是函数的局部变量
-
函数对外部变量拥有全部的访问权限。函数也可以修改外部变量。
-
只有在没有局部变量的情况下才会使用外部变量。
如果在函数内部声明了同名变量,那么函数会 遮蔽 外部变量。
-
任何函数之外声明的变量,都被称为 全局 变量。
🌞参数
我们可以使用参数(也称“函数参数”)来将任意数据传递给函数。
👀【例子】我们有一个变量 from
,并将它传递给函数。请注意:函数会修改 from
,但在函数外部看不到更改,因为函数修改的是复制的变量值副本:
function showMessage(from, text) {
from = '*' + from + '*'; // 让 "from" 看起来更优雅
alert( from + ': ' + text );
}
let from = "Ann";
showMessage(from, "Hello"); // *Ann*: Hello
// "from" 值相同,函数修改了一个局部的副本。
alert( from ); // Ann
🌞默认值
如果未提供参数,那么其默认值则是 undefined
。
比如上面的例子showMessage(from,text)
可以只使用一个参数调用:showMessage("Ann")
,输出*Ann*:undefined
💧后备的默认参数
有些时候,将参数默认值的设置放在函数执行(相较更后期)而不是函数声明的时候,也能行得通。
-
为了判断参数是否被省略掉,我们可以拿它跟
undefined
做比较:function showMessage(text) { if (text === undefined) { text = 'empty message'; } alert(text); } showMessage(); // empty message
-
或者我们可以使用
||
运算符:// 如果 "text" 参数被省略或者被传入空字符串,则赋值为 'empty' function showMessage(text) { text = text || 'empty'; ... }
-
现代 JavaScript 引擎支持空值合并运算符
??
,当可能遇到其他假值时它更有优势,如0
会被视为正常值不被合并:// 如果没有传入 "count" 参数,则显示 "unknown" function showCount(count) { alert(count ?? "unknown"); } showCount(0); // 0 showCount(null); // unknown showCount(); // unknown
🌞返回值
函数可以将一个值返回到调用代码中作为结果。
指令 return
可以在函数的任意位置。当执行到达时,函数停止,并将值返回给调用代码。
只使用 return
但没有返回值也是可行的。但这会导致函数立即退出。
⚠空值的 return
或没有 return
的函数返回值为 undefined
如果函数无返回值,它就会像返回 undefined
一样:
function doNothing() { /* 没有代码 */ }
alert( doNothing() === undefined ); // true
空值的 return
和 return undefined
等效:
function doNothing() {
return;
}
alert( doNothing() === undefined ); // true
🌞函数命名
函数就是行为(action)。所以它们的名字通常是动词。它应该简短且尽可能准确地描述函数的作用。
"get…"
—— 返回一个值,"calc…"
—— 计算某些内容,"create…"
—— 创建某些内容,"check…"
—— 检查某些内容并返回 boolean 值,等。
📖练习
📘使用 ‘?’ 或者 ‘||’ 重写函数
如果参数 age
大于 18
,那么下面的函数返回 true
。
否则它将会要求进行确认,并返回确认结果:
function checkAge(age) {
if (age > 18) {
return true;
} else {
return confirm('Do you have your parents permission to access this page?');
}
}
重写这个函数并保证效果相同,不使用 if
,且只需一行代码。
编写 checkAge
的两个变体:
-
使用问号运算符
?
function checkAge(age) { return (age > 18) ? true : confirm('Did parents allow you?'); }
-
使用或运算符
||
function checkAge(age){ return (age>18) || confirm('Did parents allow you?'); }
📘函数min(a,b)
写一个返回数字 a
和 b
中较小的那个数字的函数 min(a,b)
。
function min(a,b){
if(a>b){
return b
}else{
return a
}
}
P.S. 在 a == b
的情况下,返回什么都无关紧要。
📘函数pow(x,n)
写一个函数 pow(x,n)
,返回 x
的 n
次方。换句话说,将 x
与自身相乘 n
次,返回最终结果。
function pow(x, n) {
let result = x;
for (let i = 1; i < n; i++) {
result *= x;
}
return result;
}
let x = prompt("x?", '');
let n = prompt("n?", '');
if (n < 1) {
alert(`Power ${n} is not supported, use a positive integer`);
} else {
alert( pow(x, n) );
}