call、apply、bind的异同
一、call、apply、bind的异同
JavaScript中函数可以通过3种方法改变自己的this指向,它们是call、apply、bind。它们3个非常相似,但是也有区别。下面表格可以很直观看出三者的不同
方法 | 是否直接执行函数 | 传入的参数 | 调用方式 |
call | 是 |
(context,arg1,arg2,arg3...) 第二个参数之后都是实参 |
function.call(context,arg1,arg2,arg3...) |
apply | 是 |
(context,[arg1,arg2,arg3...]) 第二个参数必须是数组 |
function.apply(context,[arg1,arg2,arg3...]) |
bind | 否 |
(context) 只有一个参数 |
var newFunction = function.bind(context); newFunction(arg1,arg2,arg3...) |
二、实例:
1、call
1
|
var a = {x: 1}; var b = function (y, z) { console.log( this .x + y + z) }; b.call(a, 3, 4); //此时b的this(即b执行时的上下文)被改变为a,因此this.x为1,第二个参数之后都是传给b实参。 |
2、apply
1
|
var a = {x: 1}; var b = function (arr) { console.log( this .x + arr[0] + arr[1]) }; b.call(a, [3, 4]); //此时b的this(即b执行时的上下文)被改变为a,第二个参数是一个数组 |
3、bind
1
|
var a = {x: 1}; var b = function (y, z) { console.log( this .x + y + z) }; var newB = b.bind(a); //此时b的this(即b执行时的上下文)被改变为a,由此生成一个新函数,函数不会立即执行。 newB(3, 4);//函数此时才执行 |
三、常用场景
1、数组之间追加
1
|
var array1 = [12, "foo" , {name: "Joe" }, -2458]; var array2 = [ "Doe" , 555, 100]; Array.prototype.push.apply(array1, array2); /* array1 值变为 [12 , "foo" , {name:"Joe"} , -2458 , "Doe" , 555 , 100] */
|
2、获取数组中的最大值和最小值
1
|
var numbers = [5, 458, 120, -215]; var maxInNumbers = Math.max.apply(Math, numbers); //458 |
3、验证是否是数组(前提是toString()方法没有被重写过)
1
|
function isArray(obj){ return Object.prototype.toString.call(obj) === '[object Array]' ; } |
4、类(伪)数组使用数组方法
1
|
var domNodes = Array.prototype.slice.call(document.getElementsByTagName( "*" )); |
5、数字求和
1
|
function sum() { var numberSum = Array.prototype.reduce.apply(arguments, [ function (prev, next) { return prev + next; }]); console.log(numberSum); } sum(1, 2, 3); |
call、apply、bind的异同的更多相关文章
- 图解call、apply、bind的异同及各种实战应用演示
一.图解call.apply.bind的异同 JavaScript中函数可以通过3种方法改变自己的this指向,它们是call.apply.bind.它们3个非常相似,但是也有区别.下面表格可以很直观 ...
- 学习前端的菜鸡对JS的call,apply,bind的通俗易懂理解
call,apply,bind 在JavaScript中,call.apply和bind是Function对象自带的三个方法,都是为了改变函数体内部 this 的指向. a ...
- call,apply,bind的用法
关于call,apply,bind这三个函数的用法,是学习javascript这门语言无法越过的知识点.下边我就来好好总结一下它们三者各自的用法,及常见的应用场景. 首先看call这个函数,可以理解成 ...
- JavaScript中call,apply,bind方法的总结。
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user:"追梦子", fn:f ...
- call(),apply(),bind()与回调
1.call(),apply(),bind()方法 JavaScript 中通过call或者apply用来代替另一个对象调用一个方法,将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定 ...
- JS 的 call apply bind 方法
js的call apply bind 方法都很常见,目的都是为了改变某个方法的执行环境(context) call call([thisObj[,arg1[, arg2[, [,.argN]]]] ...
- javascript-this,call,apply,bind简述2
上节我们一起研究了this这个小兄弟,得出一个结论,this指向调用this所在函数(或作用域)的那个对象或作用域.不太理解的朋友可以看看上节的内容,这次我们主要探讨一下call(),apply(), ...
- javascript-this,call,apply,bind简述1
最近在系统的学习面向对象方面的知识,遇到的最大拦路虎就数this的指向,call,apply,bind函数的使用,单独抽出一天时间把这几个烦人的家伙搞定,去学习更深入的内容. 首先介绍一下this的一 ...
- call,apply,bind方法的总结
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user:"追梦子", fn:f ...
随机推荐
- 向文件写入一个数据块---write
函数原型:ssize_t write(int fd,const void *buf,size_t count); 参数说明:fd:文件描述符,buf:写入数据的缓冲区,count:写入数据的最大长度. ...
- part1:9-windows与Linux文件共享
1.winSCP 它是一个windows环境下使用SSH的开源图形化SFTP客户端.同时支持SCP协议.它主要功能就是在本地与远程计算机间安全的复制文件. 前提:Linux与windows能相互pin ...
- 2018.07.31 POJ1741Tree(点分治)
传送门 只是来贴一个点分治的板子(年轻时候写的丑别介意). 代码: #include<cstdio> #include<cstring> #include<algorit ...
- 着重基础之—构建工具—Maven的依赖管理
着重基础之—构建工具—Maven的依赖管理 项目构建利器Maven给我们开发人员带来了极大的便利,从繁琐的jar包管理中脱身的程序员终于可以有时间再进入另一个坑了. 我今天要给大家分享的内容是我在实际 ...
- Linux 系统运维常用命令
1 文件管理2 软件管理3 系统管理4 服务管理5 网络管理6 磁盘管理7 用户管理8 脚本相关9 服务配置==================================------------ ...
- 多网卡下对ServerSocket以TCP协议绑定IP和端口的测试
一.引言:之前开发TCP协议的程序(C#里是Socket为主)都是基于主机上只有一个IP的,后来项目里涉及到了主机需要同时连接内外和外网的情况,在该主机上部署着一套WCS系统和一套WMS系统:WCS系 ...
- jar 包和 mysql 服务器部署
(1)创建好本地服务器: navicat新建链接: 链接名:自定义,这里命名为test 配置同jar包 (2)给予登陆权限,loclhost_3306,右击选择“命令行界面”,输入如下: create ...
- oracl中的大数据类型clob
建表 create table test_name( test_id number(6) not null, img_data clob ); 在java中该表所对应的po为: class Tes ...
- POJ2653判断线段相交
POJ2653 题目大意:按顺序放木棒,问最后所有的木棒中上面没有木棒的木棒的索引是…… 思路:按理说线段相交的题目做的听多了,这个应该不算新鲜,但是这个题,还是让我学到了认真读题,面对这个题很容易想 ...
- PHP 7 安装 Memcache 和 Memcached 总结
Memcache 与 Memcached 的区别 Memcached 是 Memcache 的升级版,优化了 Memcache,并增加了一些操作方法.所以现在基本都是用最近版本的. PHP 7 下安装 ...