zoukankan      html  css  js  c++  java
  • js方法-this

    var xiaoming = {
        name: '小明',
        birth: 1990,
        age: function () {
            var y = new Date().getFullYear();
            return y - this.birth;
        }
    };
    
    xiaoming.age; // function xiaoming.age()
    xiaoming.age(); // 今年调用是25,明年调用就变成26了
    

    在一个方法内部,this是一个特殊变量,它始终指向当前对象,也就是xiaoming这个变量。所以,this.birth可以拿到xiaomingbirth属性。

    function getAge() {
        var y = new Date().getFullYear();
        return y - this.birth;
    }
    
    var xiaoming = {
        name: '小明',
        birth: 1990,
        age: getAge
    };
    
    xiaoming.age(); // 25, 正常结果
    getAge(); // NaN
    

    单独调用函数getAge()怎么返回了NaN?请注意,我们已经进入到了JavaScript的一个大坑里。

    JavaScript的函数内部如果调用了this,那么这个this到底指向谁?

    答案是,视情况而定!

    如果以对象的方法形式调用,比如xiaoming.age(),该函数的this指向被调用的对象,也就是xiaoming,这是符合我们预期的。

    如果单独调用函数,比如getAge(),此时,该函数的this指向全局对象,也就是window

    var fn = xiaoming.age; // 先拿到xiaoming的age函数
    fn(); // NaN
    

    要保证this指向正确,必须用obj.xxx()的形式调用!

    'use strict';
    
    var xiaoming = {
        name: '小明',
        birth: 1990,
        age: function () {
            var that = this; // 在方法内部一开始就捕获this
            function getAgeFromBirth() {
                var y = new Date().getFullYear();
                return y - that.birth; // 用that而不是this
            }
            return getAgeFromBirth();
        }
    };
    
    xiaoming.age(); // 25
    

    var that = this;,你就可以放心地在方法内部定义其他函数,而不是把所有语句都堆到一个方法中。

  • 相关阅读:
    svn-Subversion
    英语学习-2020年4月
    自动化-研究
    数据库-存储过程
    未来软件测试的发展趋势
    学习alex---人生导师
    自动化测试-----总结
    接口测试总结
    jmeter-接口测试项目
    接口测试jmeter
  • 原文地址:https://www.cnblogs.com/xiaoxiaof/p/9778763.html
Copyright © 2011-2022 走看看