函数五种声明方式

1.具名函数

 function f(x,y){
     return x+y
 }
 f.name // 'f'

具名函数

注意：如果console.log（x）后面的参数不是字符串，他会自动调用x.tostring的方法来得到string。

2.匿名函数

 var f
 f = function(x,y){
     return x+y
 }
 f.name // 'f'

匿名函数

注意：匿名函数必须声明一个变量。

3.具名函数赋值

 var f
 f = function f2(x,y){ return x+y }
 f.name // 'f2'
 console.log(f2) // undefined

具名函数赋值

注意：console.log永远返回undefined，console.log打印与返回没有关系。

4.window.Function

var f = new Function('x','y','return x+y')
 f.name // "anonymous"

注意：函数的name属性很不常用，用new Funtion声明函数，则该函数没有名字（anonymous）。
5.箭头函数

 var f = (x,y) => {
     return x+y
 }
 var sum = (x,y) => x+y
 var n2 = n => n*n

箭头函数

注意：箭头函数无名字，一定是匿名的。

函数的本质

函数就是一段可以反复调用的代码块。

求三角形的面积

eval：将字符串当做代码执行。

eval示例

函数的调用

调用函数有两种:f()和f.call()

f = function (x,y) {return x+y}
f(1,2) //3
等同于
f.call(undefined,1,2)//3

注意:调用函数必须用f.call()这种方法。f.call()方法语法是f.call(this,arguments)

this和arguments

在f.call中第一个参数就是this，后面一个参数就是arguments。

this在严格模式和普通模式之间也会有一些差别。

普通模式

严格模式

arguments示例

注意：f.call(this,arguments)中arguments是除了第一位的后面参数，他返回的是一个伪数组arguments.__proto__ === Object.prototype

call stack 调用栈

````Call stack```，意思是调用堆栈，调用堆栈是一个方法列表，按调用顺序保存所有在运行期被调用的方法。
当本次函数调用结束后，局部变量先出栈，然后是参数，最后栈顶指针指向最开始存的地址，也就是主函数中的下一条指令，程序由该点继续运行。
遵循先入后出的原因。

• 普通调用
• 嵌套调用
• 递归调用

作用域

作用域分两种：一种是全局作用域，变量在整个程序中一直存在，所有地方都可以读取；另一种是函数作用域，变量只在函数内部存在。

作用域

注意：按照语法树，就近原则
我们只能确定变量是哪个变量，但是不能确定变量的值

函数的内部提升

与全局作用域一样，函数作用域内部也会产生“变量提升”现象。var命令声明的变量，不管在什么位置，变量声明都会被提升到函数体的头部。

function f =(){
    console.log(a)
      var a = 1
}
等同于
function f =(){
      var a
      console.log(a)
      a = 1
}
f()//undefined 因为先声明，还没赋值就打出a，所以a就是undefined

面试题1

var a = 1
function f1(){
    alert(a) // 是多少
    var a = 2
}
f1.call()
等同于
var a = 1
function f1(){
  var a
   alert(a) // 是多少
   a = 2
}
f1.call()//undefined

注意：拿到代码直接做——必然会错。请先提升声明。

面试题2

var a = 1
function f1(){
    var a = 2
    f2.call()
}
function f2(){
    console.log(a) // 是多少
}
f1.call()

注意：f1.call()调用f1函数，得到f2.call().再调用f2函数得到console.log(a),f2函数是顶层函数，他作用范围内没有a的赋值，因此向上找父作用范围：全局范围，因此f1.call()等于1

面试题3

var liTags = document.querySelectorAll('li')
for(var i = 0; i<liTags.length; i++){
    liTags[i].onclick = function(){
        console.log(i) // 点击第3个 li 时，打印 2 还是打印 6？
    }
}
等同于
var liTags
var = i
liTags = document.querySelectorAll('li')
for( i = 0; i<liTags.length; i++){
  liTags[i].onclick = function(){

//整个for循环之后 i = 6
        console.log(i) // 点击第3个 li 时，打印 2 还是打印 6？
    }
}

面试3

注意：console.log(i)会在他之上的代码全部运行结束后再执行，这里i是动态取值的，所以在最后运行完整个for循环，得到的值是6

闭包

闭包