function name(parameters) {
    // code_block
}

var funExp = function(parameter) {
  // 函数体
};

function sayHi() {   // 声明函数
  alert( "Hello" );
}

let func = sayHi;    // 将函数进行复制，因此变量 func 也是存储着一个函数

// 两者均可运行
func();   // Hello
sayHi();   // Hello

let funResult = sayHi();   // 将函数运行结果进行复制
// 变量 funResult 存储的是一个字符串 "Hello"
funcResult   // Hello

// 函数表达式行为也类似，只是通过变量名调用
let sayHi = function() {
  alert( "Hello" );
};

let func = sayHi;
// ...

sayHi("John"); // Hello, John

// 函数声明 sayHi 是在 JavaScript 准备运行脚本时被创建的
// 因此运行时该函数在这个脚本的任何位置都可见
function sayHi(name) {
  alert( `Hello, ${name}` );
}

// 函数表达式的创建和调用顺序颠倒会报错
sayHi("John"); // error!

let sayHi = function(name) {  // (*) no magic any more
  alert( `Hello, ${name}` );
};

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

// 在代码块之外定义变量
let welcome;

if (age < 18) {
  welcome = function() {   // 代码块内创建函数表达式
    alert("Hello!");
  };
} else {
  welcome = function() {   // 代码块内创建函数表达式
    alert("Greetings!");
  };
}

welcome(); // 在代码块外仍可运行该函数表达式

// 箭头函数存储在变量中
let func = arg => expression

// 参数列表中只有一个参数
const greet = name => `Hello ${name}!`;
greet("Ben"); // Hello Ben!

// 空参数列表需要括号
const sayHi = () => console.log('Hello Ben!');
sayHi(); // Hello Ben!

// 多个参数需要括号
const orderIceCream = (flavor, cone) => console.log(`Here's your ${flavor} ice cream in a ${cone} cone.`);
orderIceCream('chocolate', 'waffle'); // Here's your chocolate ice cream in a waffle cone.

// 构造函数
function IceCream() {
    this.scoops = 0;
}

// 为 IceCream 添加 addScoop 方法
IceCream.prototype.addScoop = () => { // addScoop 是一个箭头函数
  setTimeout(() => { // setTimeout 的回调函数为箭头函数
    this.scoops++;
    console.log('scoop added!');
  }, 0.5);
};

const dessert = new IceCream();
dessert.addScoop(); // NaN

function defer(f, ms) {
  return function() {
    setTimeout(() => f.apply(this, arguments), ms)
  };
}

function sayHi(who) {
  alert('Hello, ' + who);
}

let sayHiDeferred = defer(sayHi, 2000);
sayHiDeferred("John"); // 2 秒后显示：Hello, John

// 不使用箭头函数需要额外的变量存储上下文和剩余参数
function defer(f, ms) {
  return function(...args) {
    let ctx = this;
    setTimeout(function() {
      return f.apply(ctx, args);
    }, ms);
  };
}

// 构建 Car 类
// 接受一个参数
var Car = function(loc) {
    // 创建属性 loc 以记录 Car 位置
    var obj = {
        loc: loc
    };
    // 创建方法 move 以实现 Car 移动
    obj.move = function() {
        obj.loc++;
    };
    // 返回对象，即返回该类的实例
    return obj;
};

// 实例化，调用构造函数创建实例
var ben = Car(9);

var Car = function(loc) {
    var obj = {
        loc: loc
    };
    // 通过遍历将 methods 中存储的方法都绑定到类/对象
    extend(obj, Car.methods);
    return obj;
};

Car.methods = {
    move: function() {
        this.loc++;
    }
};

function pow(x, n) {
  if (n == 1) {
    return x;
  } else {
    return x * pow(x, n - 1);   // 递归，自调用
  }
}

alert( pow(2, 3) ); // 8

// 递归形式更简短，当需要耗费内存记录执行上下文
function pow(x, n) {
  return (n == 1) ? x : (x * pow(x, n - 1));
}

// 循环结构更节省性能，内存仅记录了一个上下文，包含参数 i 和 result
function pow(x, n) {
  let result = 1;
  // 再循环中，用 x 乘以 result n 次
  for (let i = 0; i < n; i++) {
    result *= x;
  }
  return result;
}

alert( pow(2, 3) ); // 8

// 一个对象，其属性值由对象或数组构成
// 需要遍历其中所有数组，并将 salary 求和
let company = {
  sales: [{name: 'John', salary: 1000}, {name: 'Alice', salary: 1600 }],
  development: {
    sites: [{name: 'Peter', salary: 2000}, {name: 'Alex', salary: 1800 }],
    internals: [{name: 'Jack', salary: 1300}]
  }
};

// 利用递归来求和
function sumSalaries(department) {
  if (Array.isArray(department)) { // 情况（1）如果属性是数组，直接读取
    return department.reduce((prev, current) => prev + current.salary, 0); // 求数组的和
  } else { // 情况（2）
    let sum = 0;
    for (let subdep of Object.values(department)) {
      sum += sumSalaries(subdep); // 递归调用所有子部门，对结果求和
    }
    return sum;
  }
}

alert(sumSalaries(company)); // 7700

// 使用剩余参数收集所有传递进来的实参
function sumAll(...args) {
  let sum = 0;
  for (let arg of args) sum += arg;
  return sum;
}

alert( sumAll(1) ); // 1
alert( sumAll(1, 2) ); // 3
alert( sumAll(1, 2, 3) ); // 6

// 使用剩余参数截取入参的部分
function showName(firstName, lastName, ...titles) {
  alert( firstName + ' ' + lastName ); // Julius Caesar

  // 剩余的参数被放入 titles 数组中
  // i.e. titles = ["Consul", "Imperator"]
  alert( titles[0] ); // Consul
  alert( titles[1] ); // Imperator
  alert( titles.length ); // 2
}

showName("Julius", "Caesar", "Consul", "Imperator");

let arr = [3, 5, 1];
alert( Math.max(...arr) );   // 5（spread 语法把数组转换为参数列表）

// 可以向函数传递多个可迭代对象，并分别使用展开运算符合成一个参数列表
let arr1 = [1, -2, 3, 4];
let arr2 = [8, 3, -8, 1];
alert( Math.max(...arr1, ...arr2) );   // 8

// 利用闭包创建一个计数器
function makeCounter() {
  let count = 0;

  return function() {
    return count++;
  };
}

let counter = makeCounter();

alert( counter() ); // 0
alert( counter() ); // 1
alert( counter() ); // 2

let func = new Function([arg1, arg2, ...argN], functionBody);

let str = ... 动态地接收来自服务器的代码 ...

let func = new Function(str);
func();

new Function('a', 'b', 'return a + b');   // 基础语法
new Function('a,b', 'return a + b');   // 逗号分隔
new Function('a , b', 'return a + b');   // 逗号和空格分隔

// 使用 new Function 创建的函数不能访问其外部函数的变量
function getFunc() {
  let value = "test";
  let func = new Function('alert(value)');
  return func;
}

getFunc()();   // error: value is not defined

// 一般函数可以访问其外部函数的变量
function getFunc() {
  let value = "test";
  let func = function() { alert(value); };
  return func;
}

getFunc()();   // "test"，从 getFunc 的词法环境中获取的

let user = {
  firstName: "John",
  sayHi() {
    alert(`Hello, ${this.firstName}!`);
  }
};

setTimeout(user.sayHi, 1000); // Hello, undefined!，对象的方法作为回调函数传递，丢失了上下文，严格模式下 this=undefined

let user = {
  firstName: "John",
  sayHi() {
    alert(`Hello, ${this.firstName}!`);
  }
};

// 使用包装器，对象方法不需要作为回调函数（源代码）进行传递，而是直接调用，那么它就可以从外部词法环境中获取 user
setTimeout(function() {
  user.sayHi();   // Hello, John!
}, 1000);

// 使用箭头函数更简短
setTimeout(() => user.sayHi(), 1000);   // Hello, John!

let boundFunc = func.bind(context);

let user = {
  firstName: "John",
  sayHi() {
    alert(`Hello, ${this.firstName}!`);
  }
};

let sayHi = user.sayHi.bind(user); // (*)

// 可以在没有对象（即与对象分离）的情况下运行它
sayHi(); // Hello, John!

setTimeout(sayHi, 1000); // Hello, John!

// 即使 user 的值在不到 1 秒内发生了改变
// sayHi 还是会使用预先绑定（pre-bound）的值
user = {
  sayHi() { alert("Another user in setTimeout!"); }   // Hello, John!
};