JavaScript 函数

一、函数的定义与调用

1、定义

• 函数的声明

 //函数声明
function info1() {
  console.log('函数声明');
}

函数声明必须有名字
函数声明会函数提升，在预解析阶段就已创建，声明前后都可以调用

info1();
//函数声明
function info1() {
  console.log('函数声明');
}

• 函数表达式

//函数表达式
const info2 = function () {
     console.log('函数定义');
}

函数表达式类似于变量赋值
函数表达式可以没有名字，例如匿名函数
函数表达式没有变量提升，在执行阶段创建，必须在表达式执行之后才可以调用

2、调用

普通函数	函数()
构造函数	new 构造函数()
对象方法	对象.方法()

3、函数内this指向不同的场景

调用方式	非严格模式	备注
普通函数调用	window	严格模式下是 undefined
构造函数调用	实例对象	原型方法中 this 也是实例对象
对象方法调用	该方法所属对象	紧挨着的对象
事件绑定方法	绑定事件对象
定时器函数	window

//普通函数调用
    const info = function(){
        console.log('普通函数this  :',this);
    }
    // info();
  
    function Person(){
        console.log('构造函数this ',this);
        this.name = '构造函数'
        this.sayName = function(){
            console.log('对象方法this ',this);
        }
    } 
    Person.prototype.eat = function(){
        console.log('原型方式this :',this);
    }

    // Person.prototype.eat = () => {
    //     console.log('原型方式this :',this);
    // }

    const p = new Person();
    p.sayName();
    p.eat();

    const btn  = document.getElementById('btn');
    btn.onclick = function(){
        console.log('事件绑定this ',this);
    }

    setTimeout(function(){
        console.log('定时器this',this);
    },1000)

4、call、apple、bind方法的区别

函数对象的方法. : 在javascript中每一个函数都可以看作成一个对象，它对应的类型是Function

• call、apple

        function info(name,age){
            console.log('info函数 :',this);
            console.log('name :',name,' ,age :',age);
        }

        Array.prototype.inverse = function(){
            console.log('Array this  :',this);
            // info();
            // info.call(this,'小明',17);
            info.apply(this,['小明',17]);
        }

call语法: 函数.call(obj,[参数列表]);
apple语法: 函数.apple(obj,[数组]);

• bind

改变原函数中this指向

//普通函数
        this.x = 9;
       let module = {
            x: 81,
            getX: function () {
                return this.x;
            }
        };
//返回值
        const k = module.getX(); // 返回 81
        console.log('k ',k);

        let retrieveX = module.getX;
        const y = retrieveX(); 
        console.log('y ',y);

        // 创建一个新函数，将"this"绑定到module对象
        // 新手可能会被全局的x变量和module里的属性x所迷惑

        var boundGetX = retrieveX.bind(module);
        const a = boundGetX(); // 返回 81
        console.log('a ',a);

5、 自调用函数

立即执行函数，在创建后立即执行

(function(接收的变量y){
  //函数体
})(传入的变量x)
//把局部变量给父类就可以了

6、 高阶函数

函数可以作为参数也可以作为返回值

new Promise((resovel,rejected)=>{

})

其中promise参数就为函数