1.概述

this对象是在运行时基于函数的执行环境绑定的,this总是返回一个对象,简单说,就是返回属性或方法“当前”所在的对象。在全局函数中,this等于window,而当函数作为某个对象的方法调用时,this等于那个对象。不过匿名函数的执行环境具有全局性,因此其this对象通常指向window(如果通过call()或者apply()改变函数执行环境的情况下,this会指向其他对象。)。

2.为什么使用this?

虽然知道了this是怎么回事了,但是为什么要使用this,或者说this它带来了那些好处了。

因为在实例化对象时,总是不能确定开发者会使用什么样的变量名。使用 this,即可在任何多个地方重用同一个函数。请思考下面的例子:

function showColor() {
alert(this.color);
}; var oCar1 = new Object;
oCar1.color = "red";
oCar1.showColor = showColor; var oCar2 = new Object;
oCar2.color = "blue";
oCar2.showColor = showColor; oCar1.showColor(); //输出 "red"
oCar2.showColor(); //输出 "blue"

3.下面来看使用this的一些情况

示例一

var name = "The Window";
var object = {
name : "My Object", getNameFunc : function(){
return function(){
return this.name;
};
}
}; alert(object.getNameFunc()()); //"The Window"

上面代码先创建了一个全局变量name,又创建了一个包含name属性的对象。这个对象还包含一个方法-getNameFunc(),它返回一个匿名函数,而这个匿名函数又返回this.name。由于getNameFunc()返回一个函数因此调用object.getNameFunc()()就会立即调用它的返回的函数,最后返回了全局name变量的值The Window。为什么没有返回My Object?

解释:每个函数在调用的时候,其活动对象都回自动取得两个变量:this和arguments。而调用object.getNameFunc()()返回的匿名函数是在全局环境中执行的,所以它的this指向就是window了。

那么如果要调用外部的this,有什么办法呢?通过把外部作用域中的this对象保存在一个闭包能够访问到的变量里,就可以让闭包访问该对象了,如下所示。

示例二

var name = "The Window";

var object = {
name : "My Object", getNameFunc : function(){
var that = this;
return function(){
return that.name;
};
}
}; alert(object.getNameFunc()()); //"MyObject"

这个例子与上面的例子区别是,在定义匿名函数之前,我们把this对象赋值给了一个名叫that的变量,从而使得this的值得到了固定。而定义了闭包,通过作用域链就能访问到that了。

示例三

function sayColor(color){
this.color=color;
alert(this.color);
}
function ClassB(sColor, sName) {
sayColor.call(this, sColor);//this是指classB的实例对象,将sayColor函数作为classB的实例对象方法调用,并传入了sColor参数。 // sayColor.apply(this, arguments);
this.name = sName;
this.sayName = function () {
alert(this.name);
};
}

理解JavaScript的this对象的更多相关文章

  1. 全面理解Javascript中Function对象的属性和方法

    http://www.cnblogs.com/liontone/p/3970420.html 函数是 JavaScript 中的基本数据类型,在函数这个对象上定义了一些属性和方法,下面我们逐一来介绍这 ...

  2. 三张图较为好理解JavaScript的原型对象与原型链

    最近从网上看到别人详细得讲解了js的原型对象和原型链,看完感觉是看得最清晰的一个,于是,摘录到自己博客里 对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与_ ...

  3. 深入理解JavaScript的闭包特性如何给循环中的对象添加事件

    初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript ...

  4. 深入理解javascript原型和闭包(1)——一切都是对象

    “一切都是对象”这句话的重点在于如何去理解“对象”这个概念. ——当然,也不是所有的都是对象,值类型就不是对象. 首先咱们还是先看看javascript中一个常用的函数——typeof().typeo ...

  5. 深入理解javascript原型和闭包(2)——函数和对象的关系

    上文(理解javascript原型和作用域系列(1)——一切都是对象)已经提到,函数就是对象的一种,因为通过instanceof函数可以判断. var fn = function () { }; co ...

  6. 深入理解javascript原型和闭包(1)---一切都是对象

    深入理解javascript原型和闭包(1)---一切都是对象 type函数输出的类型,在此列出: function show (x){ console.log(typeof(x));//undefi ...

  7. 如何给循环中的对象添加事件--深入理解JavaScript的闭包特性

    初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript ...

  8. 深入理解JavaScript的闭包特性 如何给循环中的对象添加事件(转载)

    原文参考:http://blog.csdn.net/gaoshanwudi/article/details/7355794 初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数 ...

  9. 深入理解Javascript window对象

    首先看我们的源代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> ...

随机推荐

  1. RabbitMQ - 任务队列

    这次我们试着实现这样一个小程序: 嗯,就是任务队列(task queue).不是将任务集中在一堆并一直等到所有任务一并完成为止,而是将每一个任务封装为一个消息,并将其发送到队列,后台的workers就 ...

  2. Oracle OCI操作UDT相关学习

    1.Oracle数据类型 Oracle的数据类型如下 字符串类型 char nchar varchar2 nvarchar2 数值类型 int number integer smallint 日期类型 ...

  3. CentOS Linux 7.3 1611 (Core) 配置静态IP地址

    详见: http://blog.csdn.net/johnnycode/article/details/50184073 设置静态IP 关于静态IP设置官方已经给出答案有兴趣的可以看官方WIKI指导, ...

  4. python 中 \n 和转义r的作用和\r的实际应用

    我们先看看这张转义字符图: 1. 知识储备 \r 表示将光标的位置回退到本行的开头位置 \b 表示将光标的位置回退一位 在 python 语言中, 使用 print 打印输出时,默认是会进行换行的.如 ...

  5. html简介(自己理解和老师讲课)

    首先讲开发网页三种技术:html,css,javascript.html负责网页的结构,css站在没学角度对网页进行美化,javascript负责网页交互,站在用户体验角度设计网页交互效果 而我们所学 ...

  6. vue双向绑定笔记

    原文:https://github.com/louzhedong/blog/issues/4 <!DOCTYPE html> <html lang="en"> ...

  7. 浅谈PVC塑料配方计算软件的设计

    1, 配方设计与配方计算 题目是配方计算,不是配方设计,设计是需要有深厚的塑料知识才可以做的,即生产什么塑料产品,需要放各种原料是什么,各自比较是多少,遇到什么情况下就要多放什么,少放什么.配方设计不 ...

  8. Python爬虫教程-21-xpath 简介

    本篇简单介绍 xpath 在python爬虫方面的使用,想要具体学习 xpath 可以到 w3school 查看 xpath 文档 xpath文档:http://www.w3school.com.cn ...

  9. 用Eclipse创建第一个Spring项目(最最入门级)

    http://blog.csdn.net/shymi1991/article/details/48085955 网上关于Spring的介绍资料已经数不胜数,但大多篇幅冗长,初学者不易理解记忆.这里先作 ...

  10. maven学习(七)后续扩展、资料

    写这几篇博客的来源是 "maven实战 + 网上的博客 + 平时使用的心得 ".记录的都是比较常用的东西,也有一些只做了大概了解.或者干脆直接略过,在这里做一下总结,如果有需要在进 ...