欢迎光临散文网 会员登陆 & 注册

千锋教育JavaScript全套视频教程(10天学会Js,前端javascrip

2023-07-12 16:10 作者:bili_31103672616  | 我要投稿

this是Javascript语言的一个关键字。

它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用。

1、常用的四种情况

1)全局性调用,因此this就代表全局对象Global。

function test(){

this.x = 1;

alert(this.x);

}

test(); // 1


2)作为对象方法的调用

函数还可以作为某个对象的方法调用,这时this就指这个上级对象。

function test(){

alert(this.x);

}

var o = {};

o.x = 1;

o.m = test;

o.m(); // 1


3)作为构造函数调用

所谓构造函数,就是通过这个函数生成一个新对象(object)。这时,this就指这个新对象

function test(){

this.x = 1;

}

var o = new test();

alert(o.x); // 1


4)apply调用

apply()是函数对象的一个方法,它的作用是改变函数的调用对象,它的第一个参数就表示改变后的调用这个函数的对象。因此,this指的就是这第一个参数。

var x = 0;

function test(){

alert(this.x);

}

var o={};

o.x = 1;

o.m = test;

o.m.apply(); //0

apply()的参数为空时,默认调用全局对象。因此,这时的运行结果为0,证明this指的是全局对象。

如果把最后一行代码修改为

o.m.apply(o); //1

运行结果就变成了1,证明了这时this代表的是对象o。


apply()会改变this的对象,如果括号里没有值,对象按全局算,如果有对象,则按括号里面的算。


2、回调函数的this指向

var o = {

  age : 12,

  say : function() {

    function callback() {

      return this.age;

    }

    func(callback);

  }

};


function func(callback) {

  var name = "Xiao Ming";

  console.log(name + " is " + callback() + " years old.");

}

o.say();


代码分析:这里创建了一个单例对象【o】和一个普通函数【func】,【o】中有一个方法【say】,在方法【say】里面调用了函数【func】,并传入了一个回调函数【callback】作为参数,【callback】中返回了对象【o】的属性【age】。当执行到函数【func】时,打印的结果如下:


console.log(name + " is " + callback() + " years old.");  //Xiao Ming is undefined years old.

1

我们可以看到【func】中执行的回调函数【callback】的返回结果是“undefined”而非“12”。 

原因如下:函数内部的【this】指向于此函数的调用者(拥有者)。在上面这个例子中,虽然【callback】函数定义于对象【o】的【say】方法中,但实际上由于【callback】是在【func】函数中进行的普通调用,那么【func】中的【callback】的调用者我们便可以理解为是【window】对象,因此,【callback】中的【this】便指向了【window】,而在全局作用域中由于并不存在变量【age】,所以“this.age”(即“window.age”)便不存在,就返回了“undefined”。这里多说一点:既然变量【age】不存在,那么在使用一个未定义的变量时怎么没有报错(即“Uncaught ReferenceError: age is not defined”)呢?因为,这里是“return this.age”(在这里相当于“return window.age”)而非“return age”,即当使用一个对象的未定义的属性时不会报错,并返回“undefined”,而直接使用一个未定义的变量时便会报错。


千锋教育JavaScript全套视频教程(10天学会Js,前端javascrip的评论 (共 条)

分享到微博请遵守国家法律