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 相关文章推荐
统一接口:为FireFox添加IE的方法和属性的js代码
Mar 25 Javascript
分享一款基于jQuery的视频播放插件
Oct 09 Javascript
Javascript验证方法大全
Sep 21 Javascript
使用jquery+CSS3实现仿windows10开始菜单的下拉导航菜单特效
Sep 24 Javascript
JavaScript必知必会(九)function 说起 闭包问题
Jun 08 Javascript
完美JQuery图片切换效果的简单实现
Jul 21 Javascript
js实现可旋转的立方体模型
Oct 16 Javascript
three.js中文文档学习之通过模块导入
Nov 20 Javascript
vuejs选中当前样式active的实例
Aug 22 Javascript
详解在网页上通过JS实现文本的语音朗读
Mar 28 Javascript
node.js如何自定义实现一个EventEmitter
Jul 16 Javascript
JS前端宏任务微任务及Event Loop使用详解
Jul 23 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
咖啡与水的关系
2021/03/03 冲泡冲煮
环境会对咖啡种植有什么影响
2021/03/03 咖啡文化
php网页后退不再出现过期
2007/03/08 PHP
php sprintf()函数让你的sql操作更安全
2008/07/23 PHP
Zend Studio 实用快捷键一览表(精心整理)
2013/08/10 PHP
php导入excel文件到mysql数据库的方法
2015/01/14 PHP
laravel框架中视图的基本使用方法分析
2019/11/23 PHP
JavaScript 10件让人费解的事情
2010/02/15 Javascript
$.format,jquery.format 使用说明
2011/07/13 Javascript
使用jQuery避免鼠标双击的解决方案
2013/08/21 Javascript
JS实现时间格式化的方式汇总
2013/10/16 Javascript
基于jquery的simpleValidate简易验证插件
2014/01/31 Javascript
浅析javascript函数表达式
2016/02/10 Javascript
jQuery插件简单学习实例教程
2016/07/01 Javascript
Radio 单选JS动态添加的选项onchange事件无效的解决方法
2016/12/12 Javascript
浅谈JavaScript的计时器对象
2016/12/26 Javascript
jquery.rotate.js实现可选抽奖次数和中奖内容的转盘抽奖代码
2017/08/23 jQuery
微信小程序基于slider组件动态修改标签透明度的方法示例
2017/12/04 Javascript
JavaScript 五大常见函数
2018/03/23 Javascript
深入理解es6块级作用域的使用
2019/03/28 Javascript
详解elementui之el-image-viewer(图片查看器)
2019/08/30 Javascript
layui写后台表格思路和赋值用法详解
2019/11/14 Javascript
Vue-cli打包后部署到子目录下的路径问题说明
2020/09/02 Javascript
使用python调用浏览器并打开一个网址的例子
2014/06/05 Python
Python实现抓取城市的PM2.5浓度和排名
2015/03/19 Python
使用Python的PIL模块来进行图片对比
2016/02/18 Python
Python冒泡排序注意要点实例详解
2016/09/09 Python
基于Python 的进程管理工具supervisor使用指南
2016/09/18 Python
python实现决策树分类
2018/08/30 Python
为什么相对PHP黑python的更少
2020/06/21 Python
宿舍保安职务说明书
2014/02/25 职场文书
高三学生评语大全
2014/04/25 职场文书
学校清洁工岗位职责
2015/04/15 职场文书
确保工程质量承诺书
2015/04/29 职场文书
联村联户简报
2015/07/21 职场文书
Web前端:CSS最强总结 附详细代码
2021/03/31 HTML / CSS