JS函数的四种调用方式:函数调用模式、方法调用模式、构造器调用模式, 间接调用模式

函数的四种调用方式:函数调用模式、方法调用模式、构造器调用模式, 间接调用模式

  1. 函数调用模式

    简单来说:一个函数并非一个对象的属性时,那么它就是被当做一个函数来调用。

//严格模式下,指向undefined
 function sum(a, b){
            "use strict";
            console.log(this);    //undefined
            return a + b;
   }
    var res = sum(1,2);
    console.log(res);        // 3
//非严格模式下,指向window
function sum(a, b){
     console.log(this);    //window
      return a + b;
  }
  var res = sum(1,2);
  console.log(res);        // 3
	  //重写
	   //注意:因为函数调用模式中的this绑定到全局对象,所以会发生全局属性被重写的现象
	   var a = 10;
        function reset() {
            this.a = 666;
        }
        console.log(a);     //10  
        reset();            //调用了函数后,由于reset的this是指向window的函数里修改了a的值,所以导致全局的a也被修改了
        console.log(a);     //666

所以,小心避免全局属性重写带来的问题。

  1. 方法调用模式

​ 简单来说就是:一个函数在一个对象内,做对象的属性叫做方法,这个方法的this指向这个对象。

	   var a = 10;
        var str = {
            a: 20,
            m: function() {
               this.a = 200;
            }
        }
        console.log(this.a);     //window的a  10
        console.log(str.a);      // 20
        str.m();                 //调用对象的方法后,修改了对象里a的值,此时a已经为200
        console.log(str.a);      // 200

3 构造函数调用模式

​ 简单来说:函数或者方法调用之前带有关键字new,它就构成构造函数调用

​ (1)构造函数的圆括号内带有实参,会先计算实参表单时在传入函数内。

	    function add(a) {
            this.b = a;
        }
        
        var fn = new add(100);
        console.log(fn.b);

​ (2)构造函数语法是允许省略实参列表和圆括号的。
​ 凡是没有形参的构造函数调用都可以省略圆括号

var o = new Object();
//等价于
var o = new Object;

​ (3)构造函数使用return语句但没有指定返回值,或者返回一个原始值,那么这时将忽略返回值,同时使用这个新对 象作为调用结果

function fn(){
    this.a = 2;
    return;
}
var test = new fn();
console.log(test);//{a:2}

​ (4)构造函数显式地使用return语句返回一个对象,那么调用表达式的值就是这个对象。

	   function add(a) {
            this.b = a;
            return {
                name: '刘德华',
                age: 50
            }
        }
        
        var fn = new add(100);
        console.log(fn);      //返回 { name: '刘德华',age: 50}

4.间接调用模式

​ call()和apply()方法可以用来间接地调用函数

var obj = {};
function sum(x,y){
    return x+y;
}
console.log(sum.call(obj,1,2));//3
console.log(sum.apply(obj,[1,2]));//3
posted on 2021-01-31 16:16  Steven_YF  阅读(161)  评论(0编辑  收藏  举报