call、apply和bind的学习】的更多相关文章

相似之处:1.都是用来改变函数的this对象的指向的.2.第一个参数都是this要指向的对象.3.都可以利用后续参数传参. var xw = {  name : "小王",gender : "男" age : 24, say : function() {console.log(this.name + " , " + this.gender + " ,今年" + this.age); } var xh = {  name : &…
为了加深对基础知识的理解,今天再复习下js中的apply,call,bind的区别和用法.整理笔记的过程也是一个再次学习的过程. apply和call js中的调用apply和call方法可以改变某个函数执行的上下文环境,也就是可以改变函数内this的指向值. 例子: var person={ name:'aa', getName:function(){ console.log(this.name); } } var person2 = { name:'bb' } person.getName(…
写在前头: 本站内容为个人学习记录,纯属个人观点,不喜勿喷,欢迎指正! 笔记记录缘由:JavaScript的流行趋势已经势不可挡,衍生的AngularJs,Node.js,BootStrmp中小企业的后端开发越来越没有优势,IT不是一个可以完全靠经验说话的岗位,IT改变生活,作为一个三年的.Net程序员现在深深的感受到守旧其实就是害怕,躲避时代的进度,人生需要激情,需要动力! 正文: 一.apply().call(),bind()是做什么的? 这三个都是改变方法中this指向的 二.this是什…
1.什么是this 在JavaScript中this可以是全局对象.当前对象或者任意对象,这完全取决于函数的调用方式,this 绑定的对象即函数执行的上下文环境(context). 为了帮助理解,让我们来一起看一段代码: // 作为对象方法调用 var test = { a : 5, b : 6, sum : function () { return this.a + this.b; // 此处this = test } } alert(test.sum()); 作为对象调用时this很容易理解…
一直感觉代码中有call和apply就很高大上(看不懂),但是都草草略过,今天非要弄明白!以前总是死记硬背:call.apply.bind 都是用来修改函数中的this,传参时,call是一个个传参,apply是数组或者类数组形式传参,call和apply立即执行并且返回值是你调用的方法的返回值,若该方法没有返回值,则返回undefined.bind是改变this后返回一个新的函数,他不会立即执行.死记硬背的结果就是:总以为这三个方法改变了原方法的this,原方法的this就永久改变了!大错特错…
目录 引子 隐式丢失 硬绑定 实现及原理分析 总体实现(纯净版/没有注释) 写在最后 引子 读完<你不知道的JavaScript--上卷>中关于this的介绍和深入的章节后,对于this的指向我用这篇文章简单总结了一下.接着我就想着能不能利用this的相关知识,模拟实现一下javascript中比较常用到的call.apply.bind方法呢? 于是就有了本文,废话不多说全文开始! 隐式丢失 由于模拟实现中有运用到隐式丢失, 所以在这还是先介绍一下. 隐式丢失是一种常见的this绑定问题, 是…
apply,call,bind都是js给函数内置的一些api,调用他们可以为函数指定this的执行,同时也可以传参. call call 接收多个参数,第一个为函数上下文也就是this,后边参数为函数本身的参数. let obj = { name: "一个" } function allName(firstName, lastName) { console.log(this) console.log(`我的全名是"${firstName}${this.name}${lastN…
在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这三个方法进行详细的讲解,并列出几个经典应用场景. call(thisArgs [,args...]) 该方法可以传递一个thisArgs参数和一个参数列表,thisArgs 指定了函数在运行期的调用者,也就是函数中的 this 对象,而参数列表会被传入调用函数中.thisArgs 的取值有以下4种情…
在 javascript之 this 关键字详解 文章中,谈及了如下内容,做一个简单的回顾: 1.this对象的涵义就是指向当前对象中的属性和方法. 2.this指向的可变性.当在全局作用域时,this指向全局:当在某个对象中使用this时,this指向该对象:当把某个对象的方法赋值给另外一个对象时,this会指向后一个对象. 3.this的使用场合有:在全局环境中使用:在构造函数中使用,在对象的方法中使用. 4.this的使用注意点,最重要的一点就是要避免多层嵌套使用this对象. 对this…
为什么需要这些?主要是因为this,来看看this干的好事. box.onclick = function(){ function fn(){ alert(this); } fn();}; 我们原本以为这里面的this指向的是box,然而却是Window.一般我们这样解决: box.onclick = function(){ var _this = this; function fn(){ alert(_this); } fn();}; 将this保存下来. 还有一些情况,有时我们想让伪数组也能…
javascript在函数创建的时候除了自己定义的参数外还会自动新增this和arguments两个参数 javascript中函数也是对象,call.apply.bind函数就是函数中的三个函数,这三个函数的作用就是改变调用当前函数中this指向. call.apply.bind三个函数接收两个参数,第一个参数都是函数执行指向对象的this,第二参数是函数执行传递的参数数据,call和bind传递数据是变长参数,apply传递数据是数组.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,arg…
js里除了直接调用obj.func()之外,还提供了另外3种调用方式:apply.bind.call,都在function的原型里.这3种方法的异同在stackoverflow的这个答案里说的最清楚,下面只是自己的理解. 1. 异同 这3种方式的相同点是:改变了func调用的上下文,链接到新的对象上.这使得任何函数都可以被其他对象调用,即使这个对象没有定义该函数. 区别是:调用的方式不同. call: 最简单,立即调用,按顺序传参 apply:立即调用,按数组传参 bind: 延迟调用(返回一个…
1.参考资料 http://www.cnblogs.com/coco1s/p/4833199.html   2.归结如下 apply . call .bind 三者都是用来改变函数的this对象的指向的: apply . call .bind 三者第一个参数都是this要指向的对象,也就是想指定的上下文: apply . call .bind 三者都可以利用后续参数传参: bind 是返回对应函数,便于稍后调用:apply .call 则是立即调用 slice用于将含有length属性的对象(伪…
所有的函数都具有call(),apply()和bind()方法.它们可以在执行方法的时候用一个值指向this,并改变面向对象的作用域. apply方法: 以下的两种表达式是等价的: func(arg1,arg2,arg3) func.apply(null,[arg1,arg2,arg3]) apply()往往用在一个函数需要以数组的是形式接受多个参数时使用. 使用Math.max()来获得一个数组中最大的元素: Math.max.apply(null,[17,33,21]); call方法: 表…
JS中的call.apply.bind方法 一.call()和apply()方法 1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call 方法可以用来代替另一个对象调用一个方法.call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象. 如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj…
前言 回想起之前的一些面试,几乎每次都会问到一个js中关于call.apply.bind的问题,比如- 怎么利用call.apply来求一个数组中最大或者最小值 如何利用call.apply来做继承 apply.call.bind的区别和主要应用场景 虽然网上有很多关于这方面的博客和文章,但还是决定写一篇自己对这方面知识的理解. 作用 首先问个问题,这三个函数的存在意义是什么?答案是改变函数执行时的上下文,再具体一点就是改变函数运行时的this指向.有了这个认识,接下来我们来看一下,怎么使用这三…
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·JS(一)原型.原型链.构造函数和字符串(String) 前端总结·基础篇·JS(二)数组深拷贝.去重以及字符串反序和数组(Array) 前端总结·基础篇·JS(三)arguments.callee.call.apply.bind及函数封装和构造函数 目录 一.函数使用 1.1 函数声明和函数表达式 1.2 函数封装(自调用函数.闭包) 1.3 函数属性(a…
call和apply call和aplly作用完全一样,都是在特定的上下文中调用函数,或者说改变函数内部的this指向:区别仅在于接收参数的方式不同. var dog = { name: "dog" }; var cat = { name: "cat" }; var sayName = function (age, gender) { console.log(this.name + "," + age + "," + gend…
fun.apply(context,[argsArray]) 立即调用fun,同时将fun函数原来的this指向传入的新context对象,实现同一个方法在不同对象上重复使用. context:传入的对象,替代fun函数原来的this: argsArray:一个数组或者类数组对象,其中的数组参数会被展开作为单独的实参传给 fun 函数,需要注意参数的顺序. fun.call(context,[arg1],[arg2],[-]) 同apply,只是参数列表不同,call的参数需要分开一个一个传入.…
一.数组去重,直接写到Array原型链上. //该方法只能去除相同的数字 不会去判断24和'24'是不同的 所有数字和字符串数字是相同是重复的 Array.prototype.redup=function(){ var obj={}; for(var i=0;i<this.length;i++){ var val=this[i]; if(obj[val]==this[i]){ //如果发现重复的 this[i]=this[this.length-1]; //那就把最后一个赋值给当前的这个数组元素…
其实是一个很简单的东西,认真看十分钟就从一脸懵B 到完全 理解! 先看明白下面: 例1 obj.objAge;  //17 obj.myFun()  //小张年龄undefined 例2 shows()  //盲僧 比较一下这两者this 的差别,第一个this 指向obj,第二个全局声明的shows()函数   this 是window : 1,call().apply().bind() 都是用来重定义 this 这个对象的! 如: obj.myFun.call(db): //德玛年龄99  …
this的指向问题 一般情况下this对象指向调用函数的对象,全局环境中执行函数this对象指向window. function a(){ console.log(this); //输出函数a中的this对象 } function b(){}; var c={name:"call"}; //定义对象c var c = { getFunc:function(){ return function(){ console.log(this) } } } var cFun = c.getFunc…
在JavaScript中,call.apply和bind是Function对象自带的三个方法,这三个方法的主要作用是改变函数中的this指向. call.apply.bind方法的共同点和区别:apply . call .bind 三者都是用来改变函数的this对象的指向的:apply . call .bind 三者第一个参数都是this要指向的对象,也就是想指定的上下文(函数的每次调用都会拥有一个特殊值--本次调用的上下文(context)--这就是this关键字的值.):apply . ca…
一.前言 ECMAScript中的函数是对象,因此函数也有属性和方法.每个函数都包含两个属性:length和prototype.每个函数也包含两个非继承来的方法:apply()和call(),还有一些继承而来的方法,比如valueOf()等. 二.函数属性:length.prototype 2.1.length 函数希望接收的命名参数的个数,如: function sum(a,b){ return a+b; } sum.length ; //2 function add(){ } add.len…
在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这三个方法进行详细的讲解,并列出几个经典应用场景. 1.call(thisArgs [,args...]) 该方法可以传递一个thisArgs参数和一个参数列表,thisArgs 指定了函数在运行期的调用者,也就是函数中的 this 对象,而参数列表会被传入调用函数中.thisArgs 的取值有以下四…
重写apply, call, bind方法 //原生JavaScript封装apply方法,第四版 Function.prototype.applyFour = function(context) { var context = context || window var args = arguments[1] //获取传入的数组参数 var fn = Symbol() context[fn] = this //假想context对象预先不存在名为fn的属性 if (args == void 0…
说到call.apply.bind,前端的胖友可是不陌生.以下就从几个方面分别聊聊它们. 是什么?(what?) 实际上它们真正的样子是这样的: Function.prototype.call(thisArg, arg1, arg2, ...) Function.prototype.apply(thisArg, [arg1, arg2, ...]) Function.prototype.bind(thisArg, arg1, arg2, ...) 它们几个的作用都是改变this的指向. 三者有什…
1.call/apply/bind方法的来源 首先,在使用call,apply,bind方法时,我们有必要知道这三个方法究竟是来自哪里?为什么可以使用的到这三个方法? call,apply,bind这三个方法其实都是继承自Function.prototype中的,属于实例方法. 1 console.log(Function.prototype.hasOwnProperty('call')) //true 2 console.log(Function.prototype.hasOwnPropert…
call.apply.bind 1.相同也不同 我们先从浅显的部分开始讲, 这三个方法都可以改变this的指向,都可以进行传参,第一个参数都是修改this的指向 call() 和 apply() 改变this指向后会立即执行函数 bind() 改变this指向后不会立即执行 call() 和 apply() 区别在于参数 · call() 第一个参数是修改的this指向,后续的参数都是传入该函数的值,他的传值只能一个个传 · apply() 第一个参数是修改的this指向,第二个参数是一个数组,…