function fn(x,y){return x+y}
fn = function(x,y){return x+y}
fn = function f(x,y){return x+y}
f = new Function('x','y','return x+y')
fn = (x,y) => { return x+y }
fn = (x,y) => x+y
// 箭头函数不能有名字，都是匿名的

//函数的调用
function fn(x,y){
    return x+y  
}
fn.call(undefined,1,2) //3
fn(1,2) //3

普通模式下，this指向window，fn(window,arguments)第一个参数是window，后面的参数是arguments伪数组，如下图：

image.png

严格模式下，this不是window，而是undefined所在的位置的值，也就是undefined的位置是什么值，this就是什么值，fn(this,arguments)第一个参数是this，后面的参数是arguments伪数组，如下图：

image.png

调用栈 call stack

//递归调用
function sum(n){
    if(n==1){
        return 1
    }else{        
        return n+sum.call(undefined,n-1)
    }
}
sum.call(undefined,5) // 15
//解析过程
// 5 + sum(4)
// 5 + 4 + sum(3)
// 5 + 4 + 3 + sum(2)
// 5 + 4 + 3 + 2 + sum(1)
// 5 + 4 + 3 + 2 + 1

// 嵌套调用
function a(){
    console.log('a1')
    b.call()
    console.log('a2')
  return 'a'  
}
function b(){
    console.log('b1')
    c.call()
    console.log('b2')
    return 'b'
}
function c(){
    console.log('c')
    return 'c'
}
a.call()
//执行结果如下：
// a1
// b1
// c
// b2
// a2

    function f1() {
        console.log(this) // 第一个 this
        function f2() {
            console.log(this) // 第二个 this
        } f2.call()
    }
    var obj = { name: 'obj' }
    f1.call(obj)
// {name: "obj"}
// Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …}

/* 
- 每个函数都有自己的 this
- this 就是 call 的第一个参数，第一个 this 对应的 call 是 f1.call(obj)，第二个 this 对应的 call 是 f2.call()
- this 和 arguments 都是参数，参数都要在函数执行（call）的时候才能确定
*/

如何调用函数
f.call(asThis, input1,input2)
其中 asThis 会被当做 this，[input1,input2] 会被当做 arguments

this 和 arguments
function f(){
    'use strict'
    console.log(this)
    console.log(arguments)
    return undefined
}
f.call(1,2,3) // this 为 1，arguments 为 [2,3]

立即调用

释义：声明一个函数并立即调用这个函数
目的：创建一个独立的作用域，也就是可以使用到局部变量，作用域外面访问不到这个变量，避免变量污染
原因：1.全局变量不好用，容易被覆盖 2.如果需要使用局部变量，那么必须要有一个函数

//方法1
(function(){
    console.log(123)
}.call())

//方法2
(function(){
    console.log(123)
}())

//方法3
(function(){
    console.log(123)
})()

//方法4
(function(){
    console.log(123)
}).call()

//方法5
-function(){
    console.log(123)
}()

//方法6
+function(){
    console.log(123)
}()

//方法7
!function(){
    console.log(123)
}()

//方法8
~function(){
    console.log(123)
}()

js升级后，在es6中可以直接使用let实现

let a=2
{let a=1}//局部变量
console.log(a) // 2