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

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

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

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

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

call有两个妙用：

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

区别：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>

总结

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

赞 (0)

相关推荐

  • 浅谈JavaScript中的apply/call/bind和this的使用

    fun.apply(context,[argsArray]) 立即调用fun,同时将fun函数原来的this指向传入的新context对象,实现同一个方法在不同对象上重复使用. context:传入的对象,替代fun函数原来的this: argsArray:一个数组或者类数组对象,其中的数组参数会被展开作为单独的实参传给 fun 函数,需要注意参数的顺序. fun.call(context,[arg1],[arg2],[-]) 同apply,只是参数列表不同,call的参数需要分开一个一个传入.

  • js中apply()和call()的区别与用法实例分析

    js中apply()和call()的区别与用法实例分析

    本文实例讲述了js中apply()和call()的区别与用法.分享给大家供大家参考,具体如下: 每个函数都包括两个非继承而来的方法:apply()和call().两者用途都是在特定的作用域中调用函数,等于重新设置了函数体内this对象的值. 两者区别仅在于接收参数方式不同,apply()第一个参数是调用apply的函数运行的作用域,的第二个参数可以是Array的实例(数组),也可以是arguments对象,call()第一个参数是this的值没有变化,而其余参数都直接传递给函数(也就是逐个列举出

  • 详解JavaScript函数callee、call、apply的区别

    详解JavaScript函数callee、call、apply的区别

    arguments.callee 关于callee的解释:callee 是 arguments 对象的一个属性.可以用于引用该函数的函数体内当前正在执行的函数.这在函数的名称是未知时很有用,例如在没有名称的函数表达式 (也称为"匿名函数")内. 递归调用实现一个阶乘函数: function sum(num){ if(num <= 1){ return 1; }else{ console.log(num, arguments.callee(num-1)); return num *

  • 详解JS中的this、apply、call、bind(经典面试题)

    这又是一个面试经典问题~/(ㄒoㄒ)/~~也是 ES5中众多坑中的一个,在 ES6 中可能会极大避免 this 产生的错误,但是为了一些老代码的维护,最好还是了解一下 this 的指向和 call.apply.bind 三者的区别. this 的指向 在 ES5 中,其实 this 的指向,始终坚持一个原理:this 永远指向最后调用它的那个对象,来,跟着我朗读三遍:this 永远指向最后调用它的那个对象,this 永远指向最后调用它的那个对象,this 永远指向最后调用它的那个对象.记住这句话

  • Javascript中call，apply，bind方法的详解与总结

    以下内容会分为如下小节: 1.call/apply/bind方法的来源 2.Function.prototype.call() 3.Function.prototype.apply() 3.1:找出数组中的最大数 3.2:将数组的空元素变为undefined 3.3:转换类似数组的对象 4.Function.prototype.bind() 5.绑定回调函数的对象 6.call,apply,bind方法的联系和区别 1.call/apply/bind方法的来源 首先,在使用call,apply,

  • javascript中call()、apply()的区别

    call().apply()的区别: 相同点: 1.call()和apply()都可以用来间接调用函数,都可以显式调用所需的this.即,任何函数可以作为任何对象的方法来调用. 2.两个方法都可以指定调用实参. 区别: call()和apply()的基本区别:在于将参数传递给函数. call():使用其自有的实参列表作为函数的参数: apply():要求以数组的形式传入参数. function track(o,m){ var original =o[m]; o[m] =function( ){

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

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

    1. 每个函数都包含两个非继承而来的方法:call()方法和apply()方法.(天生的) 2. 相同点:这两个方法的作用是一样的. 都是在特定的作用域中调用函数,等于设置函数体内this对象的值,以扩充函数赖以运行的作用域. 一般来说,this总是指向调用某个方法的对象,但是使用call()和apply()方法时,就会改变this的指向. call有两个妙用: 1: 继承. 2: 修改函数运行时的this指针. 区别:call和apply的区别在于call的第二个参数可以是任意类型,而appl

  • JS中call()和apply()的功能及用法实例分析

    本文实例讲述了JS中call()和apply()的功能及用法.分享给大家供大家参考,具体如下: 1.call()和apply()的作用 首先引出问题:用call()和apply()的目的是什么? 来看个例子,在javascript OOP中,我们经常会这样定义: function cat(){ } cat.prototype={ food:"fish", say: function(){ alert("I love "+this.food); } } var bla

  • JS中call和apply函数用法实例分析

    本文实例讲述了JS中call和apply函数用法.分享给大家供大家参考,具体如下: call 函数 语法 obj.call(thisObj,arg[,arg2[,arg3[,...agr]]]); 简介 thisObj继承obj的属性和方法(obj原型链上的属性和方法不能被继承),后面的参数会当成obj的参数安装顺序传递进去. 示例 function animal(type,nickname){ this.type = type; this.nickname = nickname; this.s

  • Vue.js点击切换按钮改变内容的实例讲解

    代码实例: 代码描述:点击切换按钮,来改变显示的内容,切换不同的单位.flag相当于一个开关,控制开关的改变,来切换不同的单位.同样适用于其他的切换内容实例,也可设置按钮点击显示隐藏等. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>vue点击切换改变内容</title> <script src="https://cdn.bo

  • js中call与apply的用法小结

    js中call与apply的用法小结

    前天去面试,有个gg问了一些js知识,其中有一道call与apply用法的题目,尽管在365天前用过call方法,但当时还是没能答上来,今天深入总结一下 call和apply,它们的作用都是将函数绑定到另外一个对象上去运行 两者的格式和参数定义: call( thisArg [,arg1,arg2,- ] );       // 参数列表,arg1,arg2,...apply(thisArg [,argArray] );                 // 参数数组,argArray 上面两个

  • 详解js中call与apply关键字的作用

    javascript call与apply关键字的作用 apply接受两个参数.第一个参数指定函数体内this对象的指向,第二个参数为一个带下标的集合. call则是apply的语法糖,如果参数数量固定,则可以不用带下标的集合传第二个参数. var func = function(a,b,c) { alert(a + b + c); } func.apply(null,[1,2,3]);//弹出6 func.call(null,1,2,3);//弹出6 当apply与call传入的第一个参数为n

  • vue.js中ref和$refs的使用及示例讲解

    vue.js中ref和$refs的使用及示例讲解

    关于ref和$refs的用法及讲解,vue.js中文社区( https://cn.vuejs.org/v2/api/#ref )是这么讲解的: ref 被用来给元素或子组件注册引用信息,引用信息将会注册在父组件的 $refs 对象上. 如果在普通的 DOM 元素上使用,引用指向的就是 DOM 元素:如果用在子组件上,引用就指向组件: vue.js中文社区文档上的说明已经就比较通俗易懂了,其实我们可以这么理解,ref和$refs其实就是用来获取/操作DOM元素的:类似于jquey中的$(".xxx

  • js中继承的几种用法总结(apply,call,prototype)

    一,js中对象继承 js中有三种继承方式 1.js原型(prototype)实现继承 复制代码 代码如下: <SPAN style="BACKGROUND-COLOR: #ffffff"><SPAN style="FONT-SIZE: 18px"><html>  <body>  <script type="text/javascript">      function Person(na

  • js中的深浅拷贝问题简析

    前言 在开发过程中,偶尔会遇到这种场景,拿到一个数据后,你打算对它进行处理,但是你又希望拷贝一份副本出来,方便数据对比和以后恢复数据. 那么这就涉及到了 JS 中对数据的深浅拷贝问题,所谓深浅拷贝,浅拷贝的意思就是,你只是复制了对象数据的引用,并没有把内存里的值另外复制一份,那么深拷贝就是把值完整地复制一份新的值. 下面这篇文章就对js中的深浅拷贝进行了深入的讲解,下面话不多说了,来一起看看详细的介绍吧 问题描述: 因为在JavaScript中对象在赋值中存储的是对象的地址(指针),所以会造成对

  • JS中改变this指向的方法(call和apply、bind)

    this是javascript的一个关键字,随着函数使用场合不同,this的值会发生变化.但是总有一个原则,那就是this指的是调用函数的那个对象. this一般指向的是当前被调用者,但也可以通过其它方式来改变它的指向,下面将介绍三种方式: 1.call用作继承时: function Parent(age){ this.name=['mike','jack','smith']; this.age=age; } function Child(age){ Parent.call(this,age);

随机推荐