this属性表示当前对象,如果在全局作用范围内使用this,则指代当前页面对象window;

如果在函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用。

我们还可以使用apply和call两个全局方法来改变函数中this的具体指向。

先看一个在全局作用范围内使用this的例子:

  1.  < script type="text/javascript">
    console.log(this === window); // true
    console.log(window.alert === this.alert); // true
    console.log(this.parseInt("021", 10)); // 10
    < /script>

函数中的this属性是在运行时决定的,而不是函数定义时,如下:

  1.  // 定义一个全局函数
    function foo() {
    console.log(this.fruit);
    } // 定义一个全局变量,等价于window.fruit = "apple";
    var fruit = "apple"; // 此时函数foo中this指向window对象
    // 这种调用方式和window.foo();是完全等价的
    foo(); // "apple" // 自定义一个对象,并将此对象的属性foo指向全局函数foo
    var pack = {
    fruit: "orange",
    foo: foo
    }; // 此时函数foo中this指向pack对象
    pack.foo(); // "orange"

全局函数apply和call可以用来改变函数中this属性的指向,如下:

  1.  // 定义一个全局函数
    function foo() {
    console.log(this.fruit);
    } // 定义一个全局变量
    var fruit = "apple"; // 自定义一个对象
    var pack = {
    fruit: "orange"
    }; // 等价于window.foo();
    foo.apply(window); // "apple" // 此时foo中的this === pack
    foo.apply(pack); // "orange"

注:apply和call两个函数的作用相同,唯一的区别是两个函数的参数定义不同。

因为在JavaScript中函数也是对象,所以我们可以看到如下有趣的例子:

  1.  // 定义一个全局函数
    function foo() {
    if (this === window) {
    console.log("this is window.");
    }
    } // 函数foo也是对象,所以可以定义foo的属性boo为一个函数
    foo.boo = function() {
    if (this === foo) {
    console.log("this is foo.");
    } else if (this === window) {
    console.log("this is window.");
    }
    }; // 等价于window.foo();
    foo(); // this is window. // 可以看到函数中this的指向调用函数的对象
    foo.boo(); // this is foo. // 使用apply改变函数中this的指向
    foo.boo.apply(window); // this is window.(使用apply)

JavaScript对象中的this属性的更多相关文章

  1. JavaScript对象中的constructor属性

    constructor属性始终指向创建当前对象的构造函数. 比如下面的例子: // 等价于 var foo = new Array(1, 56, 34, 12); var arr = [1, 56, ...

  2. JavaScript对象中的属性(可写,可配置,可枚举,value,getter,setter)

    JavaScript中,对象包括3个特性,分别为,可扩展性,class标识符,属性. 如果对象的可扩展性为false,则不可为对象动态的添加属性.   对象包含分为存取器属性和值属性.存取属性为 {g ...

  3. JavaScript的事件对象中的特殊属性和方法(鼠标,键盘)

    鼠标操作导致的事件对象中的特殊属性和方法 鼠标事件是 Web 上面最常用的一类事件,毕竟鼠标还是最主要的定位设备.那么通过事件对象可以获取到鼠标按钮信息和屏幕坐标获取等 鼠标按钮 只有在主鼠标按钮被单 ...

  4. js对象中动态读取属性值 动态属性值 js正则表达式全局替换

    $(document).ready(function(){ var exceptionMsg = '${exception.message }'; var exceptionstr = ''; //j ...

  5. [记录] javascript 对象中使用setTimeout

    参考:Javascript对象中关于setTimeout和setInterval的this介绍 使用最后一个方法终于弄好了,简直了,在对象中使用setTimeout原来是这样的 做的是分钟倒计时,倒数 ...

  6. 在实体对象中访问导航属性里的属性值出现异常“There is already an open DataReader associated with this Command which must be closed first”

    在实体对象中访问导航属性里的属性值出现异常“There is already an open DataReader associated with this Command which must be ...

  7. 删除JavaScript对象中的元素

    参考http://stackoverflow.com/questions/208105/how-to-remove-a-property-from-a-javascript-object 通过dojo ...

  8. Javascript 对象的创建和属性的判定

    1. 创建对象的方法: 直接使用new 对Object对象进行操作,即对Object 对象进行实例化 <!DOCTYPE html> <html lang="en" ...

  9. Stream流用于按照对象中某一属性来对集合去重+简单数据类型集合的去重

    上次对Stream流来进行分组的文章很多人看,想看的可以来这: Stream流来进行集合分组 这次小编又带来Stream的去重,话不多数,直接上代码: 这是对简单数据类型的去重 //字符串集合进行简单 ...

随机推荐

  1. MongoDB高级知识

    MongoDB高级知识 一.mongodb适合场景: 1.读写分离:MongoDB服务采用三节点副本集的高可用架构,三个数据节点位于不同的物理服务器上,自动同步数据.Primary和Secondary ...

  2. 快速排序 java实现 (原理-优化) 三路快排

    一.基本的快速排序 在数组中选取一个元素为基点,然后想办法把这个基点元素移动到它在排好序后的最终位置,使得新数组中在这个基点之前的元素都小于这个基点,而之后的元素都大于这个基点,然后再对前后两部分数组 ...

  3. 当在安卓低版本呈现的界面(H5)出现问题的时候,我们怎么解决?

    昨天,在医院现场的客服人员,向我们反馈一个问题:说一位用户用他的安卓手机打开我们的app之后,界面是乱掉的:如下图: 向客服询问了具体的设备信息:安卓系统版本号是4.2 下意识觉得是因为css的兼容问 ...

  4. 2015-9-13 NOIP模拟赛解题报告(by hzwer)

    小奇挖矿 「题目背景」 小奇要开采一些矿物,它驾驶着一台带有钻头(初始能力值w)的飞船,按既定路线依次飞过喵星系的n个星球. 「问题描述」 星球分为2类:资源型和维修型. 1.资源型:含矿物质量a[i ...

  5. 题解 UVA11300 【Spreading the Wealth】

    环形均分纸牌问题应该不少人都很熟悉了,而且题解区写的也比较全了...... 我这篇题解主要是介绍一个新的STL--nth_element 以及解答几个其他题解里面有应用但是没有注释的问题.(比如说我第 ...

  6. jquery源码解析:jQuery静态属性对象support详解

    jQuery.support是用功能检测的方法来检测浏览器是否支持某些功能.针对jQuery内部使用. 我们先来看一些源码: jQuery.support = (function( support ) ...

  7. Python处理json数据--世界国家维度数据

    1.准备国家的json数据 将准备好的json数据放在指定的目录下,此处可以重这里下载 2.测试编写python脚本处理json提取字段值 #coding:utf8 import time, re, ...

  8. Mac环境下安装python库时出现ModuleNotFoundError: No module named 'XXX'

    在使用pip3安装爬虫的一些有关库时发现安装成功后,import时发现又找不到,后来发现一个解决方法. 在Anaconda-Navigator里面打开environment里面寻找发现真的没有,这时再 ...

  9. POJ2279 Mr Young's Picture Permutations

    POJ2279 Mr Young's Picture Permutations 描述: 有N个学生合影,站成左对齐的k排,每行分别有N1,N2…NK个人,第一排站最后,第k排站之前.学生身高依次是1… ...

  10. CSS 两个行内块元素,宽度相加刚好等于父盒子容器的元素,但第二个元素掉在第二行解决办法

    我们可以发现:两个行内块元素,宽度相加刚好等于父盒子容器的元素,但第二个元素掉在第二行,这是什么问题呢? 我们先来看一下效果: <!DOCTYPE html> <html lang= ...