Angular.JS中的this指向详解


Posted in Javascript onMay 17, 2017

【this详解】

1、谁最终调用函数,this指向谁。

      ① this指向的,永远只可能是对象!!!!!!

      ② this指向谁,永远不取决于this写在哪!!而是取决于函数在哪调用。

      ③ this指向的对象,我们称之为函数的上下文context,也叫函数的调用者

2、※※※※※this指向的规律(与函数调用的方式息息相关):

this指向的情况,取决于函数调用的方式有哪些:

      ① 通过函数名()直接调用:this指向window

      ② 通过对象.函数名()调用的:this指向这个对象

      ③ 函数作为数组的一个元素,通过数组下标调用的:this指向这个数组

      ④ 函数作为window内置函数的回调函数调用:this指向window setInterval  setTimeout 等...

      ⑤ 函数作为构造函数,用new关键字调用时:this指向新new出的对象 

function func(){
   console.log(this);
  }

① 通过函数名()直接调用:this指向window

func(); this--->window

② 通过对象.函数名()调用的:this指向这个对象

     狭义对象

var obj = {
 name:"obj",
 func1 :func
 };
 obj.func1(); this--->obj

     广义对象

document.getElementById("div").onclick = function(){
 this.style.backgroundColor = "red";
 }; this--->div

③ 函数作为数组的一个元素,通过数组下标调用的:this指向这个数组

var arr = [func,1,2,3];
arr[0](); this--->arr

④ 函数作为window内置函数的回调函数调用:this指向window

setTimeout(func,1000);// this--->window
setInterval(func,1000);

⑤ 函数作为构造函数,用new关键字调用时:this指向新new出的对象

var obj = new func(); //this--->new出的新obj

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
javascript下数值型比较难点说明
Jun 07 Javascript
Jquery为单选框checkbox绑定单击click事件
Dec 18 Javascript
JavaScript设计模式之单例模式实例
Sep 24 Javascript
JQuery异步获取返回值中文乱码的解决方法
Jan 29 Javascript
jQuery实现Div拖动+键盘控制综合效果的方法
Mar 10 Javascript
JavaScript数组和循环详解
Apr 27 Javascript
Vue.js基础知识汇总
Apr 27 Javascript
Vue 中批量下载文件并打包的示例代码
Nov 20 Javascript
详解微信小程序实现WebSocket心跳重连
Jul 31 Javascript
bootstrap table.js动态填充单元格数据的多种方法
Jul 18 Javascript
mpvue网易云短信接口实现小程序短信登录的示例代码
Apr 03 Javascript
JavaScript实现下拉列表
Jan 20 Javascript
websocket+node.js实现实时聊天系统问题咨询
May 17 #Javascript
JavaScript简单拖拽效果(1)
May 17 #Javascript
node.js连接MongoDB数据库的2种方法教程
May 17 #Javascript
JavaScript限定范围拖拽及自定义滚动条应用(3)
May 17 #Javascript
Vue.js鼠标悬浮更换图片功能
May 17 #Javascript
12个非常有用的JavaScript技巧
May 17 #Javascript
Javascript中的async awai的用法
May 17 #Javascript
You might like
php中目录,文件操作详谈
2007/03/19 PHP
JSON在PHP中的应用介绍
2012/09/08 PHP
深入探讨<br />和 \r\n两者有什么区别??
2013/06/05 PHP
thinkphp路由规则使用示例详解和伪静态功能实现(apache重写)
2014/02/24 PHP
php简单解析mysqli查询结果的方法(2种方法)
2016/06/29 PHP
总结对比php中的多种序列化
2016/08/28 PHP
PHP微信模板消息操作示例
2017/06/29 PHP
php 使用ActiveMQ发送消息,与处理消息操作示例
2020/02/23 PHP
javascript 中对象的继承〔转贴〕
2007/01/22 Javascript
文本有关的样式和jQuery求对象的高宽问题分别说明
2013/08/30 Javascript
javascript从image转换为base64位编码的String
2014/07/29 Javascript
js实现简单的可切换选项卡效果
2015/04/10 Javascript
jQuery简单实现input文本框内灰色提示文本效果的方法
2015/12/02 Javascript
jQuery+CSS3实现仿花瓣网固定顶部位置带悬浮效果的导航菜单
2016/09/21 Javascript
深入理解react-router@4.0 使用和源码解析
2017/05/23 Javascript
vue cli 全面解析
2018/02/28 Javascript
Node.js EventEmmitter事件监听器用法实例分析
2019/01/07 Javascript
JavaScript刷新页面的几种方法总结
2019/03/28 Javascript
详解解决小程序中webview页面多层history返回问题
2019/08/20 Javascript
nodeJS与MySQL实现分页数据以及倒序数据
2020/06/05 NodeJs
[01:43]深扒TI7聊天轮盘语音出处4
2017/05/11 DOTA
[01:06:54]DOTA2-DPC中国联赛 正赛 SAG vs DLG BO3 第二场 2月28日
2021/03/11 DOTA
Python中使用logging模块代替print(logging简明指南)
2014/07/09 Python
djano一对一、多对多、分页实例代码
2019/08/16 Python
使用Python进行防病毒免杀解析
2019/12/13 Python
解决pytorch报错:AssertionError: Invalid device id的问题
2020/01/10 Python
python爬虫开发之Request模块从安装到详细使用方法与实例全解
2020/03/09 Python
css3与html5实现响应式导航菜单(导航栏)效果分享
2014/02/12 HTML / CSS
台湾旅游网站:雄狮旅游网
2017/08/16 全球购物
优秀的导游求职信范文
2014/04/06 职场文书
《少年王冕》教学反思
2014/04/11 职场文书
2015届大学生就业推荐表自我评价
2014/09/27 职场文书
2016春节慰问信范文
2015/03/25 职场文书
运动会广播稿100字
2015/08/19 职场文书
python3 删除所有自定义变量的操作
2021/04/08 Python
Go语言空白表示符_的实例用法
2021/07/04 Golang