什么是this?

  1.javascript语言中,一切皆为对象(除了 undefined 和 null 之外),运行环境也是对象,所以函数都是在某个对象之中运行,this就是这个对象(环境)。

  2.this的指向是动态的。如果函数在全局作用域中,那么this就会指向全局环境;如果函数位于某个对象中,那么this就会指向该对象。

  3.与new关键字相同,this关键字总是返回一个对象

 

首先,必须搞清楚在JS里面,函数的几种调用方式:

  • 普通函数调用

  • 作为方法来调用

  • 作为构造函数来调用

  • 使用apply/call方法来调用

  • Function.prototype.bind方法

  • es6箭头函数

但是不管函数是按哪种方法来调用的,请记住一点:谁调用这个函数或方法,this关键字就指向谁。

this的使用场合

1.全局环境(全局作用域)

  在全局作用域中使用this对象,它指向的就是顶层对象,也就是window对象。

    

function person(){
this.name="xl";
console.log(this);
console.log(this.name);
}
person(); //输出 window xl // 在这段代码中person函数作为普通函数调用,实际上person是作为全局对象window的一个方法来进行调用的,即window.person();
//所以这个地方是window对象调用了person方法,那么person函数当中的this即指window,同时window还拥有了另外一个属性name,值为xl. var name="xl";
function person(){
console.log(this.name);
}
person(); //输出 xl //同样这个地方person作为window的方法来调用,在代码的一开始定义了一个全局变量name,值为xl,它相当于window的一个属性,即window.name="xl",
    又因为在调用person的时候this是指向window的,因此这里会输出xl. //在上面的代码中,普通函数的调用即是作为window对象的方法进行调用。显然this关键字指向了window对象.

   上面代码中,不管是不是在函数内部,只要在全局作用域下运行,this就是指向顶层对象window。

2. 作为方法来调用:

    当函数被保存为一个对象的属性时,它就可称为这个对象的方法。当一个方法被调用 时,this被绑定到这个对象上。

    如果调用表达式包含一个提取属性的动作(. 或 []),那么它被称为方法调用;

  var name="XL";
var person={
name:"xl",
showName:function(){
console.log(this.name);
}
}
person.showName(); //输出 xl
// //这里是person对象调用showName方法,很显然this关键字是指向person对象的,所以会输出name var showNameA=person.showName;
showNameA(); //输出 XL
//这里将person.showName方法赋给showNameA变量,此时showNameA变量相当于window对象的一个属性,因此showNameA()执行的时候相当于window.showNameA(),即window对象调用showNameA这个方法,所以this关键字指向window
//================================================================ var personA={
name:"xl",
showName:function(){
console.log(this.name);
}
}
personA.showName(); //输出xl;这里是personA中调用showName,所以this指向parsonA var personB={
name:"XL",
sayName:personA.showName
} personB.sayName(); //输出 XL
//虽然showName方法是在personA这个对象中定义,但是调用的时候却是在personB这个对象中调用,因此this对象指向personB;

3.   随时补充,暂时不会!

  

js中浅谈this对象(未补充完整)的更多相关文章

  1. JS中的内置对象简介与简单的属性方法

    JS中的数组: 1.数组的概念: 数组是在内存中连续存储的多个有序元素的结构,元素的顺序称为下标,通过下标查找对应元素 2.数组的声明: ①通过字面量声明var arr1 = [,,,,] JS中同一 ...

  2. JavaScript -- 时光流逝(六):js中的正则表达式 -- RegExp 对象

    JavaScript -- 知识点回顾篇(六):js中的正则表达式 -- RegExp 对象 1. js正则表达式匹配字符之含义      查找以八进制数 规定的字符.     查找以十六进制数 规定 ...

  3. js原型浅谈理解

    之前在学习原型(prototype)的时候,一直对原型的理解不是很清晰,只是知道每个对象都有一个原型,然后在js中万物又皆对象.在这里谈一下自己对于js原型的简单理解吧. 原型可以实现属性和方法的共享 ...

  4. js中内置有对象

    statpot:使用mongo+bootstrap+highcharts做统计报表 最近做了一个统计项目,这个统计项目大致的需求是统计接口的访问速度.客户端会调用一个接口来记录接口的访问情况,我的需求 ...

  5. JS中遍历数组、对象的方式

    1.标准的for循环遍历数组 //不打印自定义属性和继承属性 var array = [1,2,3]; for (var i = 0; i < array.length; i++) { cons ...

  6. JS核心系列:浅谈原型对象和原型链

    在Javascript中,万物皆对象,但对象也有区别,大致可以分为两类,即:普通对象(Object)和函数对象(Function). 一般而言,通过new Function产生的对象是函数对象,其他对 ...

  7. Js之浅谈dom操作

    JavaScript之浅谈dom操作 1.理解dom: DOM(Document Object Model ,文档对象模型)一种独立于语言,用于操作xml,html文档的应用编程接口. 怎么说,我从两 ...

  8. 你真的懂Flask中浅谈蓝图Blueprint吗?

    一,什么是Flask中的蓝图Blueprint Blueprint是用于实现Flask框架中单个应用的视图,模板,静态文件的集合. Blueprint 是一个存储操作(路由映射)方法的容器,这些操作在 ...

  9. IOS中 浅谈iOS中MVVM的架构设计与团队协作

    今天写这篇文章是想达到抛砖引玉的作用,想与大家交流一下思想,相互学习,博文中有不足之处还望大家批评指正.本篇文章的内容沿袭以往博客的风格,也是以干货为主,偶尔扯扯咸蛋(哈哈~不好好工作又开始发表博客啦 ...

随机推荐

  1. luoguP1003 铺地毯 题解(NOIP2011)

    luoguP1003 铺地毯  题目 #include<cstdio> #include<cstdlib> #include<cstring> #include&l ...

  2. 数据仓库ETL案例学习(二)

    来自案例学习 数据仓库经过ETL成功创建之后,就可以对数据仓库进行多维分析任务. 任务主要分为: 1.设置数据源,并添加分析时所需表到数据视图. 2.创建并设置维度. 3.设置时间维. 4.设置度量属 ...

  3. 贪心策略---买卖股票的最大收益 II

    买卖股票的最大收益 II 122. Best Time to Buy and Sell Stock II (Easy) 题目描述:   可以进行多次交易,多次交易之间不能交叉进行,可以进行多次交易. ...

  4. DevExpress Winform使用单例运行程序方法和非DevExpress使用Mutex实现程序单实例运行且运行则激活窗体的方法

    原文:DevExpress Winform使用单例运行程序方法和非DevExpress使用Mutex实现程序单实例运行且运行则激活窗体的方法 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA ...

  5. 任务21 :了解ASP.NET Core 依赖注入,看这篇就够了

    DI在.NET Core里面被提到了一个非常重要的位置, 这篇文章主要再给大家普及一下关于依赖注入的概念,身边有工作六七年的同事还个东西搞不清楚.另外再介绍一下.NET  Core的DI实现以及对实例 ...

  6. 同步按照NewTable中ID存储情况将数据按照规则同步至OldTable,并清空OldTable中多余数据行,返回错误消息

    public string UpdateDataAdapter(DataTable tab) { if (sda == null) return "DataAdapter还未初始化,请调用G ...

  7. 数据结构 java概况

    数据结构可以分为三种结构: 线性结构: 数组:栈:队列:链表:哈希表 树结构: 二叉树,二分搜索树,AVL,红黑树,Treap,Splay,堆,Trie,线段树,K-D树,并查集,哈夫曼树 图结构 邻 ...

  8. [react-native]react-native填坑笔记

    填坑笔记 开始入坑RN,从最开始的学起难免有不少乱七八糟的问题,记录在这里. 1. 8081端口占用问题 按照官网教程搭建开发环境并按照下面代码运行时候有报错,显示8081端口的问题 react-na ...

  9. windows命令行运行mysql

    在cmd中输入时一定要保证英文环境. 1. windows命令行运行mysql: 我是将MYSQL安装在C:\Program Files\MySQL所以 C:\Program Files\MySQL\ ...

  10. P4707 重返现世 扩展 MinMax 容斥+DP

    题目传送门 https://www.luogu.org/problem/P4707 题解 很容易想到这是一个 MinMax 容斥的题目. 设每一个物品被收集的时间为 \(t_i\),那么集齐 \(k\ ...