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. 881. Boats to Save People

    The i-th person has weight people[i], and each boat can carry a maximum weight of limit. Each boat c ...

  2. OCP 12c最新考试原题及答案(071-6)

    6.(4-21) choose the best answer: View the Exhibit and examine the structure of the CUSTOMERS table. ...

  3. 三,Smarty模板技术/引擎——变量操作(2)

    1, 变量的分类 ① 从PHP中分配的变量,比如a.php跳转到b.php时候,可以在a.php中分配变量,b.tpl中直接调用.a.php中代码,$smarty->assign(‘str’,’ ...

  4. maven中archetype(原型)的使用

    原文链接:https://www.cnblogs.com/snowstar123/p/3449349.html 最近项目组做好一套框架,为了推广需要创建一些空白项目给项目组使用,因为所有的空白项目里面 ...

  5. iOS开发之动画中的时间(概况)

    一.引言 在iOS开发中使用动画时,可以通过设置动画的duration.speed.begintime.offset属性,来设置动画的时长.速度.起始时间及起始偏移. 用一个简单的例子来说明各个参数的 ...

  6. POJ2279 Mr Young's Picture Permutations

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

  7. windows下webpack不是内部命令 解决方法

    安装webpack 到打包文件一路出现的各种问题 windows下webpack不是内部命令 安装完webpack后要加下环境变量 系统变量新建 NODE_PATH 变量值E:\demo\webpac ...

  8. [转] crontab命令

    [From] http://man.linuxde.net/crontab   当前位置:首页 » 系统管理 » crontab crontab命令 crontab命令被用来提交和管理用户的需要周期性 ...

  9. 分分钟钟学会Python -基础&运算符

    day002 基础&运算符 1.循环语句 ### 1.循环格式 while 条件: print('') ''' while True: print('人生苦短,我用Python.') ''' ...

  10. thinkPhP + Apache + PHPstorm整合框架

    最近在学习使用 ThinkPhP,网上很多都是用一些整合好的服务框架,为了学习,在这里我简单的对Apache.PHP做一个原生的整合,希望对你有帮助. 步骤: ①下载 thinkPHP.PHP.Apa ...