js中有三个改变this指针的方法,分别是 apply,call,bind。很多人只知道能改变的this,但是具体的适用场景不是太清楚。我也是遇到坑后不断的实践发现了区别。

call ,apply方法:

 function Product(name, price) {
this.name = name;
this.price = price;
} function Food(name, price) {
Product.call(this, name, price);
  
this.category = 'food';
} console.log(new Food('cheese', 5).name);
// expected output: "cheese"

在Food类中,因为使用了call改变类Product的类的this执向。所以这个时候在Product 中this定义的两个私有属性却成了Food类new出来对象的。这种方式实现了类似继承的概念,这种方式叫做call继承。

其中call第一个参数表示的是修改的类的this指向值,后面两个name,price都是做为参数传递到Product中。最后在执行这条语句的时候,会执行一下Product这个类(函数)。也就是call就会执行一下 ‘’.‘’ 符号之前的类或者函数。

apply相对call来说也是执行了一下函数或者类,只是参数传递进行了组装。如果要进行apply修改,第7句话就可以表达为 Prpduct.apply(this,[name,price]); 可以把要传递的参数进行数组化。

bind:

bind是es6中新推出的修改this的方法。但是他和传统的call,apply区别就是函数或者类的this修改后没有执行,而是在程序代码检测时已经对代码的this指向进行了修改。那么有什么用呢?

比如我这个时候需要用DOM2级别的事件绑定 :

document.addEventListener('click',fn);
fn(){
this.name='yangkun'
}
//这里我们给document元素对象添加了一个点击事件方法fn;
var obj={name:'zhansan'};
fn.call(obj);
我们需要的是修改fn中的this,指向是obj中的name.是如果这样做,会有一个问题就是,函数fn已经被执行了!实际上我们绑定的click事件对应的是一个函数返回值(这里没有返回值,实际上点击事件绑定了null),而不是我们希望绑定的方法!

这个时候如果我们使用fn.bind(obj)就没问题了。方法没有执行。

后记:JavaScript早期版本没有类,但是大家发现通过new可以实现类似后台语言的语法方式。自然把进行new 的函数说成类。  js 函数有三态,普通函数,类,对象。这个是ES6之前函数的三态。

apply,call,bind区别的更多相关文章

  1. JS之apply,call,bind区别

    为了加深对基础知识的理解,今天再复习下js中的apply,call,bind的区别和用法.整理笔记的过程也是一个再次学习的过程. apply和call js中的调用apply和call方法可以改变某个 ...

  2. call和apply和bind区别

    call和apply特征一样 都是用来调用函数 立即调用 但是可以在调用函数的同时 通过第一个参数指定函数内部this的指向 call 调用的时候 参数必须以参数列表的形式进行传递 也就是以逗号分隔的 ...

  3. javascript中apply,call,bind区别,bind兼容等问题总结

    1 三者的相似之处: (1).都是用来改变函数的this对象的指向的 (2).都是用第一个参数来做this对象的指向 (3).都可以传参数进去 那么,具体到它们有什么区别呢?请看下面的例子: 两个对象 ...

  4. call(),apply(),bind()区别?

    每个函数都包含两个非继承而来的方法,apply()和call(),这两方法的用途都是在特定的作用域中调用函数,实际上等于设置函数数体内的this对象的值. apply()和call()第一个参数都一样 ...

  5. call、apply、bind 区别

    1.为什么要用 call .apply? 为了 改变方法里面的属性而不去改变原来的方法 function fruits() {} fruits.prototype = { color: "r ...

  6. 数组去重,call、apply、bind之间的区别,this用法总结

    一.数组去重,直接写到Array原型链上. //该方法只能去除相同的数字 不会去判断24和'24'是不同的 所有数字和字符串数字是相同是重复的 Array.prototype.redup=functi ...

  7. JS 中的this指向问题和call、apply、bind的区别

    this的指向问题 一般情况下this对象指向调用函数的对象,全局环境中执行函数this对象指向window. function a(){ console.log(this); //输出函数a中的th ...

  8. call,apply,bind的用法与区别

    1.call/apply/bind方法的来源 首先,在使用call,apply,bind方法时,我们有必要知道这三个方法究竟是来自哪里?为什么可以使用的到这三个方法? call,apply,bind这 ...

  9. call apply bind 区别?

    call apply bind 区别? 例:定义一个计算器,没绑定bind的为公共计算器,call可以调用,绑定bind的为私人计算器,别人调用不了, //ps:用bind绑定的call强制作借用不好 ...

随机推荐

  1. 你不知道的JavaScript--Item33 跨域总结与解决的方法

    一.神马是跨域(Cross Domain) 说白点就是post.get的url不是你当前的站点,域名不同.比如在*aaa.com/a.html*里面,表单的提交action是bbb.com/b.htm ...

  2. buaa 1033 Easy Problem(三分)(简单)

    Easy Problem 时间限制:1000 ms  |  内存限制:65536 KB 描写叙述 In this problem, you're to calculate the distance b ...

  3. jquery.validate.js插件的使用方法

    近期做项目.须要用到 jQuery.validate.js插件,于是记录一下工作中的一些经验,以便日后学习. [样例例如以下] 1.前台页面 <form id="form1" ...

  4. Android - Error: &quot;java.io.IOException: setDataSource failed.: status=0x80000000&quot;

    Error: "java.io.IOException: setDataSource failed.: status=0x80000000" 本文地址: http://blog.c ...

  5. 【Discuz】去除版权信息,标题栏与底部改动

    这篇文章尽管是介绍怎么把Discuz!的版权信息怎么搞得无影无踪,可是还是建议在不影响论坛视觉效果的情况下,保留Discuz的版权信息,毕竟它为我奉献了一个这么出色的开源论坛的phpproject.主 ...

  6. https://www.threatminer.org/domain.php?q=blackschickens.xyz ——域名的信誉查询站点 还可以查IP

    https://www.threatminer.org/domain.php?q=blackschickens.xyz https://www.threatminer.org/host.php?q=6 ...

  7. B1295 [SCOI2009]最长距离 最短路

    就是一道最短路的裸题,直接跑spfa就行了.(spfa死了) 最后在答案处判断是否障碍物太多,然后就直接找最大值就行. (数据特别水,我错误算法60) 题干: Description windy有一块 ...

  8. K-means algorithm----PRML读书笔记

    The K-means algorithm is based on the use of squared Euclidean distance as the measure of  dissimila ...

  9. PCB 全景图技术实现

    为了对3D模型理解更透,这里采用threejs(WebGL第三方库)实现,刚开始学习入门,为了能看明白基本上每行代码都注释. 如果仅仅是为了实现全景图,可以用photo-sphere-viewer.j ...

  10. git clone 出现错误

    看了好多资料终于搞定了git 中clone命令报错这个问题,废话不多说直接上步骤希望对大家有帮助. 1   删除.ssh文件夹(直接搜索该文件夹)下的known_hosts(手动删除即可,不需要git ...