JavaScript 中有哪些不同的函数调用模式?

1.函数调用

2.方法调用

3.构造器调用

4.上下文形态

第一种函数调用:

使用函数调用模式调用函数时，非严格模式下，this被绑定到全局对象；在严格模式下，this是undefined。

function A(){
    console.log(this);
}
A();//window
function A(){
    'use strict';
    console.log(this); //undefined
}
A();

第二种：方法调用：

只会执行一段代码，同时方法中的 this 是方法的所有者，即当前的实例对象；返回值由 return 语句决定。

var obj = {
    name: '5se7en',
    say: function(){
        console.log(this.name);
    }
}
obj.say();//方法调用模式  5se7en

function A(){
    console.log(this);
}
var obj2 = {
    say: A  //将A函数赋值给obj2的say属性
}
obj2.say();//方法调用模式。this指向obj2

var obj3 = {
    name: '57',
    say: function)({
        console.log(this.name)
    })
}
var obj4 = {
    name: '伍柒',
    say: obj3.say //将obj3.say函数赋值给obj4的say
}
obj4.say();//方法调用模式：this——>obj4

第三种：构造器函数调用：

会用来创建一个对象，还是执行一段代码，this 表示当前对象

//没有手动return添加返回值，默认返回 this
function Person(){
    this.name = '5se7en';
    this.age = 18;
    console.log(this);
}
var p1=new Person();
console.log(p1.name)  //5se7en

//返回了一个基本数据类型（number / boolean / string / null / undefined），最终返回 this
function P2(){
    this.age=18;
    return "abc";
}
var p2=new P2();
console.log(p2.age)  //18

// 返回了一个复杂数据类型（对象），最终返回该对象
function P3(){
    this.age=10;
    return {};
}
var p3=new P3();
console.log(p3.age); //undefined

// 返回了一个复杂数据类型（对象），最终返回该对象
function P4(){
    this.age=10;
    return [1,3,5];
}
var p4=new P4();
console.log(p4.age);//undefined

第四种：上下文形态（apply, call）

//如果有参数的情况
var obj1 = {};
function sum(x,y){
    return x+y;
}
console.log(sum.call(obj1,1,2));//3
console.log(sum.apply(obj1,[1,2]));//3

JavaScript 中有哪些不同的函数调用模式?

猜你喜欢