• JavaScript函数的方法


    在一个对象中绑定函数,称为这个对象的方法。

    在JavaScript中,对象的定义是:

      var xiaoming = {
            name:'小明';
            birth:1990;
        };

    但是,如果我们给xiaoming绑定一个函数,就可以做更多的事情,比如,写一个age()方法,返回xiaoming的年龄:

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

    绑定到对象上的函数称为方法,和普通函数也没啥区别,但是它在内部使用了一个this关键字。这是啥。

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

    如果我们拆开来写:

    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。

    apply

    虽然在一个独立的函数调用中,根据是否是stric模式,this指向undefined或者window,不过,我们还是可以控制this的指向的!

    要指定函数的this指向哪个对象,可以用函数本身的apply方法,它接收两个参数,第一个参数就是需要绑定的this变量,第二个参数是Array,表示函数本身的参数。

    用apply修复getAge()调用:

    function getAge() {
            var y = new Date().getFullYear();
            return y - this.birth;
        }
    
        var xiaoming = {
            name:'小明',
            birth:1990,
            age:getAge
        };
    
        xiaoming.age();//25
        getAge.apply(xiaoming,[]);//25,this指向xiaoming,参数为空

    另一个与apply()类似的方法是call(),唯一区别是:

    apply()把参数打包成Array再传入;

    call()把参数按顺序传入。

    比如调用Math.max(3,5,4),分别用apply()和call()实现如下:

      Math.max.apply(null,[3,5,4]);//5
       Math.max.call(null,3,5,4);//5

    对普通函数调用,我们通常把this绑定为null。

    装饰器

    利用apply(),我们还可以动态改变函数的行为。

    JavaScript的所有对象都是动态的,即使内置的函数,我们也可以重新指向新的函数。

    现在假定我们想统计一下代码移动调用了多少次parseInt(),可以把所有的调用都找出来,然后手动加上count +=1,不过这样太傻了,最佳方案是用我们自己的函数替换掉迷人的parseInt();

      var count = 0 ;
        var oldParseInt = function (){
            count += 1 ;
            return oldParseInt.apply(null,arguments);//使用原函数
        };
    
        //测试
        parseInt('10');
        parseInt('20');
        parseInt('30');
        count;//3
  • 相关阅读:
    论工作动力的来源是什么?答案是来自于实现自己的梦想
    向梦想者致敬
    内置函数,递归函数,模块与包,开发目录规范
    迭代器,生成器
    闭包函数,装饰器,语法糖
    函数对象,名称空间及查找,作用域
    函数调用与参数
    字符编码
    文件处理
    python 11.5数据类型及常用方法
  • 原文地址:https://www.cnblogs.com/yuanxinru321/p/7644412.html
Copyright © 2020-2023  润新知