位置: 编程技术 - 正文

跟我学习javascript的this关键字(java script入门)

编辑:rootadmin

推荐整理分享跟我学习javascript的this关键字(java script入门),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:java script课程,java教程 视,java script入门,java script入门,java教程,java learning,java script,java learning,内容如对您有帮助,希望把文章链接给更多的朋友!

本文仅就这一问题展开讨论,阅罢本文,读者若能正确回答 JavaScript 中的 What 's this 问题,作为作者,我就会觉得花费这么多功夫,撰写这样一篇文章是值得的。

我们要记住一句话:this永远指向函数运行时所在的对象!而不是函数被创建时所在的对象。也即:谁调用,指向谁。切记…

本文将分三种情况来分析this对象到底身处何方。1、普通函数中的this无论this身处何处,第一要务就是要找到函数运行时的位置。

当this出现在全局环境的函数getName中时,此时函数getName运行时的位置在

显然,函数getName所在的对象是全局对象,即window,因此this的安身之处定然在window。此时的this指向window对象,则getName返回的this.name其实是window.name,因此alert出来的是“全局”!

那么,当this不是出现在全局环境的函数中,而是出现在局部环境的函数中时,又会身陷何方呢?

其中this身处的函数getName不是在全局环境中,而是处在xpg环境中。无论this身处何处,一定要找到函数运行时的位置。此时函数getName运行时的位置

显然,函数getName所在的对象是xpg,因此this的安身之处定然在xpg,即指向xpg对象,则getName返回的this.name其实是xpg.name,因此alert出来的是“局部”!

举个例子巩固一下:

this关键字虽然是在someone.showName中声明的,但运行的时候是other.showName,所以this指向other.showName函数的当前对象,即other,故最后alert出来的是other.name。

2、闭包中的this

闭包也是个不安分子,本文暂且不对其过于赘述,简而言之:所谓闭包就是在一个函数内部创建另一个函数,且内部函数访问了外部的变量。 浪子this与痞子闭包混在一起,可见将永无宁日啊!

此时的this明显身处困境,竟然处在getName函数中的匿名函数里面,而该匿名函数又调用了变量name,因此构成了闭包,即this身处闭包中。 无论this身处何处,一定要找到函数运行时的位置。此时不能根据函数getName运行时的位置来判断,而是根据匿名函数的运行时位置来判断。

显然,匿名函数所在的对象是window,因此this的安身之处定然在window,则匿名函数返回的this.name其实是window.name,因此alert出来的就是“全局”!

那么,如何在闭包中使得this身处在xpg中呢?—缓存this

在getName函数中定义that=this,此时getName函数运行时位置在

则this指向xpg对象,因此that也指向xpg对象。在闭包的匿名函数中返回that.name,则此时返回的that.name其实是xpg.name,因此就可以alert出来 “局部”!

3、new关键字创建新对象

new关键字后的构造函数中的this指向用该构造函数构造出来的新对象:

跟我学习javascript的this关键字(java script入门)

4、call与apply中的this

在JavaScript中能管的住this的估计也就非call与apply莫属了。 call与apply就像this的父母一般,让this住哪它就得住哪,不得不听话!当无参数时,当前对象为window

其中this身处函数getName中。无论this身处何处,一定要找到函数运行时的位置。此时函数getName运行时的位置

显然,函数getName所在的对象是window,因此this的安身之处定然在window,即指向window对象,则getName返回的this.name其实是window.name,因此alert出来的是“全局”!

那么,该call与apply登场了,因为this必须听他们的指挥!getName.call(xpg);其中,call指定this的安身之处就是在xpg对象,因为this被迫只能在xpg那安家,则此时this指向xpg对象, this.name其实是xpg.name,因此alert出来的是“局部”!

5、eval中的this

对于eval函数,其执行时候似乎没有指定当前对象,但实际上其this并非指向window,因为该函数执行时的作用域是当前作用域,即等同于在该行将里面的代码填进去。下面的例子说明了这个问题:

6、没有明确的当前对象时的this

当没有明确的执行时的当前对象时,this指向全局对象window。 例如对于全局变量引用的函数上我们有:

你可能也能理解成show是window对象下的方法,所以执行时的当前对象时window。但局部变量引用的函数上,却无法这么解释:

在浏览器中setTimeout、setInterval和匿名函数执行时的当前对象是全局对象window,这条我们可以看成是上一条的一个特殊情况。

所以在运行this.showName的时候,this指向了window,所以最后显示了window.name。

7、dom事件中的this

(1)你可以直接在dom元素中使用

分析:对于dom元素的一个onclick(或其他如onblur等)属性,它为所属的html元素所拥有,直接在它触发的函数里写this,this应该指向该html元素。

(2)给dom元素注册js函数 a、不正确的方式

分析:onclick事件直接调用thisTest函数,程序就会弹出undefined。因为thisTest函数是在window对象中定义的, 所以thisTest的拥有者(作用域)是window,thisTest的this也是window。而window是没有value属性的,所以就报错了。 b、正确的方式

分析:在前面的示例中,thisTest函数定义在全局作用域(这里就是window对象),所以this指代的是当前的window对象。而通过document.getElementById(“btnTest”).onclick=thisTest;这样的形式,其实是将btnTest的onclick属性设置为thisTest函数的一个副本,在btnTest的onclick属性的函数作用域内,this归btnTest所有,this也就指向了btnTest。其实如果有多个dom元素要注册该事件,我们可以利用不同的dom元素id,用下面的方式实现:

因为多个不同的HTML元素虽然创建了不同的函数副本,但每个副本的拥有者都是相对应的HTML元素,各自的this也都指向它们的拥有者,不会造成混乱。 为了验证上述说法,我们改进一下代码,让button直接弹出它们对应的触发函数:

从上面的结果你一定理解的更透彻了。 By the way,每新建一个函数的副本,程序就会为这个函数副本分配一定的内存。而实际应用中,大多数函数并不一定会被调用,于是这部分内存就被白白浪费了。所以我们通常都这么写:

这是因为我们使用了函数引用的方式,程序就只会给函数的本体分配内存,而引用只分配指针。这样写一个函数,调用的地方给它分配一个(指针)引用,这样效率就高很多。当然,如果你觉得这样注册事件不能兼容多种浏览器,可以写下面的注册事件的通用脚本:

正像注释写的那样,要注册dom元素事件,用EventUtil.addEvent(dom元素,事件名称,事件触发的函数名)即可, 移除时可以这样写:EventUtil.removeEvent(dom元素,事件名称,事件触发的函数名),这是题外话,不说了。

标签: java script入门

本文链接地址:https://www.jiuchutong.com/biancheng/385441.html 转载请保留说明!

上一篇:跟我学习javascript的作用域与作用域链(java script教程)

下一篇:跟我学习javascript的Date对象(java 视频教程)

  • 销售收入怎么做会计凭证
  • 合作社收到政府补助款怎么做分录呢
  • 分支机构注销后往来账如何处理
  • 备案办税人员信息填本人的有风险吗
  • 资产超过5000万的企业所得税税率
  • 医疗胶片扫描仪怎么用
  • 没有报关单货物违法吗
  • 企业年度财务报表主要包括
  • 利润表中第3栏营业税金及附加等于什么
  • 收到供应商赠送的发票
  • 违约金收入是否征税
  • 幼儿园增值税优惠政策
  • 营改增后企业要交哪些税
  • 收并购股权溢价
  • 累计折旧余额怎样结转
  • 无租使用房产怎么缴纳房产税土地税
  • 委托代销商品委托方发出商品的分录
  • 企业筹建期间开办费计入什么科目计入借方还是贷方
  • 向承兑人提示付款
  • 残保金征收单位
  • 酒精是否属于消费税征税范围
  • 未缴少缴税款追征期
  • 不动产融资租赁服务属于租赁服务吗
  • 如何将旧版本软件卸载
  • 内存条松动导致黑屏
  • win7系统步骤
  • linux acl配置命令
  • PHP:rawurldecode()的用法_url函数
  • 用约当产量法怎么计算约当总产量
  • 将现金存入银行,登记银行存款日记账的依据一般是
  • dl是什么文件
  • ant-design-vue pro
  • 销售点的增值税计算公式
  • PHP:imagelayereffect()的用法_GD库图像处理函数
  • node 卸载
  • 其他综合收益的构成项目如何
  • css3知识总结
  • 小规模企业应交税费
  • 固定资产一次性扣除政策2023
  • 对企业采取以旧换新方式销售的应税产品
  • 进项税发票可以跨年认证吗
  • 公司主营业务怎么介绍
  • 差旅费过路费会计分录
  • pythongui库
  • 售后租回融资租赁帐务处理怎么做?
  • 长期股权投资资本公积增加记哪个会计科目
  • 计入固定资产和费用的区别
  • 旅游业营改增会计分录
  • 一张发票能分开做帐务处理吗?
  • 财政应返还额度年末有余额吗?
  • 无形资产分期付款入账价值如何核算?
  • 制作费用和管理费用
  • 企业税负是否包含增值税
  • 工资分摊计提分配方式?
  • 公司之间的借款利息有最小限制吗
  • 修缮服务指什么
  • 预付账款无法取得发票如何处理
  • 哪些单位需要缴纳残疾人保障金
  • 怎样算小公司
  • 年初建账考虑要点
  • distinct 多个
  • linux配置raid5方法
  • win7卸载软件提示停止工作
  • windows ftp软件
  • linux编译安装php扩展
  • win7系统出现蓝屏
  • win8系统怎么设置开机密码
  • python opencv
  • 只用html和css
  • unity 动态生成模型
  • node js官网
  • 轻松实现财富自由
  • 举例说明jquery的功能
  • 国家税务局服务宗旨是什么
  • 新疆12366网上办税
  • 地税登记证和税务登记证是一样的吗
  • 企业医院和事业医院的区别
  • 云南港口城市
  • 甘肃省国家税务局
  • 车辆免征信息怎么查
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设