function sayHi() {
alert("Hello");
}
let sayHi = function() {
alert("Hello");
};
alert(sayHi); // 显示函数源码
let func = sayHi;
function ask(question, yes, no) {
if (confirm(question)) yes();
else no();
}
function showOk() {
alert("You agreed.");
}
function showCancel() {
alert("You canceled the execution.");
}
ask("Do you agree?", showOk, showCanecl);
ask
的两个参数值 showOk
和 showCancel
可以被称为 回调函数 或简称 回调。
主要思想是我们传递一个函数,并期望在稍后必要时将其“回调”。在我们的例子中,showOk
是回答 “yes”
的回调,showCancel
是回答 “no”
的回调。
function ask(question, yes, no) {
if (confirm(question)) yes()
else no();
}
ask(
"Do you agree?",
function() { alert("You agreed."); },
function() { alert("You canceled the execution."); }
);
这里直接在 ask(...)
调用内进行函数声明。这两个函数没有名字,所以叫 匿名函数。这样的函数在 ask
外无法访问(因为没有对它们分配变量),不过这正是我们想要的。
// 函数声明
function sum(a, b) {
return a + b;
}
// 函数表达式
let sum = function(a, b) {
return a + b;
};
函数表达式是在代码执行到达时被创建,并且仅从那一刻起可用。
一旦代码执行到赋值表达式 let sum = function…
的右侧,此时就会开始创建该函数,并且可以从现在开始使用(分配,调用等)。
在函数声明被定义之前,它就可以被调用。
// right
sayHi("John"); // Hello, John
function sayHi(name) {
alert( `Hello, ${name}` );
}
// error
sayHi("John"); // error!!!
let sayHi = function(name) {
alert(`Hello, ${name}`);
};
在大多数情况下,当我们需要声明一个函数时,最好使用函数声明,因为函数在被声明之前也是可见的。这使我们在代码组织方面更具灵活性,通常也会使得代码可读性更高。
所以,仅当函数声明不适合对应的任务时,才应使用函数表达式。
let func = (arg1, arg2, ..., argN) => expression;
// 等价于下面的代码
let func = function(arg1, args2, ..., argN) {
return expression;
};
let sum = (a, b) => a + b;
/* 这个箭头函数是下面这个函数的更短的版本:
let sum = function(a, b) {
return a + b;
};
*/
alert( sum(1, 2) ); // 3
let double = n => n * 2;
let sayHi = () => alert("Hello!");
sayHi();
用花括号括起来之后,需要包含 return
才能返回值(就像常规函数一样)。
let sum = (a, b) => {
let result = a + b;
return result;
};
alert(sum(1, 2));
箭头函数对于简单的操作很方便,特别是对于单行的函数。 它具体有两种形式:
(...args) => expression
—— 右侧是一个表达式:函数计算表达式并返回其结果。如果只有一个参数,则可以省略括号,例如 n => n*2
。(...args) => { body }
—— 花括号允许我们在函数中编写多个语句,但是我们需要显式地 return
来返回一些内容。评论区高手补充