call(thisObj,param1,param2....)方法:调用一个对象的方法,用另外的对象去替换当前对象。

下面给出一个例子:

function add(a,b){

    return a+b;

}

function sub(a,b){

    return a-b;

}

add.call(sub,3,2)

当执行以上代码时,输出的结果为5。执行add.call(sub,3,2)==add(3,2);相当于用add来替换sub;其实每一个函数也是一个对象,它是Function的实例对象。

再写一个改变函数执行上下文的例子:

function Animal(){

   this.name='Animal';

   this.sayName=function(){

    console.log(this.name);

}

}

function dog(){

    this.name='dog';

}

var animal=new Animal();

var dog=new Dog();

animal.sayName.call(dog);}

以上代码相当于把animal对象里的sayName方法放到了dog对象上执行,其执行环境改为dog,故sayName方法里的this指向当前的dog对象,所以this.name为dog.

改变当前this的指向,this指向当前的thisObj对象。

b\ 实现继承

实例: function Animal(name){

    this.name=name;

    this.sayWord=function(){

      console.log(this.name);

}}

function Dog(name){

    Animal.call(this,name)

}

var dog=new Dog('i am a big dog');

dog.sayName();

输出结果为 i am a big dog;可是Dog构造函数里并没有sayName方法,这里为什么可以调用呢,其实呢Animal.call(this,name)相当于用Animal对象来替换this对象,那么构造函数里就有Animal对象的属性和方法了。故其生成的实例对象dog可以使用这些属性和方法,但是有一点要注意的是当前的this是指向调用该方法的dog对象。

c\实现多重继承

function Animal(name){

    this.name=name;

    this.sayWord=function(){

      console.log(this.name);

}}

function Human(){

    this.sayName=function(){

      console.log('hello human')

}

}

function Dog(name){

    Animal.call(this,name)

    Human.call(this)

}

var dog=new Dog('i am a big dog');

dog.sayName();

dog.sayWord();

通过使用多次的call()可以实现多重继承,继承相关的属性和方法。

以上呢是关于call()方法的一些应用,而apply()方法呢与call()类似,只是apply()方法接受的第二个参数是数组,而call是参数列表形式。其他的没有什么区别。用法与call()方法类似。

下面重点说一下bind()方法,这是js新增的一个方法,其作用与call和apply方法一样,传递参数与call方法一样,唯一的不同的是使用call()和apply()方法是直接调用并返回结果,而bind()方法返回的是一个函数;需进一步调用。例子如下:

var obj1={

    name:'chen',

    age:18,

    say:function(name,age){

      console.log(this.name+" "+this.age)

}

}

var obj2={

    name:'ze',

    age:12

}

obj1.say.call(obj2);

obj1.say.apply(obj2);

obj1.say.bind(obj2);

上面执行结果为

ze 12
ze 12
function (name,age){

      console.log(this.name+" "+this.age)
}

可以看出bind()方法返回的是一个函数,需进一步调用才能返回相应的结果。

js中的call()、apply()和bind()方法的区别的更多相关文章

  1. js中call,apply,bind方法的用法

    call .apply.和bind 以上这三个方法都是js function函数当中自带的方法,用来改变当前函数this的指向. call()方法 语法格式: fun.call(thisArg[,ar ...

  2. Javascript中call,apply,bind方法的详解与总结

    在 javascript之 this 关键字详解 文章中,谈及了如下内容,做一个简单的回顾: 1.this对象的涵义就是指向当前对象中的属性和方法. 2.this指向的可变性.当在全局作用域时,thi ...

  3. js中call、apply、bind的用法

    原文链接:http://www.cnblogs.com/xljzlw/p/3775162.html var zlw = { name: "zlw", sayHello: funct ...

  4. js中 call() ,apply(),bing()方法三者的用法和区别

    面试中经常会被问到的,或者做笔试题的时候也会有这样的问题,所以今天专门对这个问题做个总结: 先看个例子: var age = '19' var myObj = { name:'小赖', myAge:t ...

  5. js中call、apply、bind到底有什么区别?bind返回的方法还能修改this指向吗?

     壹 ❀ 引 同事最近在看angularjs源码,被源码中各种bind,apply弄的晕头转向:于是他问我,你知道apply,call与bind的区别吗?我说apply与call是函数应用,指定thi ...

  6. js中call、apply、bind那些事

    前言 回想起之前的一些面试,几乎每次都会问到一个js中关于call.apply.bind的问题,比如- 怎么利用call.apply来求一个数组中最大或者最小值 如何利用call.apply来做继承 ...

  7. js中call、apply和bind的区别

    在JS中,这三者都是用来改变函数的this对象的指向的,他们有什么样的区别呢.在说区别之前还是先总结一下三者的相似之处:1.都是用来改变函数的this对象的指向的.2.第一个参数都是this要指向的对 ...

  8. JavaScript中的call、apply、bind方法的区别

    在JavaScript 中,this的指向是动态变化的,很可能在写程序的过程中,无意中破坏掉this的指向,所以我们需要一种可以把this的含义固定的技术,于是就有了call,apply 和bind这 ...

  9. js中call、apply、bind那些事2

    前言 回想起之前的一些面试,几乎每次都会问到一个js中关于call.apply.bind的问题,比如… 怎么利用call.apply来求一个数组中最大或者最小值 如何利用call.apply来做继承 ...

随机推荐

  1. 蓝桥网试题 java 基础练习 杨辉三角形

    ----------------------------------------------------------- ---------------------------------------- ...

  2. python3 UnicodeEncodeError: 'gbk' codec can't encode character '\uff70' in position 75267: illegal multibyte sequence

    当你爬出想要的数据了,却发现中文是乱码的时候?请你计算下你内心的阴影面积 ! 菊个栗子: #!/usr/bin/env python3# -*- coding: utf-8 -*-import ioi ...

  3. iOS 设置#ffff 这种颜色

    UI给图的时候给的是#f2f2f2 让我设置.没有你要的rgb. 所以只能自行解决封装了代码 HexColors.h #import "TargetConditionals.h" ...

  4. CSS sliod属性

    CSS solid 属性 制作过网页的人都有为画线而烦恼的经历,先来认识一下“Border”(画边框),它是CSS的一个属性,用它可以给能确定范围的HTML标记(如TD.DIV等等)画边框,它可以定义 ...

  5. matlab 利用persistent关键字 存储持久变量

    数学知识:标准差体现随机变量取值与其期望值的偏差.标准差的值较大,则表明该随机变量的取值与其期望值的偏差较大反之,则表明此偏差较小.函数功能:函数必须能够接受一次输入值并记录对应的已输入数N.sum( ...

  6. websevice(Web服务)基础

    webservice简介: 1.WebService到底是什么? WebService是一种跨编程语言和跨操作系统平台的远程调用技术.所谓跨编程语言和跨操作平台,就是说服务端程序采用java编写,客户 ...

  7. IE浏览器和CSS盒模型

    网页设计中常听的属性名:内容(content).填充(padding).边框(border).边界(margin), CSS盒子模式都具备这些属性. 盒子模型是CSS中一个重要的概念,理解了盒子模型才 ...

  8. linux下apache 的安装

    1.进入work目录下:cd /usr/local/work(如没有则自己新建,命令:mkdir /usr/local/work) 2.在woke目录下从网站下载apache并解压:wget http ...

  9. C++指向常量的指针和常指针

    C++指向常量的指针和常指针 指向常量的指针 通常情况下,可以通过指针去修改指针指向的内容.但是在某些情况下,只希望通过指针去访问指针指向的内容,不想修改.比如只想通过树根结点的指针去遍历输出树中所有 ...

  10. video.js支持m3u8格式直播

    为什么要使用video.js? 1. PC端浏览器并不支持video直接播放m3u8格式的视频 2. 手机端各式各样的浏览器定制的video界面风格不统一,直接写原生的js控制视频兼容性较差 3. v ...