函数和作用域

函数的本质

什么是函数？

阮一峰给了我们很好地解释：函数就是一段可以反复调用的代码块。函数还能接受输入的参数，不同的参数返回不同的值。

听不懂？那我下面的求三角形面积的例子演示一遍。

那问题在于，我们如何知道这段函数在内存里面是怎么存的？作为一个程序员，我们必须知道，当一个东西被声明出来之后，它在内存里面是怎么存的。

那么函数要怎么存？难道就当成字符串来存在内存里吗？对的，没错，函数就是被当做字符串存起来的：

函数的整体体系：

函数的 5 种声明

• 变量可以是7种数据类型：number String Boolean symbol undefined null Object
• 但是，如果是function声明一个函数x，那么这个x只能是对象里的函数。这是变量的特例。
• 控制台运行一段代码时，打印出的内容和返回的内容一点关系都没有
• 第一种方法：具名函数

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

• 第二种方法：匿名函数

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

如果要声明一个匿名函数必须赋值给另外一个变量

• 第三种 具名函数赋值 面试常用到

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

如图，黑色的代码的Y的作用域就在绿色圈圈内，即使在外面也能访问Y，下面蓝色的代码的Y的作用范围就只能函数的里面，也就是只能在绿圈圈里面访问Y。这叫做作用的区域。这两种语法并没有区别，所以这就是不一致性，所有的不一致性都是垃圾

• 第四种 window.Function（不常用）

声明方式：所有部分都是用字符串表示，字符串可以拼接起来，拼接期间可以添加变量

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

• 第五种 箭头函数

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

• 五种函数声明方式总结

img

函数的name属性

函数的name：面试常踩坑

eval命令

eval的作用是，把字符串当作代码执行.(少点用)

如何调用函数 f.call() 执行对象的函数体

• f和f.call()

• f()和f.call()

大部分人都会用f()调用函数，但是f.call()才是真正的调用。f()是一个语法糖，f.call为硬核玩家。如果想学好this,那就必须用f.call().

• f.call()用法

this 和 arguments

• f.call(asThis, input1,input2)
  其中 asThis 会被当做 this，[input1,input2] 会被当做 arguments

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

禁止使用 f(input1, input2)

• undefined就是this，this也就是call()的第一个参数
• this后面的参数都是arguments
• JS第一个参数为什么是this?

历史原因：JS之父设计JS的时候为了满足上司说JS语言必须与JAVA语言类似的需求，而临时加了this，来表示第一个参数。

• 普通模式

• 严格模式

call stack 调用栈

每进入一次函数，就要压一次stack

什么是Stack Overflow？

比如上面我们求5次，就要压5次栈，若是求100次呢？1000次，10000次甚至更多呢？我们来试试把栈爆掉：

作用域树形图

• 当我们在一个函数里面声明变量，如果找不到这个变量，就往父级找。按照语法树，就近原则
• 我们只能确定变量是哪个变量，但是不能确定变量的值
• 只要有一个函数，就有一个作用域
• 作用域面试题：拿到题目先使用变量提升，把所有的声明都提升到上面，把所有的执行都放到下面