函数

函数, function, 是一个关键字, 表示声明一个函数, 是一个变量的特例.

每一个函数,都必须有一个return, 如果不写return, 默认会添加return undefined.

函数本质

函数就是将做一件相同事情的代码整合到一起,作为代码块, 可以被反复调用,可以执行代码的对象就是函数.

函数的五种声明方式

1. 具名函数

function x(input1, input2){ return }

2. 匿名函数

var x = function(input1, input2){ return }
// 匿名函数必须给一个变量

3. 具名函数赋值

var x = function y(input1, input2){ return }

4. Window.function

var x = new Function('x', 'y', 'return x + y')

5. 箭头函数

var x = (x, y) => { return x + y}
var x = (x, y) => { let n = x * 3; let m = y * 4; return n + m;}

具名函数和具名函数赋值两种声明的区别:

不一致性, 作用域不同, 垃圾特性.

分别声明具名函数和具名函数赋值, 并console.log(函数):

image image

console.log()原理

console.log = function(a){
    alert(a)
    return undefined
}
// 由此可见, console.log 永远返回undefined, 返回什么和打印什么 一点关系没有

函数的name属性

var f2 = function(){}
f2.name = "f2";

var f3 = function f4(){}
f3.name = "f4"

var f5 = new Function('x','y','return x + y')
f5.name = "anonymous" // 匿名的意思

如何调用函数

function f(x,y){ return x + y }

f(1,2) // 3

// 骨灰级写法, 真正的函数调用
f.call(undefined, 1, 2)

call()原理:

var f = new Function('x','y','console.log(1)')
f.call() // 1
// Function构造函数, 除了最后一个参数是函数体, 其他的都是参数
// 分解如下
var f = {};
f.parmas = ['x','y'];
f.functionBody = 'console.log(1)';
f.call = function(){
    window.eval(f.functionBody)
}
f.call() // 1

由上可得出: 为什么说函数是对象, 因为调用的过程就是执行eval函数体的过程, 可以执行代码的对象就是函数

f和f.call()的区别:

f 是对象, f.call 是执行对象的函数体

this 和 arguments

call()的第一个参数可以用this得到.后面的参数可以用arguments得到.

• this

上述代码中f.call(undefined, 1, 2), undefined就是this, 当时要求JS必须长的像java, 所有强行加了this

• arguments

上述代码中f.call(undefined, 1, 2), [1,2]就是arguments.

image

• arguments也是一个伪数组, 因为长的像数组, 原型链中没有Array.prototype, 或者是____proto____没有指向Array.prototype.

function f(){
    console.log(this)
}
f.call(1) // Number 对象 1


function f(){
    'use strict' // 严格模式
    console.log(this)
}
f.call(1) // 1

作用域

作用域（scope）指的是变量存在的范围。在 ES5 的规范中，Javascript 只有两种作用域：一种是全局作用域，变量在整个程序中一直存在，所有地方都可以读取；另一种是函数作用域，变量只在函数内部存在.只要有函数就有作用域

作用域对应的数据结构是树:

var a = 1;
function f(){
    console.log(a)
    var a = 2;
   
    function f2(){
        console.log(a)
    }
}
function f1(){
    var a = 3;
    console.log(a)
}

console.log(a)
f()

// 代码作用域如下图:

image.png

• 函数外部声明的变量就是全局变量（global variable），它可以在函数内部读取。

• 在函数内部定义的变量，外部无法读取，称为“局部变量”（local variable）。

函数内部的变量提升

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

function f(){
    console.log(a);
    var a = 1;
}

// 等同于
function f(){
    var a;
    console.log(a);
    var a = 1;
}

// a 打印出undefined

函数本身的作用域

函数本身也是一个值，也有自己的作用域。它的作用域与变量一样，就是其声明时所在的作用域，与其运行时所在的作用域无关。

var a = 1;
function x(){
    console.log(a);
}

function f(){
    var a = 2;
    x();
}
f(); // 1

// 等同于
var a;
a = 1;
function x(){
    console.log(a); // 1
}

function f(){
    var a;
    a = 2;
    x();
}
f();

上面代码中，函数x是在函数f的外部声明的，所以它的作用域绑定外层，内部变量a不会到函数f体内取值，所以输出1，而不是2。

总之，函数执行时所在的作用域，是定义时的作用域，而不是调用时所在的作用域.

闭包

如果一个函数, 使用了它范围外的值, 那么(这个函数+这个变量)就叫做闭包.

image.png