当前位置: 首页 > news >正文

简述this指向

简述this指向

目录

1.背景介绍

2.知识剖析

3.常见问题

4.解决方案

5.编码实战

6.扩展思考

7.参考文献

8.更多讨论

1.背景介绍 this是Javascript语言的一个关键字。

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

                随着函数使用场合的不同,this的值会发生变化。但是有一个总的原则,那就是this指的是,调用函数的那个对象。
复制代码

2.知识剖析 情况一:纯粹的函数调用

这是函数的最通常用法,属于全局性调用,在浏览器中全局对象就是window

function a(){

var user = "Tom";

console.log(this.user); //undefined

console.log(this); //Window

}

a();

情况二:作为对象方法的调用

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

var name = "user1";

var obj= {

name: "user2",

getName: function () {

console.log(this.name);

}

}

obj.getName();//user2

情况三:函数作为构造函数调用

function test(){

     this.x = 1;

   }

var o = new test();

console.log(o.x);//1

函数作为构造函数调用时this指向用该构造函数构造出来的新对象。

3.常见问题 apply、call的用法

这三个函数是函数对象的一个方法,他们的作用就是为了改变函数执行时候的this指向,具体用法如下:

            call:call(obj,[arg1],[arg2]);第一个参数为强制改变需要指向的对象,后边可选的是该函数的参数,如果不传obj的话默认为window。

            apply:apply(obj,[arr]);第一个参数为强制改变需要指向的对象,后边可选的是该参数集合的数组形式,如果不传obj的话默认为window。

            apply和call的作用和调用形式基本一致,不同的是call后面的参数与方法中是一一对应的,而apply的第二个参数是一个数组,数组中的元素是和方法中一一对应的,这就是两者最大的区别。两者都可以不传参数,此时默认改变指向的对象为全局对象。
复制代码

4.解决方案

使用 call 和 apply 函数的时候要注意,如果传递给 this 的值不是一个对象,JavaScript 会尝试使用内部 ToObject 操作将其转换为对象。因此,如果传递的值是一个原始值比如

        7 或 'foo',那么就会使用相关构造函数将它转换为对象,所以原始值 7 会被转换为对象,像 new Number(7) 这样,而字符串 'foo' 转化成 new String('foo')
复制代码

5.编码实战

6.拓展思考 7.参考文献 参考1:Javascript的this用法

参考2:深入理解JAVASCRIPT系列:各种上下文中的THIS

参考3:MDN this

8.更多讨论 感谢大家观看

今天的分享就到这里啦,欢迎大家点赞、转发、留言、拍砖~

技能树.IT修真院

“我们相信人人都可以成为一个工程师,现在开始,找个师兄,带你入门,掌控自己学习的节奏,学习的路上不再迷茫”。

这里是技能树.IT修真院,成千上万的师兄在这里找到了自己的学习路线,学习透明化,成长可见化,师兄1对1免费指导。

快来与我一起学习吧~http://www.jnshu.com/login/1/21109035

转载于:https://juejin.im/post/5ae6b7ab518825673027ec95

相关文章:

  • 如何理解angular自定义指令directive的scope属性?
  • zabbix3配置阿里云邮箱告警
  • 小葵花妈妈课堂开课了:《Runnable、Callable、Future、RunnableFuture、FutureTask 源码分析》...
  • 跟我学Shiro电子书
  • 嵌入式视觉应用的疆土在逐步扩大
  • requests 中文乱码
  • [原]Python安装和使用MySQLdb库(Windows系统)
  • c# IPC实现本机进程之间的通信
  • 网络编程--基础TCP
  • 使用jMeter构造大量并发HTTP请求进行微服务性能测试
  • DAY18-Django之分页和中间件
  • jmeter接口测试步骤
  • 网关地址设置
  • [mvc] 简单的forms认证
  • nmap 端口扫描工具
  • 【跃迁之路】【733天】程序员高效学习方法论探索系列(实验阶段490-2019.2.23)...
  • docker容器内的网络抓包
  • GDB 调试 Mysql 实战(三)优先队列排序算法中的行记录长度统计是怎么来的(上)...
  • JavaScript HTML DOM
  • Javascript Math对象和Date对象常用方法详解
  • js算法-归并排序(merge_sort)
  • Koa2 之文件上传下载
  • Object.assign方法不能实现深复制
  • vue2.0一起在懵逼的海洋里越陷越深(四)
  • Vue全家桶实现一个Web App
  • 从0实现一个tiny react(三)生命周期
  • 理解在java “”i=i++;”所发生的事情
  • 普通函数和构造函数的区别
  • 算法-图和图算法
  • 微信开放平台全网发布【失败】的几点排查方法
  • 用简单代码看卷积组块发展
  • Spring Batch JSON 支持
  • UI设计初学者应该如何入门?
  • 函数计算新功能-----支持C#函数
  • ​软考-高级-系统架构设计师教程(清华第2版)【第9章 软件可靠性基础知识(P320~344)-思维导图】​
  • #pragma 指令
  • (1)Nginx简介和安装教程
  • (4)Elastix图像配准:3D图像
  • (C语言)逆序输出字符串
  • (delphi11最新学习资料) Object Pascal 学习笔记---第7章第3节(封装和窗体)
  • (poj1.3.2)1791(构造法模拟)
  • (一)SpringBoot3---尚硅谷总结
  • (转载)虚函数剖析
  • .htaccess 强制https 单独排除某个目录
  • .net core IResultFilter 的 OnResultExecuted和OnResultExecuting的区别
  • .Net MVC4 上传大文件,并保存表单
  • .Net Remoting常用部署结构
  • .net6+aspose.words导出word并转pdf
  • .NET8.0 AOT 经验分享 FreeSql/FreeRedis/FreeScheduler 均已通过测试
  • .NET学习全景图
  • @Autowired @Resource @Qualifier的区别
  • [ Algorithm ] N次方算法 N Square 动态规划解决
  • [2016.7 day.5] T2
  • [Android] Implementation vs API dependency
  • [C++][基础]1_变量、常量和基本类型