js的函数

函数的声明

// 方式1
function fun(params) {
    console.log(params);
}
// 方式2
var fun1 = function (params) {
    console.log(params);
}

---

变量提升（非严格模式）

let 有暂时死区，不会被提升。

1. 变量

a =2
console.log(2);
// 等价于
var a
a = 2
console.log(a);

2. 变量是函数

a()
var a =function (params) {
    console.log('asd');
}
// Uncaught TypeError: a is not a function（因为a函数没有定义是个函数，只是定义a而已）
// 等价于
var a 
a = function a(params) {
    console.log('asd');
}

3. 函数声明高于一切，毕竟函数是js的第一公民。

a()
function a(params) {
    console.log('23');
}
var a= 2
// 23(返回的是函数)

4. 有多个函数声明的时候，是由最后面的函数声明来替代前面的。

fun()
function fun(params) {
    console.log('1');
}
function fun(params) {
    console.log('2');
}
//输出 2

---

This的指向

1. 默认绑定(只是函数声明方式不同而已)

function test() {
    console.log(this); //window 或 严格模式下是undefined
}
var fun = function (params) {
    console.log(this); //window 或 严格模式下是undefined
}

2. 隐式绑定（谁调用，指向谁）

// 例子1
const obj = {
    name: 'objName',
    getName() {
        console.log(this); //obj
        console.log(this.name); //objName
    }
};
obj.getName();
// 例子2(链式)
var foo =function (){
    console.log( this.a );
}
var obj1 = {
    a: 2,
   	obj2: obj2
};
var obj2 = {
    a: 3,
   	foo: foo
};
obj1.obj2.foo(); // 3

3. 显式绑定（apply，call，bind指定绑定的对象）

const bird = {
    name:'bird',
    fly(a='a',b='b'){
        console.log(this);
        console.log(this.name+' can fly');
        console.log(a+b+"0000000000000000");
    }
}
const fish = {
    name:'fish',
    Swimming(c='c',d='d'){
        console.log(this);
        console.log(this.name+' can Swimming');
        console.log(c+d+"111111111111111");
    }
}

bird.fly('aaaaaaaa','ssssssss')

fish.Swimming('wwww','qweqewqe')

将fish的Swimming的this指向bird
bind

//bind(要执行，参数是多个)
fish.Swimming.bind(bird,'1','qwe')()

call

// call(立即执行，参数是多个)
fish.Swimming.call(bird,'2',"33333333")

apply

// apply(立即执行，参数是一个数组存储)
fish.Swimming.apply(bird,['2','asd'])

4. new绑定

function foo() {
    console.log(this);
}
foo(); //window
new foo(); //foo这个new出来的对象

5. 箭头函数绑定

this始终指向它被创建时所处的词法作用域中的this

// 例子1
const obj = {
    getName: () => {
        console.log(this); //调用前this是什么,函数里面的this就是什么
    }
};
obj.getName()//window
// 例子2
var b = {
    getThis: function () {
        return {
            fun: () => {
                console.log(this);
            }
        }
    }
}
b.getThis().fun()//返回{getThis:f}就是b对象
// 例子3
name = 'window'
var obj = {
    name: "obj",
    fn: function () {
        name = "obj1"
        console.log(this.name + "dddd");
        return {
            name: "obj2",
            fn1: function () {
                name = "obj3"
                console.log(this.name + "aaaaaaa");

                // return () => {
                //     console.log(this.name + "bbbbbbbbbb");
                // }
                return function () {
                    name = "obj4"
                    console.log(this.name + "bbbbbbbbbb");
                }

            },
            fn2: () => {
                console.log(this.name + "cccccccccccc");
            }
        }
    },
}

var newObj = obj.fn();
var newObj1 = newObj.fn1()
newObj1();
newObj.fn2();