推荐博客:https://www.cnblogs.com/huaxili/p/5407559.html

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

主要用于以下四种环境:

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

js重点--this关键字的更多相关文章

  1. js中this关键字测试集锦

    参考:阮一峰<javascript的this用法>及<JS中this关键字详解> this是Javascript语言的一个关键字它代表函数运行时,自动生成的一个内部对象,只能在 ...

  2. JS中this关键字详解

    本文主要解释在JS里面this关键字的指向问题(在浏览器环境下). 阅读此文章,还需要心平气和的阅读完,相信一定会有所收获,我也会不定期的发布,分享一些文章,共同学习 首先,必须搞清楚在JS里面,函数 ...

  3. JS 中 this 关键字详解

    本文主要解释在JS里面this关键字的指向问题(在浏览器环境下). 首先,必须搞清楚在JS里面,函数的几种调用方式: 普通函数调用 作为方法来调用 作为构造函数来调用 使用apply/call方法来调 ...

  4. JS中的关键字和保留字

    JavaScript中不能作为变量名的关键字和保留字总结: 1.js中的关键字: break case catch continue default delete do else finally fo ...

  5. js保留的关键字

    js保留的关键字 break else new var case finally return void catch for switch while continue function this w ...

  6. JS实现new关键字的功能

    一.前言 众所周知:没有对象怎么办?那就new一个! 那么在JS中,当我们new一个对象的时候,这个new关键字内部都干了什么呢? 现在我们就来剖析一下原生JS中new关键字内部的工作原理. 二.原始 ...

  7. 关于js中this关键字的补充

    前面: 前面虽然综合了网络上不少大牛的心得,但感觉还是意犹未尽,为了彻底搞清楚js中this的相关知识,决定再写一篇.个人觉得,在技术上,除非钻到细枝末节,否则很难达至非常高的水平. 补充1: 无法重 ...

  8. Js 使用new关键字调用函数和直接调用函数的区别

    最近开始学习js,在看到书上的一个例子时,引发了我的一系列思考: 书上例子: function Person(name,age,job){ var o =new Object(); o.name=na ...

  9. js 屏蔽政治关键字

    一般情况下,用户输入评论提交到后台的同时,在后台进行关键字过滤,昨天看到了一个js关键字过滤的方法,记录下. 方法很简单,先把需要过滤的关键字做成数组, 在for循环数组判断有没有匹配. ok,先来个 ...

随机推荐

  1. SQLServer之删除用户定义的数据库角色

    删除用户定义的数据库角色注意事项 无法从数据库删除拥有安全对象的角色. 若要删除拥有安全对象的数据库角色,必须首先转移这些安全对象的所有权,或从数据库删除它们. 无法从数据库删除拥有成员的角色. 若要 ...

  2. Linux学习历程——Centos 7 账户管理命令(用户篇)useradd usermod userdel

    一.命令介绍 useradd     用于创建新的用户 usermod    用于修改用户属性 userdel      用于删除用户 -------------------------------- ...

  3. js坚持不懈之17:onmousedown、onmouseup 以及 onclick 事件

    <!DOCTYPE html> <html> <body> <div onmouseover = "mOver(this)" onmous ...

  4. EJS 语法

    教程

  5. Python--day06(深浅拷贝、元组、字典、集合)

    1.  深浅拷贝 1.1  值拷贝 s1直接将ls中存放的地址拿过来s1内部的值发生任何变化,s2都会随之变化 s1 = ['1','2','3','a']s2 = s1print(id(s1),id ...

  6. React 精要面试题讲解(五) 高阶组件真解

    说明与目录 在学习本章内容之前,最好是具备react中'插槽(children)'及'组合与继承' 这两点的知识积累. 详情请参照React 精要面试题讲解(四) 组合与继承不得不说的秘密. 哦不好意 ...

  7. PyQt5中的信号与槽,js 与 Qt 对象之间互相调用

    一.PyQt中的信号与槽 信号(Signal)和槽(Slot)是Qt中的核心机制,用在对象之间互相通信.在Qt中每个QObject对象和PyQt中所有继承自QWidget的控件(这些都是QObject ...

  8. JMeter_JDBC 性能测试

    用JMeter做JDBC测试配置步骤: 1.测试计划中添加mysql-connector-java-5.1.41-bin.jar 注意: 这里需要注意的是,在不同的环境(Windows或Linux)下 ...

  9. selenium webdriver 如何实现将浏览器滚动条移动到某个位置

    说明: 在做selenium webdriver  在做UI 自动化时,有些页面时使用懒加载的形式显示页面图片,如果在不向下移动滚动条时,获取到的图片会是网站的默认图片和真实的图片不相符. 所以研究了 ...

  10. 微信小程序-表单笔记

    发布页——向云端数据库上传多行文字和4张图片 第6,8行注释掉和不注释掉都可以实现数据上传 var _this = this; wx.cloud.callFunction({ name: 'searc ...