this 是 JavaScript 语言的一个关键字。

它是函数运行时,在函数体内自动生成的一个对象,只能在函数体内使用。

函数的不同使用场合,this 有不同的值。总的来说,this 就是函数运行时所在的环境对象。下面分四种情况,详细讨论 this 的用法。

1. 作为对象的方法调用

当函数作为对象的方法被调用时, this 指向该对象:

let obj = {
name : 'my name is obj',
getName : function(){
console.log(this.name)
}
} obj.getName() // 'my name is obj'

2. 作为普通函数调用

当函数作为普通函数被调用时,this 指向全局对象(在浏览器的 JavaScript 里指向 window):

window.name = 'is me'

const getName = function() {
return this.name
} console.log( getName() ) // 'is me’

3. 构造器调用

当函数作为构造函数被使用时,this 指向返回的这个对象:

const MyClass = {
this.name = 'className'
} let obj = new MyClass()
console.log( obj.name ) // 'className'

4. call 或 apply 调用

const obj1= {
name: 'TianGou Da',
getName: function(){
return this.name
}
}
const obj2 = {
name: 'TinaGou Ya'
}
console.log( obj1.getName() ) // 输出: TianGou Da
console.log( obj1.getName.call( obj2 ) ) // 输出:TinaGou Ya

参考文献:

阮一峰

[JavaScript设计模式和开发实践]

彻底理解JavaScript中的this的更多相关文章

  1. 理解JavaScript中的原型继承(2)

    两年前在我学习JavaScript的时候我就写过两篇关于原型继承的博客: 理解JavaScript中原型继承 JavaScript中的原型继承 这两篇博客讲的都是原型的使用,其中一篇还有我学习时的错误 ...

  2. 深入理解JavaScript中创建对象模式的演变(原型)

    深入理解JavaScript中创建对象模式的演变(原型) 创建对象的模式多种多样,但是各种模式又有怎样的利弊呢?有没有一种最为完美的模式呢?下面我将就以下几个方面来分析创建对象的几种模式: Objec ...

  3. 深入理解JavaScript中的属性和特性

    深入理解JavaScript中的属性和特性 JavaScript中属性和特性是完全不同的两个概念,这里我将根据自己所学,来深入理解JavaScript中的属性和特性. 主要内容如下: 理解JavaSc ...

  4. 深入理解javascript中执行环境(作用域)与作用域链

    深入理解javascript中执行环境(作用域)与作用域链 相信很多初学者对与javascript中的执行环境与作用域链不能很好的理解,这里,我会按照自己的理解同大家一起分享. 一般情况下,我们把执行 ...

  5. 【干货理解】理解javascript中实现MVC的原理

    理解javascript中的MVC MVC模式是软件工程中一种软件架构模式,一般把软件模式分为三部分,模型(Model)+视图(View)+控制器(Controller); 模型:模型用于封装与应用程 ...

  6. 理解javascript中的策略模式

    理解javascript中的策略模式 策略模式的定义是:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换. 使用策略模式的优点如下: 优点:1. 策略模式利用组合,委托等技术和思想,有效 ...

  7. 深入理解javascript中的立即执行函数(function(){…})()

    投稿:junjie 字体:[增加 减小] 类型:转载 时间:2014-06-12 我要评论 这篇文章主要介绍了深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是 ...

  8. 转载 深入理解JavaScript中的this关键字

    转载原地址: http://www.cnblogs.com/rainman/archive/2009/05/03/1448392.html 深入理解JavaScript中的this关键字   1. 一 ...

  9. js架构设计模式——理解javascript中的MVVM开发模式

    理解javascript中的MVVM开发模式 http://blog.csdn.net/slalx/article/details/7856769 MVVM的全称是Model View ViewMod ...

  10. 全面理解Javascript中Promise

    全面理解Javascript中Promise 最近在学习Promise的时候,在网上收集了一些资料,发现很多的知识点不够系统,所以小编特意为大家整理了一些自认为 比较好的文章,供大家更好地学习js中非 ...

随机推荐

  1. jqgrid自适应宽度

    https://blog.csdn.net/duzhanxiaosa/article/details/78922660

  2. python中的拷贝

    再说拷贝之前先说一说 is 与 == is 的作用是 比较两个引用是否为一个地址 == 是比较两个值 对变量 a  变量 b  都赋值为 2 : a 与 b 的值相等我们都可以理解,但是a与b引用地址 ...

  3. rc

    1,协同过滤. 2,协方差:用来衡量,他们的变化趋势是不是一致的. 3,皮尔逊相关系数:-1,负相关.1:正相关. 4,用皮尔逊相关系数来算相关性是最多的.

  4. Spring报错汇总笔记

    报错信息: org.springframework.beans.factory.BeanDefinitionStoreException: Unexpected exception parsing X ...

  5. 六 Spring属性注入的四种方式:set方法、构造方法、P名称空间、SPEL表达式

    Spring的属性注入: 构造方法的属性注入 set方法的属性注入

  6. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版:设定小文本

    <!DOCTYPE html> <html> <head> <title>菜鸟教程(runoob.com)</title> <meta ...

  7. 1007 Maximum Subsequence Sum (25分) 求最大连续区间和

    1007 Maximum Subsequence Sum (25分)   Given a sequence of K integers { N​1​​, N​2​​, ..., N​K​​ }. A ...

  8. 第1节 Scala基础语法:5、6、7、8、基础-申明变量和常用类型,表达式,循环,定义方法和函数

    4.    Scala基础 4.1.   声明变量 package cn.itcast.scala object VariableDemo {   def main(args: Array[Strin ...

  9. JS原型与原型链继承的理解

    一.原型 先从构造函数开始吧! 构造函数是什么?构造函数与其他函数唯一的区别在于调用方式不同.任何函数只要通过new来调用就可以作为构造函数,它是用来创建特定类型的对象. 下面定义一个构造函数 Fem ...

  10. Linux centosVMware Nginx负载均衡、ssl原理、生成ssl密钥对、Nginx配置ssl

    一.Nginx负载均衡 vim /usr/local/nginx/conf/vhost/load.conf // 写入如下内容 upstream qq_com { ip_hash; 同一个用户始终保持 ...