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 相关文章推荐
可以将word转成html的js代码
Apr 11 Javascript
用jquery设置按钮的disabled属性的实现代码
Nov 28 Javascript
jquery自定义属性(类型/属性值)
May 21 Javascript
jquery给图片添加鼠标经过时的边框效果
Nov 12 Javascript
node.js中的buffer.write方法使用说明
Dec 10 Javascript
尝试动手制作javascript放大镜效果
Dec 25 Javascript
5个最顶级jQuery图表类库插件【jquery插件库】
May 05 Javascript
Ionic如何实现下拉刷新与上拉加载功能
Jun 03 Javascript
JavaScript面试题(指针、帽子和女朋友)
Nov 23 Javascript
基于pako.js实现gzip的压缩和解压功能示例
Jun 13 Javascript
vue基础之data存储数据及v-for循环用法示例
Mar 08 Javascript
使用JavaScript计算前一天和后一天的思路详解
Dec 20 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
使用URL传输SESSION信息
2015/07/14 PHP
Zend Framework实现Zend_View集成Smarty模板系统的方法
2016/03/05 PHP
php类自动装载、链式操作、魔术方法实现代码
2017/07/23 PHP
动态表格Table类的实现
2009/08/26 Javascript
IE6 弹出Iframe层中的文本框“经常”无法获得输入焦点
2009/12/27 Javascript
javascript对talbe进行动态添加、删除、验证实现代码
2012/03/29 Javascript
js通过地址栏给action传值(中文乱码全是问号)
2013/05/02 Javascript
json中换行符的处理方法示例介绍
2014/06/10 Javascript
用javascript将数据导入Excel示例代码
2014/09/10 Javascript
javascript获取flash版本号的方法
2014/11/20 Javascript
学习JavaScript设计模式(继承)
2015/11/26 Javascript
jQuery获得字体颜色16位码的方法
2016/02/20 Javascript
Web纯前端“旭日图”实现元素周期表
2017/03/10 Javascript
vue中将网页打印成pdf实例代码
2017/06/15 Javascript
关于Vue实现组件信息的缓存问题
2017/08/23 Javascript
微信小程序使用Socket的实例
2017/09/19 Javascript
vue+Element-ui实现分页效果实例代码详解
2018/12/10 Javascript
vux-scroller实现移动端上拉加载功能过程解析
2019/10/08 Javascript
稍微学一下Vue的数据响应式(Vue2及Vue3区别)
2019/11/21 Javascript
javascript实现扫雷简易版
2020/08/18 Javascript
原生js实现自定义难度的扫雷游戏
2021/01/22 Javascript
利用Python批量生成任意尺寸的图片
2016/08/29 Python
在win10和linux上分别安装Python虚拟环境的方法步骤
2019/05/09 Python
python getpass模块用法及实例详解
2019/10/07 Python
Python序列对象与String类型内置方法详解
2019/10/22 Python
详解Python IO编程
2020/07/24 Python
Python logging模块进行封装实现原理解析
2020/08/07 Python
使用sublime text3搭建Python编辑环境的实现
2021/01/12 Python
竞赛口号大全
2014/06/16 职场文书
家长学校培训材料
2014/08/20 职场文书
税务干部个人整改措施思想汇报
2014/10/10 职场文书
2014年纪检监察工作总结
2014/11/11 职场文书
公司聚餐通知
2015/04/22 职场文书
工作调动申请报告
2015/05/18 职场文书
Python利用机器学习算法实现垃圾邮件的识别
2021/06/28 Python
MySQL提升大量数据查询效率的优化神器
2022/07/07 MySQL