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 相关文章推荐
url 编码 js url传参中文乱码解决方案
Apr 11 Javascript
JS实现网页标题栏显示当前时间和日期的完整代码
Nov 02 Javascript
详解JavaScript中的事件流和事件处理程序
May 20 Javascript
jQuery EasyUI右键菜单实现关闭标签/选项卡
Oct 10 Javascript
Jquery Easyui菜单组件Menu使用详解(15)
Dec 18 Javascript
详解微信小程序开发—你期待的分享功能来了,微信小程序序新增5大功能
Dec 23 Javascript
详解Javascript获取缓存和清除缓存API
May 25 Javascript
20行js代码实现的贪吃蛇小游戏
Jun 20 Javascript
JS+canvas绘制的动态机械表动画效果
Sep 12 Javascript
vue+iview/elementUi实现城市多选
Mar 28 Javascript
原生js实现轮播图特效
May 04 Javascript
js 图片懒加载的实现
Oct 21 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 获取可变函数参数的函数
2009/08/26 PHP
PHP自定义函数格式化json数据示例
2016/09/14 PHP
PHP 实现 WebSocket 协议原理与应用详解
2020/04/22 PHP
语义化 H1 标签
2008/01/14 Javascript
jQuery的12招常用技巧分享
2011/08/08 Javascript
js比较和逻辑运算符的介绍
2013/03/10 Javascript
js中top的作用深入剖析
2014/03/04 Javascript
JavaScript将数组转换成CSV格式的方法
2015/03/19 Javascript
理解javascript对象继承
2016/04/17 Javascript
实例讲解JavaScript的Backbone.js框架中的View视图
2016/05/05 Javascript
AngularJS开发教程之控制器之间的通信方法分析
2016/12/25 Javascript
BootStrap 动态表单效果
2017/06/02 Javascript
JavaScript实现的可变动态数字键盘控件方式实例代码
2017/07/15 Javascript
Django中使用jquery的ajax进行数据交互的实例代码
2017/10/15 jQuery
详解如何在项目中使用jest测试react native组件
2018/02/09 Javascript
vue2.0父子组件间传递数据的方法
2018/08/16 Javascript
Node.js开发之套接字(socket)编程入门示例
2019/11/05 Javascript
vue.js+ElementUI实现进度条提示密码强度效果
2020/01/18 Javascript
[02:51]DOTA2英雄基础教程 艾欧
2014/01/13 DOTA
Python 将Matrix、Dict保存到文件的方法
2018/10/30 Python
python实时获取外部程序输出结果的方法
2019/01/12 Python
Python Django 前后端分离 API的方法
2019/08/28 Python
Python使用Excel将数据写入多个sheet
2020/05/16 Python
详解HTML5中的picture元素响应式处理图片
2018/01/03 HTML / CSS
Urban Outfitters美国官网:美国生活方式品牌
2016/08/26 全球购物
你的自行车健身专家:FaFit24
2016/11/16 全球购物
中国好声音华少广告词
2014/03/17 职场文书
连带责任保证书
2014/04/29 职场文书
安全教育演讲稿
2014/05/09 职场文书
工程售后服务承诺书
2014/05/21 职场文书
幼儿园教师师德师风演讲稿:爱我所爱 无悔青春
2014/09/10 职场文书
卖房授权委托书样本
2014/10/05 职场文书
预备党员思想汇报1000字
2014/10/07 职场文书
2019最新版股权转让及委托持股协议书范本
2019/08/07 职场文书
golang中的并发和并行
2021/05/08 Golang
青岛市的收音机研制与生产
2022/04/07 无线电