《权威指南》笔记 -- 8.2 函数调用

来源：互联网发布：自学编程看什么书编辑：程序博客网时间：2024/04/30 18:54

定义时不执行，调用时才执行。

**调用方式，4种:
作为函数
作为方法
作为构造函数
通过call()和apply()调用**

8.2.1 作为函数调用

8.2.2 作为方法调用

当一个方法，是某个对象的属性1） a.o();2)  a["o"]();  // 通过方括号访问属性的方式调用3）a[0]();  //通过索引来访问对象的属性*：属性方法一般会传入一个隐形的实参，也就是这个对象本身，可以通过this来调用**: rect.setSize(width,height)  setRectSeize(rect,width,height)      这俩个调用的差别在于，this关键字所指向的对象不同，前者指向rect，后者指向window

代码如下：

<!--     函数，当做方法调用时，与当做函数调用时    this指向的内容不一样 --><!DOCTYPE html><html><head>    <title></title>    <meta charset = "utf-8"></head><body>    <script type="text/javascript">        var rect = {            width : 10,            height: 20,            setSize : function(x,y){                var str = "";                this.width = x;                this.height = y;                if(this === rect)                    str = "setRectSize中的this指向rect<br>";                else                    str = "setRectSize中的this不指向rect<br>";                document.write(str);            }        };         function setRectSize(r,w,h)        {            var str = "";            r.width = w;            r.height = h;            if(this===window)                str = "setRectSize中的this指向window<br>";            else                str = "setRectSize中的this不指向window<br>";            document.write(str);        }        rect.setSize(1,2);        setRectSize(rect,1,2);    </script></body></html>

运行结果如下：

这里写图片描述

 ***：对象的方法，如果没有特定返回值，一般返回对象本身，这样有利于链式调用。

8.2.3 作为构造函数调用

1） 添加new关键字，就可以将函数作为构造函数调用。2）返回一个对象。3）对象可以通过构造函数来初始化。4）对象将继承function.prototype上带有的属性

代码以及运行结果：

<!-- 构造函数调用 1.用new关键字，将普通函数当做构造函数使用2.通过该函数的prototype中的属性，初始化该对象3.在构造函数中的this关键字，只想的是被构造的新对象--><!DOCTYPE html><html><head>    <title></title>    <meta charset="utf-8"></head><body>    <script type="text/javascript">    function func(){        this.a = 1;        this.b = 2;    }    //为func的prototype添加属性    func.prototype.c = 3;    var o = new func();    //var o = new func;    //对于无参数调用构造函数，上面两个式子效果一样    //对象o，由构造函数初始化a,b属性，通过prototype将c熟悉继承给o    var result = "o.a=" + o.a + "<br>o.b=" + o.b + "<br>o.c=" + o.c;    document.write(result);    </script></body></html>

这里写图片描述

8.2.4 间接调用

函数自带两个方法，call()，apply()，通过这两个方法调用函数，可以控制函数体中this关键字的指向。

<!--     通过call()/apply()实现函数的间接调用 --><!DOCTYPE html><html><head>    <meta charset="utf-8">    <title></title></head><body>    <script type="text/javascript">    var o = {},        o2 = {};    function f(x,y){        //此处的this,指向call（）的第一个参数        this.a = x;        this.b = y;    }    f.call(o,1,2);    f.apply(o2,[1,2]);    //apply()与call()的区别在于参数需要放在数组里    </script></body></html>

这里写图片描述

0 0