函数

函数声明：

function sayHi() {
  alert( "Hello" );
}

函数表达式：

let sayHi = function() {
  alert( "Hello" );
};

函数名后面没有没有括号，函数是不会运行的。　

这里可能有个疑问，为什么函数表达式结尾有一个 ;，而函数声明没有：

function sayHi() {
  // ...
}

let sayHi = function() {
  // ...
};

• 在代码块的结尾是不需要 ;，像 if { ... }，for { }，function f { } 等语法结构后面都不用加。
• 函数表达式通常这样声明： let sayHi = ...;，作为一个变量。 而不是代码块。不管什么值，建议在语句结尾处建议使用分号 ;。所以这里的分号与函数表达式本身没有任何关系，它只是终止了语句。

回调函数

我们写一个包含三个参数的函数 ask(question, yes, no)：

question

question 文本

yes

当回答 “Yes” 时候运行的脚本

no

当回答 “No” 时候运行的脚本

function ask(question, yes, no) {
  if (confirm(question)) yes()
  else no();
}

function showOk() {
  alert( "You agreed." );
}

function showCancel() {
  alert( "You canceled the execution." );
}

// usage: functions showOk, showCancel are passed as arguments to ask
ask("Do you agree?", showOk, showCancel);

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 外无法访问（因为没有分配变量）。

函数表达式 vs 函数声明

细微差别是在 JavaScript 引擎中在什么时候创建函数。

函数表达式在执行到达时创建并可用。

一旦执行到右侧分配 let sum = function…，就会创建并可以使用(复制，调用等)。

函数声明则不同。

函数声明可用于整个脚本/代码块。

换句话说，当 JavaScript 准备运行脚本或代码块时，它首先在其中查找函数声明并创建函数。我们可以将其视为“初始化阶段”。

在处理完所有函数声明后，执行继续。

因此，声明为函数声明的函数可以比定义的更早调用。

 

let age = prompt("What is your age?", 18);

let welcome;

if (age < 18) {

  welcome = function() {
    alert("Hello!");
  };

} else {

  welcome = function() {
    alert("Greetings!");
  };

}

welcome(); // ok now
//----------------------------
let age = prompt("What is your age?", 18);

let welcome = (age < 18) ?
  function() { alert("Hello!"); } :
  function() { alert("Greetings!"); };

welcome(); // ok now

　　

箭头函数

let func = (arg1, arg2, ...argN) => expression

　　

let sum = (a, b) => a + b;

/* 箭头函数更短：

let sum = function(a, b) {
  return a + b;
};
*/

alert( sum(1, 2) ); // 3
//-----------------------------------------------------
//如果我们只有一个参数，那么括号可以省略，甚至更短：

 // same as
// let double = function(n) { return n * 2 }
let double = n => n * 2;

alert( double(3) ); // 6

let sum = (a, b) => a + b;

/* 箭头函数更短：

let sum = function(a, b) {
  return a + b;
};
*/

alert( sum(1, 2) ); // 3

//----------------------------------------

let sayHi = () => alert("Hello!");

sayHi();

 

总结

• 函数是值。他们可以在代码的任何地方分配，复制或声明。
• 如果函数在主代码流中声明为单独的语句，那就称为函数声明。
• 如果该函数是作为表达式的一部分创建的，则称其为函数表达式。
• 函数声明在代码块执行之前处理。它们在代码块中随处调用。
• 函数表达式在执行流程到时创建。

在大多数情况下，当我们需要声明一个函数时，函数声明是可取的，因为它在声明本身之前是可见的。这给了我们更多的代码组织的灵活性，并且通常更具可读性。

所以我们应该只在函数声明不适合任务时才使用函数表达式。在本章中我们已经看到了几个例子，并且将来会看到更多的例子。

箭头函数非常适合单行调用，以下是其两个特点。

1. 没有大括号：(...args) => expression — 右侧是一个表达式：该函数对其进行运行并返回结果。
2. 有大括号：(...args) => { body } — 括号允许我们在函数中写入多个语句，但是我们需要一个显式的 return 来返回一些东西。

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."); }
);
//----------------
function ask(question, yes, no) {
  if (confirm(question)) yes()
  else no();
}

ask(
  "Do you agree?",
  () => alert("You agreed."),
  () => alert("You canceled the execution.")
);
//--------------------
let questin=confirm("Do you agree?");
let ask=(question)? ()=>alert("You agreed.") : ()=>alert("You canceled the execution.");