js重点--this关键字

Posted 苏落

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js重点--this关键字相关的知识,希望对你有一定的参考价值。

this是javascript的一个关键字,表示的不是对象本身,而是指被调用的上文。

 

主要用于以下四种环境:

1.直接调用,表示的是全局对象,window;

2.作为对象方法被调用,表示的是该对象;

3.作为构造函数被调用,表示的是创建的实例;

4.可以使用apply(),call()改变this的表示对象,第一个参数就是this;

5.嵌套函数作用域中的this。

 

1.直接调用,表示的是全局对象,window:

var count = 1;
function func(){
    console.log(this.count);
}
func();     //1    

调用函数的结果是1,即this指的是全局对象,window,所以count值为全局变量的值。

2.作为对象方法被调用,表示的是该对象:

var count = 1;
function func(){
  console.log(this.count);
}

var obj = {};
obj.count = 2;
obj.show = func;

obj.show();     //2

func()方法作为对象的方法被调用,此时this表示的被调用的对象obj,所以count值为obj对象中的值count,若是对象obj中没有count属性,则为undefined。

3.作为构造函数被调用,表示的是创建的实例:

var count = 1;
function func(){
  this.count = 2;
}

var Func = new func();
console.log(count);             //1
console.log(Func.count);     //2    

func()作为构造函数,创建了他的实例,此时this表示的是创建的实例Func。

4.可以使用apply(),call()改变this的表示对象,第一个参数就是this:

apply()是函数对象的一个方法,它的作用是改变函数的调用对象(实则是将某某对象的某个方法放到另一个好基友对象那里去执行),它的第一个参数就表示改变后的调用这个函数的对象。因此,this指的就是这第一个参数。同call()。

var count = 1;
function func(){
    console.log(this.count);
}

var obj = {};
obj.count = 2;

func.call();        //1 
func.call(obj);     //2

可以使用apply()或是call()来改变this指向。此时this表示的是obj对象。

5.嵌套函数作用域中的this:

嵌套函数被调用时并没有继承被嵌套函数的this引用,在嵌套函数被调用时,this指向全局对象。在有些应用中,我们需要在嵌套函数中读取调用被嵌套函数的对象的属性,此时可以声明一个局部变量保存this引用。

var count = 1;
function func(){
  console.log(this.count);

  function func2(){
    console.log(this.count);
  }

  func2();
}

var obj = {};
obj.count = 2;
obj.show = func;

obj.show();     //2,1

如下,嵌套函数与被嵌套函数中的this都表示了obj对象。

var count = 1;
function func(){
  console.log(this.count);

  var self = this;
  function func2(){
    console.log(self.count);
  }

  func2();
}

var obj = {};
obj.count = 2;
obj.show = func;

obj.show();     //2,2

 

注意:

1.参考博客:https://www.cnblogs.com/huaxili/p/5407559.html

 

以上是关于js重点--this关键字的主要内容,如果未能解决你的问题,请参考以下文章

使用带有渲染功能的 Vue.js 3 片段

js中的this关键字详解

安全测试 web安全测试 常规安全漏洞 可能存在SQL和JS注入漏洞场景分析。为什么自己没有找到漏洞,哪么可能存在漏洞场景是?SQL注入漏洞修复 JS注入漏洞修复 漏洞存在场景分析和修复示例(代码片段

js中的class

函数(重点)

angularJS使用ocLazyLoad实现js延迟加载