• Javascript中call、apply函数浅析


    call/apply函数作用其实就是改变this的取值,有一句话是:谁调用的这个方法那方法里的this就是指谁,而有时我们会需要改变this值,所以call/apply就能派上用场。

    下面我写个方法来模拟JQuery中的each方法来加深对call/apply函数的理解

    代码如下:

    1         function each(arr, callback) {
    2             for (var i = 0; i < arr.length; i++) {
    3                 callback(arr[i], i, arr[i]);
    4             }
    5         }
    6         each(["zzq", "lihua", "bob"], function (i, val) {
    7             console.log(this == val);
    8         });

    这都知道肯定是打印出来false,因为each里的this是指window,只要我们稍微改造一下

    1         function each(arr, callback) {
    2             for (var i = 0; i < arr.length; i++) {
    3                 //callback.call(arr[i], i, arr[i]); //同下
    4                 callback.apply(arr[i], [i, arr[i]]);
    5             }
    6         }
    7         each(["zzq", "lihua", "bob"], function (i, val) {
    8             console.log(this == val);
    9         });

    这时候打印出来就是true了,因为call/apply方法可以改变this的取值,查看JQuery源码的each方法可以发现,实现也是如此

     1     each: function( obj, callback ) {
     2         var length, i = 0;
     3 
     4         if ( isArrayLike( obj ) ) {
     5             length = obj.length;
     6             for ( ; i < length; i++ ) {
     7                 if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
     8                     break;
     9                 }
    10             }
    11         } else {
    12             for ( i in obj ) {
    13                 if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
    14                     break;
    15                 }
    16             }
    17         }
    18 
    19         return obj;
    20     }

    最后总结下:call和apply方法作用是完全一样的,只是apply中参数是用数组传递,在不清楚参数个数时可以使用apply,反之使用call

  • 相关阅读:
    .NET破解之百分百营销软件系列
    未在本地计算机上注册“microsoft.ACE.oledb.12.0”提供程序
    .NET破解之百度网盘批量转存工具
    The system clock has been set back more than 24 hours
    64位系统中读写注册表
    FME2014汉化问题
    FME中Cass扩展属性转Shp的方法
    Hosts文件小结
    浅谈Java中的equals和==
    mysql读写分离
  • 原文地址:https://www.cnblogs.com/zuqing/p/5349868.html
Copyright © 2020-2023  润新知