js中call()和apply()改变指针问题的讲解


Posted in Javascript onJanuary 17, 2019

1. 每个函数都包含两个非继承而来的方法:call()方法和apply()方法。(天生的)

2. 相同点:这两个方法的作用是一样的。

都是在特定的作用域中调用函数,等于设置函数体内this对象的值,以扩充函数赖以运行的作用域。

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

call有两个妙用:

  •           1: 继承。
  •           2: 修改函数运行时的this指针。

js中call()和apply()改变指针问题的讲解

js中call()和apply()改变指针问题的讲解

区别:call和apply的区别在于call的第二个参数可以是任意类型,而apply的第二个参数必须是数组或者arguments

<script>
  //一般来说,this总是指向调用某个方法的对象,但是使用call()和apply()方法时,就会改变this的指向。
  /*
  call方法:
  语法:call(thisObj,arg1,arg2,……,argN)
  定义:调用一个对象的一个方法,以另一个对象替换当前对象
  参数
    thisObj;可选项,将被用作当前对象的对象
    arg1,arg2,……,argN;可选项,将被传递方法参数序列
  说明
    call方法可以用来代替另一个对象调用一个方法。call方法可将一个函数的对象上下文从初始的上下文改变为有thisObj指定的新对象。
  
  如果没有提供thisObj参数,那么Global对象被用作thisObj
  */
  /*
  apply方法:
  语法:apply(thisObj,[arg1,arg2,……,argN])
  定义:应用某一个对象的一个方法,用另一个对象替换当前对象
  */
  //区别:call和apply的区别在于call的第二个参数可以是任意类型,而apply的第二个参数必须是数组或者arguments
  //1.
  function add(a,b) {
    console.log(a+b);
  }
  function sub(a,b) {
    console.log(a-b);
  }
  add.call(sub,3,1);//用add来替换sub,add.call(sub,3,1)==add(3,1),结果是console.log(4);
  //2.
  function Animal(){
    this.name="Animal";
    this.showName=function(){
      alert(this.name);
    }
  }
  function Cat(){
    this.name="Cat";
  }
  var animal=new Animal();
  var cat=new Cat();
  animal.showName.call(cat);
  // 通过call或者apply方法,将原本属于Animal对象的showName()方法交给对象cat来使用。结果为alert("Cat");
  //3.
  function Animal(name){
    this.name=name;
    this.showName=function(){
    alert(this.name);
    }
  }
  function Cat(name){
    Animal.call(this,name);
  }
  var cat=new Cat("Black Cat");
  cat.showName();
  //Animal.call(this)的意思是使用Animal对象代替this对象,那么Cat中就有了Animal的所有方法和属性了,Cat对象就能直接调用Animal的方法和属性了。
  //4.
  function Class10(){
    this.showSub=function(a,b){
      alert(a-b);
    }
  }
  function Class11(){
    this.showAdd=function(a,b){
      alert(a+b);
    }
  }
  function Class2(){
    Class10.call(this);
    Class11.call(this);
  }
  //使用两个call就实现多继承了。
</script>

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Javascript 相关文章推荐
jQuery Clone Bug解决代码
Dec 22 Javascript
JS下载文件|无刷新下载文件示例代码
Apr 17 Javascript
js监听鼠标事件控制textarea输入字符串的个数
Sep 29 Javascript
基于jQuery实现的美观星级评论打分组件代码
Oct 30 Javascript
AngularJS基础 ng-keypress 指令简单示例
Aug 02 Javascript
jquery弹出框插件jquery.ui.dialog用法分析
Aug 20 Javascript
浅谈javascript中的 “ &amp;&amp; ” 和 “ || ”
Feb 02 Javascript
JavaScript中的一些隐式转换和总结(推荐)
Dec 22 Javascript
JS中验证整数和小数的正则表达式
Oct 08 Javascript
在微信小程序中使用图表的方法示例
Apr 25 Javascript
JavaScript 斐波那契数列 倒序输出 输出100以内的质数代码实例
Sep 11 Javascript
js实现前端界面导航栏下拉列表
Aug 27 Javascript
js中怎么判断两个字符串相等的实例
Jan 17 #Javascript
js中null与空字符串&quot;&quot;的区别讲解
Jan 17 #Javascript
vue中$nextTick的用法讲解
Jan 17 #Javascript
vue项目打包之后背景样式丢失的解决方案
Jan 17 #Javascript
js中Array对象的常用遍历方法详解
Jan 17 #Javascript
vuex如何重置所有state(可定制)
Jan 17 #Javascript
node app 打包工具pkg的具体使用
Jan 17 #Javascript
You might like
如何做到多笔资料的同步
2006/10/09 PHP
php中使用array_filter()函数过滤空数组的实现代码
2014/08/19 PHP
php+mysqli事务控制实现银行转账实例
2015/01/29 PHP
php 7新特性之类型申明详解
2017/06/06 PHP
thinkPHP5.0框架事务处理操作简单示例
2018/09/07 PHP
原生PHP实现导出csv格式Excel文件的方法示例【附源码下载】
2019/03/07 PHP
js select常用操作控制代码
2010/03/16 Javascript
JS子父窗口互相操作取值赋值的方法介绍
2013/05/11 Javascript
如何使用Javascript获取距今n天前的日期
2013/07/08 Javascript
使用js判断控件是否获得焦点
2014/01/03 Javascript
单击某一段文字改写文本颜色
2014/06/06 Javascript
AngularJS实现表单验证
2015/01/28 Javascript
文字垂直滚动之javascript代码
2015/07/29 Javascript
13个PHP函数超实用
2015/10/21 Javascript
Bootstrap每天必学之附加导航(Affix)插件
2016/04/25 Javascript
Ubuntu 16.04 64位中搭建Node.js开发环境教程
2016/10/19 Javascript
javascript中call,apply,bind函数用法示例
2016/12/19 Javascript
jQuery向webApi提交post json数据
2017/01/16 Javascript
详解webpack分离css单独打包
2017/06/21 Javascript
解决Vue中mounted钩子函数获取节点高度出错问题
2018/05/18 Javascript
vue使用jsonp抓取qq音乐数据的方法
2018/06/21 Javascript
jQuery模拟12306城市选择框功能简单实现方法示例
2018/08/13 jQuery
使用xampp将angular项目运行在web服务器的教程
2019/09/16 Javascript
layui实现二维码弹窗、并下载到本地的方法
2019/09/25 Javascript
JavaScript实现放大镜效果代码示例
2020/04/29 Javascript
javascript canvas实现简易时钟例子
2020/09/05 Javascript
[02:23]DOTA2英雄基础教程 幻影长矛手
2013/12/09 DOTA
使用Python中的cookielib模拟登录网站
2015/04/09 Python
新手如何快速入门Python(菜鸟必看篇)
2017/06/10 Python
python使用for循环计算0-100的整数的和方法
2019/02/01 Python
在Python中字典按值排序的实现方法
2020/11/12 Python
书香家庭事迹材料
2014/05/09 职场文书
跳蚤市场口号
2014/06/13 职场文书
2014县委书记党的群众路线教育实践活动对照检查材料思想汇报
2014/09/22 职场文书
矛盾论读书笔记
2015/06/29 职场文书
MySQL 表空间碎片的概念及相关问题解决
2021/05/07 MySQL