JavaScript面向对象编程—this详解
this详解
作者的话
在JavaScriptOPPt面向对象编程中，this这位老大哥，相信大家不会陌生。大家在遇到this时，很多朋友难免会有个疑问：“这个this是什么，它到底指向谁？”
今天，博主针对this的指向问题，进行了整理。本篇博客，博主给大家详尽介绍了不同情况下，this的指向！！以下奉上博主总结的关于this的指向详解，希望对各位开发者朋友有所帮助：
1、谁最终调用函数，this指向谁。
①this指向的，永远只可能是对象！！！！！
②this指向谁，永远不取决于this写在哪，而是取决于this在哪调用；
③this指向的对象，我们称之为函数的上下文context，也叫函数的调用者
2、*****this指向的规律(与函数调用的方式息息相关)
this指向的情况，取决于函数调用的方式有哪些：
①通过函数名()直接调用的：this指向window
②通过对象.函数名()调用的：this指向这个对象；
③函数作为数组的一个元素，通过数组下标调用的：this指向这个数组
④函数作为window内置函数的回调函数调用时：this指向window
setTimeout(func,1000);setInterval等
⑤函数作为构造函数，用new关键字调用时：this指向的是new出的新对象
实例演示：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>this详解</title>
</head>
<body>
<div id="div"></div>
</body>
<script type="text/javascript"> function func (name) {
console.log(this); }
func();//window
//狭义对象
var obj={
name:"obj",
func1:func
};
obj.func1();//obj
//广义对象
document.getElementById("div").onclick=function () {
this.style.backgroundColor="red";
};//this指向div //函数作为数组的一个元素，通过数组下标调用的：this指向这个数组
var arr=[func,1,2,3]
arr[0](); //函数作为window内置函数的回调函数调用时：this指向window
setTimeout(func,1000);
//setInterval等 //函数作为构造函数，用new关键字调用时：this指向的是new出的新对象
var obj=new func;//this指向的是new出的新obj /*
* 综合小练习
*/
var obj1={
name:"obj1",
arr:[setTimeout(func,5000),1,2,3]
}
document.getElementById("div").onclick=obj1.arr[0]();//函数最终调用者：setTimeout；符合规律⑤，this指向window var obj1={
name:"obj1",
arr:[func,1,2,3]
}
document.getElementById("div").onclick=obj1.arr[0]();//函数最终调用者：arr数组下标；符合规律③，this指向arr var obj1={
name:"obj1",
arr:[{name:'arrObj',fun:func},1,2,3]
}
document.getElementById("div").onclick=obj1.arr[0].fun();//函数最终调用者：对象；符合规律②，this指向{name:'arrObj',fun:func}这个对象 </script>
</html>
以上为本期分享内容，希望本篇博客可以对广大开发者朋友有所帮助！如果有需要补充的部分，可在下方评论区予以补充。
如果本篇内容对你有所帮助，欢迎收藏，原创内容，欢迎大家积极评论转载和推荐！
JavaScript面向对象编程—this详解的更多相关文章
- JavaScript中的面向对象编程，详解原型对象及prototype，constructor，proto，内含面向对象编程详细案例（烟花案例）
面向对象编程: 面向:以什么为主,基于什么模式 对象:由键值对组成,可以用来描述事物,存储数据的一种数据格式 编程:使用代码解决需求 面向过程编程: 按照我们分析好的步骤,按步 ...
- 【JavaScript脚本编程技术详解-----（一）】
首先说明,本系列教程是写给有一定的JavaScript编程基础的同学看的,最好还有其它的编程语言经验,因为里面可能涉及一些其它的程序设计语言写的源代码,这都是我自己总结的经验,我喜欢在学习一门新的编程 ...
- javascript 特殊的面向对象以及继承详解(入门篇)
学习Javascript人,大多听说一句话叫js里面一切都是对象.我刚开始接触javascript面向对象编程时候,挺乱的,我当时习惯性的把PHP的面像对象思想套用在js上面,其实js的面向对象与传统 ...
- JavaScript面向对象编程学习笔记
1 Javascript 面向对象编程 所谓"构造函数",其实就是一个普通函数,但是内部使用了this变量.对构造函数使用new运算符,就能生成实例,并且this变量会绑定在实例 ...
- Javascript中prototype属性详解 （存）
Javascript中prototype属性详解 在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不 ...
- Javascript常用的设计模式详解
Javascript常用的设计模式详解 阅读目录 一:理解工厂模式 二:理解单体模式 三:理解模块模式 四:理解代理模式 五:理解职责链模式 六:命令模式的理解: 七:模板方法模式 八:理解javas ...
- JavaScript面向对象编程（2）-- 类的定义
最近这一段时间事情太多了,没有时间再继续写,幸好这两天有点小闲,先小写一下JavaScript中面向对象一中推荐的方法.本文承接上一篇JavaScript面向对象编程(1) -- 基础. 上篇说过,J ...
- JavaScript进阶内容——DOM详解
JavaScript进阶内容--DOM详解 当我们已经熟练掌握JavaScript的语法之后,我们就该进入更深层次的学习了 首先我们思考一下:JavaScript是用来做什么的? JavaScript ...
- JavaScript正则表达式详解（二）JavaScript中正则表达式函数详解
二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...
随机推荐
- C#文件上传类，文件流，字节数组等
using System;using System.IO;using System.Web;using System.Web.UI.WebControls; namespace DotNet.Util ...
- Android应用程序更新并下载
创建一个新类,名为UpdateManager,代码如下: package com.af.service; import java.io.BufferedReader; import java.io.F ...
- salesforce中soql及sosl的伪‘Like’模糊检索
salesforce里有soql.sosl两种查询语法,soql针对模糊搜索也有‘like’关键字,然而只能针对其自带字段如:Name.Id:对于自定义添加的字段如:Message__c.Note__ ...
- java中的基本jdbc中mvc基本示例
数据库: 包文件: Student.java 1 package com.model; 2 3 public class Student { 4 private int id; 5 private S ...
- centos 6.5 搭建ftp服务器
linux下一般使用vsftpd作为ftp服务器. vsftpd是一款在Linux发行版中最受推崇的FTP服务器程序.特点是小巧轻快,安全易用. 下面是安装配置步骤: 1.安装vsftpd yum i ...
- Html5 Canvas笔记(1)-CanvasAppTemplate代码
学了一段时间的Html5 Canvas,现想一段一段的将学习笔记整理出来放上来,先整理一段Canvas的模版文件代码,以后建立Canvas程序就不用重新写这些代码了,当然最好是将这个Html代码保存到 ...
- 静态数据的初始化（Chapter5.7.2）
先初始化主类中的静态数据,如果要用其他类来定义对象,则初始化对应的其他类. 实例化对象时,先初始化定义为static的数据,接着调用父类的构造函数(如果有父类),再初始化定义为非static的数据,最 ...
- ASP.NET Core 网站发布到Linux服务器
长期以来,使用.NET开发的应用只能运行在Windows平台上面,而目前国内蓬勃发展的互联网公司由于成本的考虑,大量使用免费的Linux平台,这就使得.NET空有一身绝技但无法得到广大的施展空间,.N ...
- Mybatis基础学习(二)—开发Dao方式
一.原始Dao开发方式 UserDao.java public interface UserDao{ public User findUserByID(Serializable id); public ...
- JavaWeb总结(五)—Cookie
一.会话 1.提出问题 HTTP协议是一种无状态的协议.Web服务器本身不能识别哪些请求是同一浏览器发出的,浏览器的每一次请求都是孤立的.即使HTTP1.1支持持续连接,但当用户有一段时间没有提交请求 ...