详解JavaScript的函数和方法

// 1、语法
function name([param[, param[, ... param]]]) { statements }

// 2、可以在函数声明之前调用函数，不会有语法问题
hoisted(); // "foo"

function hoisted() {
     console.log("foo");
}

// 语法
var myFunction = function name([param[, param[, ... param]]]) { statements }

// 匿名写法
var myFunction = function() {
    // statements
}
// 命名写法
var myFunction = function namedFunction(){
    // statements
}

// 使用实例
var foo = function() {}
foo.name // "foo"

var foo2 = foo
foo2.name // "foo"

var bar = function baz() {}
bar.name // "baz"

console.log(foo === foo2); //true
console.log(typeof baz);// undefined
console.log(bar === baz); // false (errors because baz == undefined)

// 在函数表达式之前调用函数，会有语法错误。
notHoisted(); // TypeError: notHoisted is not a function

var notHoisted = function() {
   console.log("bar");
};

// 法一：使用函数表达式创建
var myFunc;
if (num == 0){
  myFunc = function(theObject) {
    theObject.make = "Toyota"
  }
}

// 法二：使用 Function 对象创建
var x = 10;
function createFunction1() {
    var x = 20;
    return new Function('return x;'); // 这里的 x 指向最上面全局作用域内的 x
}

// 语法一
([param] [, param]) => { statements }
// 语法二
param => expression

var a = [
  "Hydrogen",
  "Helium",
  "Lithium",
  "Beryllium"
];
// 普通函数
var a2 = a.map(function(s){ return s.length });
console.log(a2); // logs [ 8, 6, 7, 9 ]

// 箭头函数
var a3 = a.map( s => s.length );
console.log(a3); // logs [ 8, 6, 7, 9 ]

// 使用实例
function resolveAfter2Seconds(x) {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve(x);
    }, 2000);
  });
}

var AsyncFunction = Object.getPrototypeOf(async function(){}).constructor;
var a = new AsyncFunction('a',
                          'b',
                          'return await resolveAfter2Seconds(a) + await resolveAfter2Seconds(b);');
a(10, 20).then(v => {
  console.log(v); // 4 秒后打印 30
});

// 1、参数默认值为 undefined
function multiply(a, b) {
  b = (typeof b !== 'undefined') ?  b : 1;
  return a*b;
}
multiply(5); // 5

// 2、使用默认参数重新上面函数
function multiply(a, b = 1) {
  return a*b;
}
multiply(5); // 5

// 1、语法
function(a, b, ...theArgs) {
  // ...
}

// 2、实例
function multiply(multiplier, ...theArgs) {
  return theArgs.map(x => multiplier * x);
}

var arr = multiply(2, 1, 2, 3);
console.log(arr); // [2, 4, 6]

function myConcat(separator) {
   var result = ''; 
   var i;

   for (i = 1; i < arguments.length; i++) {
      result += arguments[i] + separator;
   }
   return result;
}

myConcat(", ", "red", "orange", "blue");
// 结果： red, orange, blue, 

var obj = {
  foo: function() {
    /* code */
  }
};

// 用下面简写的方式代替上面
var obj = {
  foo() {
    /* code */
  }
};

// 用有属性名的语法定义方法（ES6之前）：
var obj2 = {
  g: function*() {
    var index = 0;
    while(true)
      yield index++;
  }
};

// 同一个方法，简写语法：
var obj2 = {
  * g() {
    var index = 0;
    while(true)
      yield index++;
  }
};

var it = obj2.g();
console.log(it.next().value); // 0
console.log(it.next().value); // 1

// 用有属性名的语法定义方法（ES6之前）：
var obj3 = {
  f: async function () {
    await some_promise;
  }
};

// 同一个方法，简写语法：
var obj3 = {
  async f() {
    await some_promise;
  }
};

var obj4 = {
  f: async function* () {
    yield 1;
    yield 2;
    yield 3;
  }
};

// 同一个方法，简写语法：
var obj4 = {
  async* f() {
   yield 1;
   yield 2;
   yield 3;
  }
};

if ('function' === typeof window.noFunc) {
   // use noFunc()
 } else {
   // do something else
 }