html调用js函数的运行结果_js中函数的调用

在js中我们通常会定义一个函数，用她来实现一些功能。如下代码，我们在函数中输出传入的参数x。代码如下

function test(x){ console.log(this); console.log(x);}test('a');

函数的this指向window对象

上面是对函数的调用。

如果我们对上面的代码稍加改造。

function test(x){ console.log(this); console.log(x);}let testA = new test('a');console.log(testA);

这个函数和上面的函数是一样的，但是我们调用的方法是通过一个new操作符来实现创建了一个test类的实例，虽然我们创建的对象没什么意义。但是我们看到testA是存在的，而函数内的this指向变成了testA。

这个是构造函数的调用

我们对代码再改造一下。如下：

function test(x){ console.log(this); console.log(x);}let ob = { fn:test}ob.fn('a');

再这个函数中我们把函数test赋值给对象ob，我们调用ob.fn方法发现函数的this指向又变成了ob对象。

这是函数作为一个对象的方法调用。

通过不同的调用形式，相同的函数this指向也不同。似乎有种橘生淮南则为橘 生于淮北则为枳