js中每一个Function对象都有一个apply个一个call方法:

function.apply(thisObj,[argArray]);

function.call(thisObj,arg1,arg2);

一般来说this总是指向调用某个方法的对象,但是使用call和apply方法,就会改变this的指向。

调用对象的一个方法,用一个另一个对象替换当前的对象。

demo: A.apply(B,arguments);||A.call(B,arg1,arg2);

A对象应用B对象的方法,将一个函数的对象上下文从初始的上下文改变为thisObj指定的新对象。

apply 只能有两个参数,新的this对象和一个参数数组;call可以接受多个参数,一个新的this对象以及一个参数列表;

如果没有参数,默认thisObj是Global对象,并且没有参数传递

call与apply的功能是一样的,只是传入的参数列表形式不同。

主要应用在js对象方法互相调用的时候,使当前this实例指针保持一致,或者在特殊情况下需要改变 this指针。

什么情况使用apply,什么情况使用call

在给对象参数的情况下,

apply的一些其他巧妙用法

1 Max.max Max.min

Max.max参数是一个参数列表不支持数组参数,Max.max(param1,param2....);

demo:

获取数组中的最大值

let arr=[40,20,30,11,23];

使用apply可以这样使用:Max.max.apply(null,arr);也可以使用ES6,Max.max(...[arr]);

同样获取数组中的最小值也可以使用apply,

2 Array.prototype.push实现两个数组的合并。

let arr1=[1,2,3]; let arr2=[4,5,6];

Array.prototype.puah.apply(arr1,arr2); //返回新数组的长度

console.log(arr1);//[1,2,3,4,5,6]

一般在目标函数只需要n个参数列表,不接受一个数组形式,可以通过apply的方式巧妙的解决这个问题

3 把伪数组转换为普通的数组

var WArr={0:2,1:3,2:4,length:3};

let arr=[].slice.apply(WArr);//[2,3,4]

var divElements=document.getElementsByTagName('div');

Array.isArray(divElements);//false

Array.slice.apply(divElements);

Array.isArray(divElements);//true

4 验证一个对象的类型:

Object.prototype.toString.call(obj);

bind也是function对象自带的方法,也是为了改变函数体内部的this的指向。

不同点:bind是返回对应函数,便于稍后调用;apply call则是立即调用。

bind()方法会创建一个新函数,称为绑定函数,当调用这个绑定函数时,绑定函数会为创建它时传入bind()方法的第一个参数作为this,传入bind()方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数。

demo:

function fn1(x,y){

  console.log(this.a,x,y);

}
var obj={a:20};

var fn2=fn1.bind(obj,2);//获取一个新方法,this指向obj

fn2();// 20,2,undefined

fn2(3);//20,2,3

fn2(3,4);//20,2,3

在js中多次bind()是无效的;更深层次的原因,bind()的实现,相当于使用函数在内部包了一个call/apply;第二次bind()相当于再包住一次call/apply,所以第二次以后的bind是无法生效的。

var obj2={a:40};

var fn3=fn1.bind(obj).bind(obj2);

fin3(3,4);//20,,3,4

call,apply,bind与es6的数组扩展运算符...的更多相关文章

  1. es6 学习小记 扩展运算符 三个点(...)

    参考: es6 扩展运算符 三个点(...) 经常回顾,方能真正掌握. 一.含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. ...

  2. ES6学习笔记-扩展运算符(...)

    扩展运算符的定义: es6中引入扩展运算符(...),它用于把一个数组转化为用逗号分隔的参数序列. 它常用在不定参数个数时的函数调用,数组合并等情形. 用法一:不定参数个数时的函数调用 <scr ...

  3. 关于ES6的对象扩展运算符

    对象的扩展运算符(...),用于取出参数对象中的所有可遍历属性,然后拷贝到当前对象之中 对象扩展运算符: 1. 复制对象 let obj1 = { x: 1, y: 2, z: 3 } let obj ...

  4. ES6数组扩展运算符

    1 扩展运算符的运用 (1)复制数组 数组是复合的数据类型,直接复制的话,只是复制了指向底层数据机构的指针,而不是克隆一个全新的数组; const a1=[1,2]; const a2= a1; a2 ...

  5. 数组扩展运算符 -ES6

    1.将数组转为以逗号分隔的序列 2.格式 ...[1,2,3 ] 3.若扩展运算符后面是一个空数组,则不产生效果[ ] 4.用于函数参数 function add(x,y) { console.log ...

  6. (...)ES6三点扩展运算符

    扩展运算符将一个数组转为用逗号分隔的参数序列 console.log(...[a, b, c]) // a b c 用于: 1 将一个数组,变为参数序列 let add = (x, y) => ...

  7. es6可变参数-扩展运算符

    es5中参数不确定个数的情况下: //求参数和 function f(){ var a = Array.prototype.slice.call(arguments); var sum = 0; a. ...

  8. Vue的三个点es6知识,扩展运算符

    Vue中的三个点在不同情境下的意思 操作数组 //里面放自己定义的方法 methods: { /** * 把数组中的元素孤立起来 */ iClick() { let iArray = ['1', '2 ...

  9. ES6 rest与扩展运算符

    1.rest 变量将多余的参数放入数组中. function add(...values) { let sum = 0; for (var val of values) { sum += val; } ...

随机推荐

  1. Cocos2d-x初识

    cocos2d-x引擎是什么 在学习游戏的时候就有意的搜索这方面的知识,知道游戏须要游戏引擎,引擎听着非常厉害,只是就是一个游戏框架. 或许某一个游戏框架火起来了,就非常流行了,只是我觉得不论什么游戏 ...

  2. spring secrity 一些常用小知识

    1.在JSP页面获取当前登录的用户名的方法 首先引入taglib:<%@ taglib prefix="sec" uri="http://www.springfra ...

  3. C++11中的原子操作(atomic operation)(转)

    所谓的原子操作,取的就是“原子是最小的.不可分割的最小个体”的意义,它表示在多个线程访问同一个全局资源的时候,能够确保所有其他的线程都不在同一时间内访问相同的资源.也就是他确保了在同一时刻只有唯一的线 ...

  4. ZYThumbnailTableView---堪比一个小型阅读App

    Demo github地址: https://github.com/liuzhiyi1992/ZYThumbnailTableView 原文地址:http://zyden.vicp.cc/zythum ...

  5. Oracle 【to_number】【instr】

    需求:对一个包含数字的字符串排序 search后参考了  http://www.cnblogs.com/m-cnblogs/archive/2012/03/30/2425938.html 截屏: (用 ...

  6. 如何成为一个Linux内核开发者

    你想知道如何成为一个Linux内核开发者么?或者你的老板告诉你,“去为这个设备写一个Linux驱动.“这篇文档的目的,就是通过描述你需要 经历的过程和提示你如何和社区一起工作,来教给你为达到这些目的所 ...

  7. About me --- Connecting the dots

    在这个难以入眠的夜里,乔布斯年在斯坦福的演讲里说的“Connecting the dots”又萦绕耳际,即当我们往回看,就清楚了 自己曾经的生活和现在甚至将来是串联在一起的,这些经历决定了我们事业.生 ...

  8. WannaCry勒索病毒处理指南

    北京时间2017年5月12日晚,勒索软件"WannaCry"感染事件在全球范围内爆发,被攻击者电脑中的文件被加密,被要求支付赎金以解密文件: 1.开机前断网 如果电脑插了网线,则先 ...

  9. babylon使用3dsmax导出的obj文件时模型偏暗

    将模型的material的diffuseTexture设置为null即可

  10. WPF前台数据验证(红框)Validation.ErrorTemplate 附加属性

    WPF 显示验证错误的默认方式是在控件周围绘制红色边框.通常需要对此方法进行自定义,以通过其他方式来显示错误.而且,默认情况下不会显示与验证错误关联的错误消息.常见的要求是仅当存在验证错误时才在工具提 ...