call()方法和他的兄弟们

203 阅读3分钟

1、call方法有话说

大家可能都在不同的场合或多或少的见过我,第一次看,可能大家都很疑惑,感觉这个call是谁啊,它在JS王国里能干啥啊?是专门提供给variable打电话摇人的方法,咦...这个时候可能还会有人疑问,电话摇人有啥用呵?还会增加处理逻辑的混乱,让本就是关系错综的程序世界增加太多的变数,好似让读码者,多饮了二斤酒,昏昏的好似梦中!

2、call的身世谜团

call原来就是和大家所想的有所相近,他的职责其实就是负责摇人,是呼唤其他的对象来使用其本身说没有的方法。说到底,被呼叫的对象就挺惨,他自己没有想使用的这个方法,那咋办呢,?不可能再去创造一个新的,不显示,而且也违背了神之面向对象的精神---多态,那只好去借用被人家的了(改变this的指向),既环保,又方便,增加的是计算机对逻辑的处理,人类只要明白了这个方法,就不会觉得逻辑混乱啦!

//下面就来讲解一下这个call吧
var stu = 'hunhunzhang',height = 171;
var object = {
  stu: 'zhangkh',
  objhei: this.height,
  fun: function(){
    console.log(this.stu + "身高" + this.height);
  }
}

调用

console.log(object.objhei);  //171
object.fun() //zhangkh身高undefined

var name = "hhz";
function view(){
  console.log(this.name)
}

view()//hhz

从上面的代码中,你就可以察觉到这两次的this指向是不同的,第一个this指向的是调用者,也就是那个对象object(不是你的,更不可能是我的),第二个this指向的是全局对象window

原来啊,call()方法就是要改变上面那种尴尬的局面,调整下this的指向,让我们的this更加的灵活,让我们使用起自己的没有的function,也变得不再难的痛哭。

3、call和他的兄弟们

先看一下这个有意思的代码片段吧。

let name = 'hunhunzhang',age = 26;
let obj = {
  name: 'hunhun',
  age: this.age,
  fun: function(form,t){
    console.log(this.name + "年龄" + this.age,"来自" + from + "去往" + t);
  }
}
let hhz = { 
  name: "hunhunzhang",
  age: 99

调用下你就看到的化学反应啊!

obj.fun.call(db,"安徽","南京");
obj.fun.apply(db,["安徽","南京"]);
obj.fun.bind(db,"安徽","南京")();

4、三兄弟化学反应后的差别

哇,化学反应这么明了啊,bind 返回的是一个新的函数,你必须调用它才会被执行。由此得出结论,bind 返回的是一个新的函数,你必须调用它才会被执行。call的另外两个兄弟bindapply 第一个参数都是 this 的指向对象,后面的参数就有所不同啦。call 的参数是直接放进去的,第二第三第 n 个参数全都用逗号分隔,apply的所有参数都必须放在一个数组里面传进去,bind除了返回一个函数外,其他的和call是差不多的。果然是三兄弟啊,作用相同,用法也是如此的相近。