• javascript中函数的四种调用模式详解


    介绍函数四种调用模式前,我们先来了解一下函数和方法的概念,其实函数和方法本质是一样,就是称呼不一样而已。函数:如果一个函数与任何对象关系,就称该函数为函数。方法:如果一个函数作为一个对象属性存在,我们就称之为方法。接下来就可以开始今天的主体。

    1、函数调用模式。

    就是通过函数来调用,规范写法为:function fn(){} fn(); 函数中this的指向->window。案例如下:

        var age = 38;
        var obj = {
            age: 18,
            getAge: function() {
    
                function foo() {
                    console.log(this.age); // 因为是函数调用模式,所以this指向window全局变量,所以输出为38
                }
                // 只看这个函数是怎么调用,不管函数是在哪声明的!
                foo();
            }
        };
    
        obj.getAge();
    

    2、方法调用模式。

    就是通过对象的属性来调用,规范写法为:

        var obj = {
            say: function() {
                console.log(this);
            }
        };
        obj.say();
    

    函数中this的指向->当前对象。案例如下:

      var age = 38;
        var obj = {
            age: 18,
            getAge: function() {
                console.log(this.age);// 18
            }
        };
    
        obj.getAge();//因为是方法调用模式,this指向当前的对象obj。
    

    3、构造函数模式

    如果是作为构造函数来调用,那么this就是指向:new创建的新对象!规范写法为:

     function foo() {
            this.name = "123";
        }
        var f0 = new foo();
    
      没有找到合适的案例,为大家见谅!!!
    

    4、函数上下文(借用方法模式)。

    上下文模式中this的指向和前三种模式不一样,它的this指向可以改变,而前三种模式是固定。函数上下文在我理解就是函数作用域。基本语法:apply和call 后面都是跟两个参数

    apply和call第一个参数一样:表示使用那个对象来调用函数;apply第二个参数是:是一个数组或伪数组,数组的值做为函数的参数被传入;call第二个参数是:是基本数据类型(number string boolean);案例如下:

      //1:求一个数组中的最大值
      方法一:常规写法
        var arr = [9, 1, 4, 101, 7, 22, 8];
        var maxNum = arr[0],
            i = 1, len = arr.length;
    
        for(; i < len; i++) {
            if(arr[i] > maxNum) {
                maxNum = arr[i];
            }
        }
        console.log(maxNum);
    
      方法二:使用上下文调用模式(apply);
        var arr = [9, 1, 4, 101, 7, 22, 8];
       var maxNum=Math.max.apply(window,arr);//Math.max是window中的排序方法我们可以通过apply借用window中Math.max方法来对数组进行排序。
        console.log(maxNum);
  • 相关阅读:
    SpringMVC什么时候配置 视图解析器
    打印数组的5种方式
    集合区别(list和linkedlist的区别)?
    回归测试
    dom4j组装xml 以及解析xml
    java操作文件创建、删除
    powerdesigner里的table背景色是不是可以修改的?
    如何设定editplus为txt默认打开程序?
    PowerDesigner怎样才能在修改表的字段Name的时候Code不自动跟着变
    PowerDesigner怎么调出工具箱?
  • 原文地址:https://www.cnblogs.com/amujoe/p/11136465.html
Copyright © 2020-2023  润新知