this是函数运行时自动生成的一个内部对象,只能在函数内部使用,但总指向调用它的对象。

通过以下几个例子加深对this的理解。

(1)作为函数调用

var name = 'Jenny';
function person() {
return this.name;
}
console.log(person()); //Jenny

上面这个例子在全局作用域中调用person(),此时的调用对象为window,因此this指向window,在window中定义了name变量,因此this.name相当于window.name,为Jenny。

再看下面一个例子:

function a() {
function b() {
function c() {
console.log(this);
}
c();
}
b();
}
a(); // window

这个例子中,也同为函数调用,因此this指向window。

(2)作为对象的方法调用

var name = 'Jenny';
var obj = {
name: 'Danny',
person: function() {
return this.name;
}
};
console.log(obj.person()); //Danny

在这个例子中,person()函数在obj对象中定义,调用时是作为obj对象的方法进行调用,因此此时的this指向obj,obj里面定义了name属性,值为Danny,因此this.name = "Danny"。

(3)作为构造函数调用

作为构造函数调用和普通函数调用的区别是,构造函数使用new关键字创建一个实例,此时this指向实例对象。

function person() {
return new person.prototype.init();
}
person.prototype = {
init: function() {
return this.name;
},
name: 'Brain'
};
console.log(person().name); //undefined

这是一个比较复杂的例子,涉及到了原型。

首先,创建构造函数person,为函数重新定义原型,在原型上定义了两个方法init和name,其中init返回this.name。

调用person函数的name属性,发现返回的是undefined,为什么不是Brain呢?

我们看,调用person,返回person.prototype.init()的一个实例,假设返回的这个实例名为a,那么此时的this指向的就是a,a作为person.prototype.init()的一个实例,那么所有定义在person.prototype.init()中的方法等都可以被a调用,但是name属性定义在person的原型中,而非init函数中,因此返回undefined。

(4)apply和call

使用apply()和call()可以改变调用函数的对象,第一个参数为改变后调用这个函数的对象,其中apply()的第二个参数为一个数组,call的第二个参数为每个参数。

function person() {
return this.name;
}
var obj = {
name: 'Jenny',
age: 18
};
console.log(person.apply(obj)); //Jenny

使用apply函数改变了调用person的对象,是在obj对象下面调用person,不再是在window对象下调用了,因此this指向obj,this.name = "Jenny";

参考:http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html

http://www.cnblogs.com/aaronjs/p/3278578.html

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

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

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

  2. js对象详解(JavaScript对象深度剖析,深度理解js对象)

    js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了. JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...

  3. Javascript对this对象的理解

    在JavaScript中this表示函数运行的时候自动生成的一个内部对象,只能在函数内部使用,下面是一个简单的例子: function test(){ alert(this == window); } ...

  4. JavaScript 基础回顾——对象

    JavaScript是基于对象的解释性语言,全部数据都是对象.在 JavaScript 中并没有 class 的概念,但是可以通过对象和类的模拟来实现面向对象编程. 1.对象 在JavaScript中 ...

  5. javascript中的对象,原型,原型链和面向对象

    一.javascript中的属性.方法 1.首先,关于javascript中的函数/“方法”,说明两点: 1)如果访问的对象属性是一个函数,有些开发者容易认为该函数属于这个对象,因此把“属性访问”叫做 ...

  6. JavaScript内置对象与原型继承

    (一)   理解JavaScript类定义 1>关于内置对象理解 console.log(Date.prototype.__proto__===Object.prototype    //tru ...

  7. (转)javascript中的对象查找

    本文转自:http://otakustay.com/object-lookup-in-javascript/  ---很棒的一篇文章,作者的其他文章还暂时没读,但相信作者是一个谦虚 谨慎的好工程师 近 ...

  8. javascript第一弹——对象

    一. 什么是对象 对象是包含一组变量(称为属性)和函数(称为方法)的集合的实例. javascript中所有事物都是对象 javascript有很多内建对象 javascript允许自定义对象 对象只 ...

  9. 第一百一十三节,JavaScript文档对象,DOM基础

    JavaScript文档对象,DOM基础 学习要点: 1.DOM介绍 2.查找元素 3.DOM节点 4.节点操作 DOM(Document Object Model)即文档对象模型,针对HTML和XM ...

随机推荐

  1. iOS开发零碎知识点

    记录一些常用和不常用的iOS知识点,防止遗忘丢失.(来源为收集自己项目中用到的或者整理看到博客中的知识点),如有错误,欢迎大家批评指正:如有好的知识点,也欢迎大家联系我,添加上去.谢谢! 一.调用代码 ...

  2. ES数据-MySql处理Date类型的数据导入处理

    用ES的小伙伴们,相信大家都遇到过Mapping处理Date类型的数据头疼问题吧. 不用头疼了,我来给你提供一种解决方案: 1.Maping定义为: {  "mappings": ...

  3. 如何在Python中实现这五类强大的概率分布

    R编程语言已经成为统计分析中的事实标准.但在这篇文章中,我将告诉你在Python中实现统计学概念会是如此容易.我要使用Python实现一些离散和连续的概率分布.虽然我不会讨论这些分布的数学细节,但我会 ...

  4. CSS样式基础二

    一.列表 主要分为有序列表ol,无序列表ul <ul> <li></li> ... </ul> <ol> <li></li ...

  5. 我的nodejs学习之路1

    距离上次写文章类东西已经有4-5年了,猛然写东西有种提笔忘字的感觉. 言归正传,这是一篇记录我自己学习nodejs的文章,在写下这篇文章的时候我也不是什么大牛,也不是很了解nodejs这项技术.之所以 ...

  6. C# API项目代码正确 ,页面出不来的问题

    C# API项目代码正确  页面出不来的问题,截图如下: 解决方法: 在项目里设置好[起始页],就可以了.

  7. JavaScript对象的chapterII

    一.BOM对象 1.window对象——表示整个浏览器窗口 常用方法: a)alert()——系统消息框 alert('Hello World'); b)确认对话框——confirm() confir ...

  8. Arduino 极速入门系列 - 光控灯(1)- 关于理论和 LED 那些事

    点个 LED 闪亮好像太单调,这次来个光控 LED 灯.这个其实不需要 Arduino 也能做,这次只是用来演示一下 PWM 在 Arduino 里面的做法.PWM 原理后面会解释.这次用充电宝提供 ...

  9. 22.mongodb副本集集群

    软件版本64位:     $ wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel62-3.2.0.tgz     mongo ...

  10. c++初步实现的一个LRU

    #include<iostream>#include<map> using namespace std; typedef struct Node{ int data; stru ...