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

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

代码如下:

         function each(arr, callback) {
for (var i = 0; i < arr.length; i++) {
callback(arr[i], i, arr[i]);
}
}
each(["zzq", "lihua", "bob"], function (i, val) {
console.log(this == val);
});

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

         function each(arr, callback) {
for (var i = 0; i < arr.length; i++) {
//callback.call(arr[i], i, arr[i]); //同下
callback.apply(arr[i], [i, arr[i]]);
}
}
each(["zzq", "lihua", "bob"], function (i, val) {
console.log(this == val);
});

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

     each: function( obj, callback ) {
var length, i = 0; if ( isArrayLike( obj ) ) {
length = obj.length;
for ( ; i < length; i++ ) {
if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
break;
}
}
} else {
for ( i in obj ) {
if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
break;
}
}
} return obj;
}

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

Javascript中call、apply函数浅析的更多相关文章

  1. JavaScript中的apply和call函数详解(转)

    每个JavaScript函数都会有很多附属的(attached)方法,包括toString().call()以及apply().听起来,你是否会感到奇怪,一个函数可能会有属于它自己的方法,但是记住,J ...

  2. JavaScript中的apply和call函数详解

    本文是翻译Function.apply and Function.call in JavaScript,希望对大家有所帮助 转自“http://www.jb51.net/article/52416.h ...

  3. 理解javascript中的回调函数(callback)【转】

    在JavaScrip中,function是内置的类对象,也就是说它是一种类型的对象,可以和其它String.Array.Number.Object类的对象一样用于内置对象的管理.因为function实 ...

  4. 前端学习 第二弹: JavaScript中的一些函数与对象(1)

    前端学习 第二弹: JavaScript中的一些函数与对象(1) 1.apply与call函数 每个函数都包含两个非继承而来的方法:apply()和call(). 他们的用途相同,都是在特定的作用域中 ...

  5. 理解和使用 JavaScript 中的回调函数

    理解和使用 JavaScript 中的回调函数 标签: 回调函数指针js 2014-11-25 01:20 11506人阅读 评论(4) 收藏 举报  分类: JavaScript(4)    目录( ...

  6. [转]理解与使用Javascript中的回调函数

    在Javascript中,函数是第一类对象,这意味着函数可以像对象一样按照第一类管理被使用.既然函数实际上是对象:它们能被“存储”在变量中,能作为函数参数被传递,能在函数中被创建,能从函数中返回. 因 ...

  7. 【JavaScript】理解与使用Javascript中的回调函数

    在Javascript中,函数是第一类对象,这意味着函数可以像对象一样按照第一类管理被使用.既然函数实际上是对象:它们能被“存储”在变量中,能作为函数参数被传递,能在函数中被创建,能从函数中返回. 因 ...

  8. javascript中的apply,call,bind详解

    apply.call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向. Jav ...

  9. javascript中call,apply,bind的用法对比分析

    这篇文章主要给大家对比分析了javascript中call,apply,bind三个函数的用法,非常的详细,这里推荐给小伙伴们.   关于call,apply,bind这三个函数的用法,是学习java ...

  10. JavaScript 中的回调函数

    原文:http://javascriptissexy.com/ 翻译:http://blog.csdn.net/luoweifu/article/details/41466537 [建议阅读原文,以下 ...

随机推荐

  1. 开启虚拟机所报的错误:VMware Workstation cannot connect to the virtual machine. Make sure you have rights to run the program, access all directories the program uses, and access all directories for temporary fil

    当我们开启虚拟机时出现错误: VMware Workstation cannot connect to the virtual machine. Make sure you have rights t ...

  2. 剑指Offer - 九度1369 - 字符串的排列

    剑指Offer - 九度1369 - 字符串的排列2014-02-05 21:12 题目描述: 输入一个字符串,按字典序打印出该字符串中字符的所有排列.例如输入字符串abc,则打印出由字符a,b,c所 ...

  3. 【Remove Duplicates from Sorted List 】cpp

    题目: 第一次刷的时候漏掉了这道题. Given a sorted linked list, delete all duplicates such that each element appear o ...

  4. 发布“豪情”设计的新博客皮肤-darkgreentrip

    豪情 (http://www.cnblogs.com/jikey/)是一名在上海的前端开发人员,长期驻扎在园子里.他为大家设计了一款新的博客皮肤——darkgreentrip. 以下是该博客皮肤的介绍 ...

  5. webstrom11 vue插件配置

    直接上图 1. 安装vue插件 2.添加模板 3.指定模板类型 最新的是插件 是 vue.js 创建完 Vue File 文件后 需要在 下面这里关联一下

  6. Google浏览器历史版本下载地址和驱动器对应关系地址分享

    Google浏览器历史版本下载地址https://www.slimjet.com/chrome/google-chrome-old-version.php google webdriver下载地址分享 ...

  7. linux shell 总结 (整理)

    ls /usr/bin/ info #路径操作 dirname basename #“”和‘’与 ` ` 在shell变量中的区别 “ ” 允许通过$符引用其他变量 ‘’禁止引用其他变量符,视为普通字 ...

  8. Python 第一周编程作业

    一.  编程题 1.  结合turtle库使用手册,读懂下列代码,并在jupyter编译器中运行观察结果: 依次分析下代码: 第一行 通过保留字import引用了Python中用于绘制图形的turtl ...

  9. ImportError: dynamic module does not define module export function (PyInit__caffe)

    使用python3运行caffe,报了该错误. 参考网址:https://stackoverflow.com/questions/34295136/importerror-dynamic-module ...

  10. cinatra--一个高效易用的c++ http框架

    cinatra是一个高性能易用的http框架,它是用modern c++(c++17)开发的,它的目标是提供一个快速开发的c++ http框架.它的主要特点如下: 统一而简单的接口 header-on ...