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. 数数(高维DP)

    T1 数数 [问题描述] fadbec 很善于数数,⽐如他会数将 a 个红球,b 个黄球,c 个蓝球,d 个绿球排成⼀列,任意相邻不同⾊的数⽬. 现在 R 君不知道 fadbec 数的对不对,想让你也 ...

  2. 标题title出现不规则背景

    Html代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  3. 洛谷P5264 【模板】多项式三角函数

    题面 传送门 题解 据说有一个叫做欧拉公式的东西 \[e^{ix}=\cos(x)+i\sin(x)\] 别问我为啥我今天第一次看到它 那么显然也有 \[e^{-ix}=\cos(x)-i\sin(x ...

  4. jquery源码解析:jQuery延迟对象Deferred(工具方法)详解2

    请接着上一课继续看. $.Deferred()方法中,有两个对象,一个是deferred对象,一个是promise对象. promise对象有以下几个方法:state,always,then,prom ...

  5. P4098 [HEOI2013]ALO 可持久化01Trie

    $ \color{#0066ff}{ 题目描述 }$ Welcome to ALO ( Arithmetic and Logistic Online).这是一个 VR MMORPG, 如名字所见,到处 ...

  6. 搭建gogs

    https://blog.csdn.net/hwm_life/article/details/82969005 服务器环境 CentOS 7 64位 安装Gogs所需的其它环境 需要安装的依赖有Ngi ...

  7. logo back 日志 发送邮件

    <?xml version="1.0" encoding="UTF-8"?> <configuration> <!--<pr ...

  8. StringBuffer与StringBuilder的区别比较

    关于AbstractStringBuilder 首先通过查看源码发现,StringBuffer与StringBuilder都继承自AbstractStringBuilder抽象类.而AbstractS ...

  9. 洛谷 P3227 [HNOI2013]切糕(最小割)

    题解 Dinic求最小割 题目其实就是求最小的代价使得每个纵轴被分成两部分 最小割!!! 我们把每个点抽象成一条边,一个纵轴就是一条\(S-T\)的路径 但是题目要求\(|f(x,y)-f(x',y' ...

  10. MyEclipse配置,每次打开server中都没有weblogic

    最近在myeclipse新配了个weblogic,结果每次打开myeclipse在server中都看不到weblogic,得重新去配置页面走一遭才能出现.很麻烦. 后来在网上找了找,找到一个办法: 在 ...