JavaScript 核心基础——（四）函数基础

1. 概念

函数也是一个对象，具有其他对象所有的功能
typeof fn 会返回 function

2. 声明方式

2.1 声明式函数

语法：

javascript 复制代码

function fn() {
    // code here..
}

2.2 赋值式函数（函数表达式）

语法：

javascript 复制代码

var fn = function() {
    // code here..
}

2.3 箭头函数

语法：

javascript 复制代码

const fn = () => {
    // code here..
}

3. 三种函数调用上的区别

声明式函数：调用可以在定义之前或定义之后

javascript 复制代码

// 可以调用
fn() // >> ''我是 fn 函数''
// 声明式函数
function fn() {
    console.log('我是 fn 函数')
}
// 可以调用
fn() // >> ''我是 fn 函数''

赋值函数：调用只能在定义之后调用，定义之前就调用会报错

javascript 复制代码

fn7(); // err: Uncaught ReferenceError: Cannot access 'fn7' before initialization
const fn7 = function() {
    console.log('fn7');
}
fn7();

箭头函数：调用只能在定义之后调用，定义之前就调用会报错

javascript 复制代码

fn6(); // err: Uncaught ReferenceError: Cannot access 'fn6' before initialization
const fn6 = () => {
    console.log('fn6');
}
fn6();

4. 函数参数默认值

语法：

javascript 复制代码

const fn = (a = 10, b = 20, c = 30) => {
    // code here..
}

5. 返回值

如果 return 后面不跟任何值或者直接不写 return，则函数最终会返回 undefined
箭头函数的返回值可以直接写在箭头后，如果直接在箭头后设置对象字面量为返回值时，对象字面量必须用 () 括起来
javascript 复制代码
```
const sum = (a, b) => a + b;
const fn = () => ({name: "孙悟空"});
```

6. 立即执行函数

在开发中应该尽力那个减少在全局作用域中编写代码，因此我们编写的代码要尽量编写到局部作用域
如果希望可以创建一个只执行一次的匿名函数，可以使用立即执行函数语法

javascript 复制代码

(function() {
    let a = 10;
    console.log(111);
}());

7. this

函数在执行时，JS 解析器每次都会传递进一个隐含的参数 this
this 会指向一个对象，this 所指向的对象会根据函数调用方式的不同而不同
- 以函数形式调用时，this 指向的是 window
- 以方法的形式调用时，this 指向的是调用方法的对象

8. 箭头函数的 this

特殊语法：
- 多个参数：(a, b) => {}
- 值返回一个对象的函数：() => ({name: 'tom', age})
箭头函数没有自己的 this，它的 this 有外层作用域决定
箭头函数的 this 和它的调用方式有关

javascript 复制代码

function fn() {
    console.log("fn -->", this)
}
const fn2 = () => {
    console.log("fn2 -->", this) // 总是window
}
// fn() // window
// fn2() // window
obj = {
    name:"孙悟空",
    fn, // fn:fn
    fn2,
    sayHello(){
        console.log(this.name)
        // function t(){
        // console.log("t -->", this)
        // }
        // t()

        const t2 = () => {
            console.log("t2 -->", this)
        }
        t2()
    }
}

// obj.fn() // obj
// obj.fn2() // window
obj.sayHello()

9. 严格模式

JS 运行代码的模式有两种：正常模式和严格模式

默认情况下代码都运行在正常模式中，在正常模式下，语法检查并不严格，原则是能不报错就尽量不报错
严格模式禁止了一些语法，更容易报错，但也会提升性能
在开发中应该尽量使用严格模式