Day_20.this、call和apply

this

call

apply

this

和其他语言不同,JavaScript的this总是指向一个对象,而具体指向哪个对象是在运行时基于函数的执行环境动态绑定的,而非函数被声明时的环境。

this的指向

除去不常用的with和eval,this的指向大致可分为以下四种:

  • 作为对象的方法调用
  • 作为普通函数调用
  • 构造器调用
  • Function.prototype.call或Function.prototype.apply调用

作为对象的方法调用

当函数作为对象的方法被调用时,this指向该对象。

var obj={
  a:1,
  getA:function(){
    alert(this===obj);//true
    alert(this.a);//1
  }
};

obj.getA();

作为普通函数调用

当函数不作为对象的属性被调用时,也就是普通函数方式,此时this总是指向全局对象。在浏览器中,这个全局对象是window。

window.name=‘globalName‘;

var getName1=function(){
    return this.name;
};

var myObject={
    name:‘sven‘,
    getName:function(){
        return this.name;
    }
};

var getName=myObject.getName;

alert(getName1());//globalName
alert(getName());//globalName

构造器调用

当用new运算符调用函数时,该函数总会返回一个对象,通常情况下,构造器里的this就指向返回的这个对象。

var MyClass=function(){
    this.name=‘sven‘;
};

var obj=new MyClass();
alert(obj.name);//sven

但是如果构造器显式地返回了一个object类型的对象,那么此次运算结果最终会返回这个对象,而不是我们之前期待的this:

var MyClass=function(){
    this.name=‘sven‘;
    return{
        name:‘anne‘;
    }
};

var obj=new MyClass();
alert(obj.name);//anne

如果构造器不显式地返回任何数据,或者是返回一个非对象类型的数据,就不会造成上述问题:

var MyClass=function(){
    this.name=‘sven‘;
    return ‘anne‘;
};

var obj=new MyClass();
alert(obj.name);//sven

call和apply调用

call和apply可以动态的地改变传入函数的this:

var obj1={
    name:‘sven‘,
    getName:function(){
        return this.name;
    }
};

var obj2={
    name:‘anne‘
};

console.log(obj1.getName());
console.log(obj1.getName.call(obj2));

call和apply

call和apply作用一模一样,区别在于传入参数的形式不同。apply接受两个参数,第一个参数指定了函数体内this对象的指向,第二个参数第二个参数为一个带下标的集合,这个集合可以为数组,也可以为类数组。

JavaScript的参数在内部就是用一个数组来表示的,从这个意义上来说,apply比call的使用率更高。call是包装在apply上的一颗语法糖,如果我们明确知道函数接受多少个参数,而且想一目了然地表达形参和实参的对应关系,那么也可以用call来传送参数。

当使用call或者apply时,如果我们传入的第一个参数是null,函数体内的this会指向默认的宿主对象,在浏览器中就是window,但如果是在严格模式下,函数体内的this还是为null。

有时候我们使用call或者apply的目的并不在于指定this的指向,二十另有用途,比如借用其他对象的方法,那么我们就可以传入null来代替某个具体的对象。

call和apply的用途

改变this的指向

Function.prototype.bind

        Function.prototype.bind=function() {
        var self=this,
            context=[].shift.call(arguments),//需要绑定的this上下文
            args=[].slice.call(arguments);//剩余的参数转成数组
        return function(){
            return self.apply(context,[].concat.call(args,[].slice.call(arguments)));//执行新的函数体的时候,会把之前传入的context当作新函数体内的this,并且组合两次分别传入的参数,作为新函数的参数
        }
    };

    var obj={
        name:‘sven‘
    };

    var func=function(a,b,c,d){
        alert(this.name);
        alert([a,b,c,d]);
    }.bind(obj,1,2);

    func(3,4);

使用其他对象的方法

第一种场景是借用构造函数,可以实现一些类似继承的效果:

var A=function(name){
    this.name=name;
};

var B=function(){
    A.apply(this,arguments);
};

B.prototype.getName=function(){
    return this.name;
};

var b=new B(‘sven‘);
console.log(b.getName());

第二种场景:函数的参数列表arguments是一个类数组对象,虽然它也有下标,但她并非真正的数组,所以不能进行排序操作或者往集合里添加一个新的元素。这种情况下我们常常会借用Array.prototype对象上的方法。比如想往arguments里插入一个元素,通常会借用Array.prototype.push:

(function(){Array.prototype.push.call(arguments,3)})(1,2);

在操作arguments时,我们经常非常频繁地找Array.prototype借用方法。

  • 转化为数组:Array.prototype.slice
  • 截去头元素:Array.prototype.shift
时间: 2025-01-04 13:10:13

Day_20.this、call和apply的相关文章

call和apply和bind的区别

在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向. JavaScript 的一大特点是,函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」. apply(): 将函数作为指定对象的方法来调用,传递给它的是指定的参数数组function.apply(thisobj, args) 或者 function.apply(thisobj, args) 1.thisobj

Scala 中apply方法的用法

Scala 是构建在 JVM 上的静态类型的脚本语言,而脚本语言总是会有些约定来增强灵活性.关于协议在Python中是挺多的,看看Python的对象协议,有很多很多,如果对Python的对象协议了解(不了解的可以点击此处)的比较深刻的话,其实scala的apply方法也是很好理解的,比如说 Scala 为配合 DSL 在方法调用时有这么一条约定: 在明确了方法调用的接收者的情况下,若方法只有一个参数时,调用的时候就可以省略点及括号.如 "0 to 2",实际完整调用是 "0.

关于call 和 apply

权威指南上的说法是:可以将call 和apply看做是某个对象的方法,通过调用方法的形式 间接调用函数:需要重点说明是 :通过call和apply 调用的 函数:具体用法--->如下: 1.先说call的用法,call可以接收两个参数,也可能不是两个:第一个参数是要调用函数的 母对象,在函数体内通过this来获得对它的引用: function a(){ console.log(this); // 输出函数a中的this对象 } function b(){} // 定义函数b var obj =

How to Create an OCM Response file to Apply a Patch (文档 ID 966023.1)

How to Create an OCM Response file to Apply a Patch in Silent Mode - opatch silent (文档 ID 966023.1) APPLIES TO: Oracle Universal Installer - Version 10.2.0.1 to 11.2.0.4 [Release 10.2 to 11.2]Oracle Database - Enterprise Edition - Version 10.2.0.1 to

javascript继承机制 & call apply使用说明

一.继承机制 1.对象冒充:构造函数使用 this 关键字给所有属性和方法赋值,可使 ClassA 构造函数成为 ClassB 的方法,然后调用它. function ClassZ() { this.newMethod = ClassX; this.newMethod(); delete this.newMethod; this.newMethod = ClassY; this.newMethod(); delete this.newMethod; } 这里存在一个弊端,如果存在两个类 Clas

call和apply

在ECMAScript v3中,给Function原型定义了这两个方法,这两个方法的作用都是一样的:使用这两个方法可以像调用其他对象方法一样调用函数,这句话是从书上抄的,至少我是没读明白这是什么意思. 下面说简单易懂的,先看段代码: function Introduce(name,age) { document.write("My name is "+name+".I am "+age); } var p=new People(); Introduce.call(p

JS中的call、apply、bind方法

JS中的call.apply.bind方法 一.call()和apply()方法 1.方法定义call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call 方法可以用来代替另一个对象调用一个方法.call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象. 如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj.

javascript技术难点(三)之this、new、apply和call详解

4)    this.new.call和apply的相关问题 讲解this指针的原理是个很复杂的问题,如果我们从javascript里this的实现机制来说明this,很多朋友可能会越来越糊涂,因此本篇打算换一个思路从应用的角度来讲解this指针,从这个角度理解this指针更加有现实意义. 下面我们看看在java语言里是如何使用this指针的,代码如下: public class Person { private String name; private String sex; private

call和apply的区别

call和apply的区别: 它们各自的定义:   apply:应用某一对象的一个方法,用另一个对象替换当前对象.例如:B.apply(A, arguments);即A对象应用B对象的方法. call:调用一个对象的一个方法,以另一个对象替换当前对象.例如:B.call(A, args1,args2);即A对象调用B对象的方法. 它们的共同之处: 都"可以用来代替另一个对象调用一个方法,将一个函数的对象上下文从初始的上下文改变为由thisObj指定的新对象". 它们的不同之处: app