js中的this的指向问题详解


Posted in Javascript onAugust 29, 2019

this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象

this永远指向的是最后调用它的对象,也就是看它执行的时候是谁调用的

普通函数中的this指向:

情况1:如果一个函数中有this,但是它没有被上一级的对象所调用,那么this指向的就是window,这里需要说明的是在js的严格版中this指向的不是window,但是我们这里不探讨严格版的问题,你想了解可以自行上网查找。

情况2:如果一个函数中有this,这个函数有被上一级的对象所调用,那么this指向的就是上一级的对象。

情况3:如果一个函数中有this,这个函数中包含多个对象,尽管这个函数是被最外层的对象所调用,this指向的也只是它上一级的对象

构造函数中的this指向:

function Fn(){
  this.title= "你好";
}
var a = new Fn();
console.log(a.title); //你好

首先new关键字会创建一个空的对象,然后会自动调用一个函数apply方法,将this指向这个空对象,这样的话函数内部的this就会被这个空的对象替代。

当构造函数的this碰到return时:

如果返回值是一个对象,那么this指向的就是那个返回的对象,如果返回值不是一个对象那么this还是指向函数的实例。

如果返回值是null, null也是对象,但是在这里this还是指向那个函数的实例,因为null比较特殊。

以上就是本次介绍的全部知识点内容,感谢大家对三水点靠木的支持。

Javascript 相关文章推荐
javascript深入理解js闭包
Jul 03 Javascript
理解Javascript_08_函数对象
Oct 15 Javascript
js批量设置样式的三种方法不推荐使用with
Feb 25 Javascript
javascript if条件判断方法小结
May 17 Javascript
js实现从右向左缓缓浮出网页浮动层广告的方法
May 09 Javascript
Javascript学习之谈谈JS的全局变量跟局部变量(推荐)
Aug 28 Javascript
详解封装基础的angular4的request请求方法
Jun 05 Javascript
vue动画打包后失效问题的解决方法
Sep 18 Javascript
jquery的$().each和$.each的区别
Jan 18 jQuery
快速搭建Node.js(Express)用户注册、登录以及授权的方法
May 09 Javascript
Vue2.4+新增属性.sync、$attrs、$listeners的具体使用
Mar 08 Javascript
解决Echarts 显示隐藏后宽度高度变小的问题
Jul 19 Javascript
Node4-5静态资源服务器实战以及优化压缩文件实例内容
Aug 29 #Javascript
webpack + vue 打包生成公共配置文件(域名) 方便动态修改
Aug 29 #Javascript
微信小程序实现购物车代码实例详解
Aug 29 #Javascript
vue图片加载失败时用默认图片替换的方法
Aug 29 #Javascript
vue 框架下自定义滚动条(easyscroll)实现方法
Aug 29 #Javascript
Angular8路由守卫原理和使用方法
Aug 29 #Javascript
Vue中的循环及修改差值表达式的方法
Aug 29 #Javascript
You might like
PHP项目开发中最常用的自定义函数整理
2010/12/02 PHP
php include和require的区别深入解析
2013/06/17 PHP
php检测apache mod_rewrite模块是否安装的方法
2015/03/14 PHP
php在数组中查找指定值的方法
2015/03/17 PHP
javascript indexOf函数使用说明
2008/07/03 Javascript
JavaScript函数的4种调用方法详解
2014/04/22 Javascript
jQuery绑定事件不执行但alert后可以正常执行
2014/06/03 Javascript
asp.net中oracle 存储过程(图文)
2015/08/12 Javascript
Node.js 条形码识别程序构建思路详解
2016/02/14 Javascript
ES6中的箭头函数实例详解
2017/04/06 Javascript
JavaScript实现滑动导航栏效果
2017/08/30 Javascript
js防刷新的倒计时代码 js倒计时代码
2017/09/06 Javascript
vue中简单弹框dialog的实现方法
2018/02/26 Javascript
Element-ui tree组件自定义节点使用方法代码详解
2018/09/17 Javascript
详解Vue前端对axios的封装和使用
2019/04/01 Javascript
解析原来浏览器原生支持JS Base64编码解码
2019/08/12 Javascript
python线程锁(thread)学习示例
2013/12/04 Python
python自动化测试之连接几组测试包实例
2014/09/28 Python
Python编程中用close()方法关闭文件的教程
2015/05/24 Python
简单介绍使用Python解析并修改XML文档的方法
2015/10/15 Python
python实现本地图片转存并重命名的示例代码
2018/10/27 Python
Django forms表单 select下拉框的传值实例
2019/07/19 Python
Python random库使用方法及异常处理方案
2020/03/02 Python
Python3标准库之dbm UNIX键-值数据库问题
2020/03/24 Python
浅谈Python 命令行参数argparse写入图片路径操作
2020/07/12 Python
python如何删除列为空的行
2020/07/17 Python
施华洛世奇西班牙官网:SWAROVSKI西班牙
2019/06/06 全球购物
Ramy Brook官网:美国现代女装品牌
2019/06/18 全球购物
如何利用cmp命令比较文件
2016/04/11 面试题
行政工作个人的自我评价
2014/02/13 职场文书
班级文化建设标语
2014/06/23 职场文书
环境保护与污染治理求职信
2014/07/16 职场文书
2015年工程师工作总结
2015/04/30 职场文书
详解Laravel服务容器的优势
2021/05/29 PHP
vue3语法糖内的defineProps及defineEmits
2022/04/14 Vue.js
前端与RabbitMQ实时消息推送未读消息小红点实现示例
2022/07/23 Java/Android