Javascript中函数的四种调用方式

时间:2023-12-23 22:07:37

一、Javascript中函数的几个基本知识点:

1.函数的名字只是一个指向函数的指针,所以即使在不同的执行环境,即不同对象调用这个函数,这个函数指向的仍然是同一个函数。

2.函数中有两个特殊的内部属性:arguments和this.

arguments主要是用来保存函数参数,arguments中的callee属性主要是用来指向拥有当前arguments的函数(理解Javascript参数中的arguments对象).

3.在ECMAScript5中规范了另一个函数属性:caller(Opera早期版本不支持,其他版本浏览器都支持),它的作用是保存调用当前函数的函数的引用.

实例:

function outer() {
inner();
}
function inner() {
console.log(inner.caller);
}
outer();

测试结果:

Javascript中函数的四种调用方式

为了实现更松散的耦合,在inner()方法中同样可以利用arguments.callee.caller来访问,得到的结果和上面的结果一样.

4.在ECMAScript5中还定义了arguments.caller,它主要是用来区别函数中的caller属性。在非严格模式下,arguments.caller得到的值都是undefined;在严格模式下,下面的三种情况都会报错:

"use strict"
function outer() {
inner();
}
function inner() {
//console.log(inner.caller);//报错
//console.log(arguments.caller);//报错
//console.log(arguments.callee.caller);//报错
}
outer();

  

5.函数是个对象,因此它有属性和方法:每个函数都包括两个属性:length、prototype.通过函数名直接调用length,可以得到函数形参的个数;prototype是原型属性,每个函数都会有一个原型属性,更多关于原型属性的内容:理解javascript中的原型模式. 每个函数都包含两个非继承来的方法:apply()和call()(apply()和call()的区别).

二、四种调用函数的方式:函数调用模式、方法调用模式、构造器模式、apply\call模式.

1.直接调用函数的方式,this指向的全局对象window.

实例1:

函数声明

function add(a,b) {
return a+b;
} console.log(add(1,2));

实例2:

函数表达式

var add=function (a,b) {
return a+b;
} console.log(add(1,2));

2.函数作为对象的方法调用,this指向当前的对象.

实例1:

var o = {
prop: 21,
f:function() {
return this.prop;
}
}; console.log(o.f());

实例2:

var o = {
prop: 21,
}; function f() {
return this.prop;
} o.f = f;
console.log(o.f());//21

3.通过new调用构造器的方式,this指向当前构造函数的原型.

实例1:

返回this对象给o

function MyClass() {
this.a = 21;
} var o = new MyClass();
console.log(o.a);//21

实例2:

如果有return,则返回return的结果,如果没有就会返回this。

function MyClass() {
this.a = 21;
return {a:22};
} var o = new MyClass();
console.log(o.a);//22

4.通过apply或call的方式,这两个的第一参数即this,当第一个参数为null,this指向window;当第一个参数为一个对象,this就指向当前这个对象。