call apply 和 bind 的区别

2021-06-15  本文已影响0人  樱桃小白菜

call() 方法

基本用法

function add(a,b){
  return a+b;
}
function sub(c,d){
  return c-d;
}
function result(){
  this.addValue = null;
  this.subValue = null;
  this.showResult=function(){
    alert(this.addValue);
    alert(this.subValue);
  }
}   
function myCallTest(){  //此处this指向了add,如果不使用call则this指向window对象
  return add.call(this,7,2);
}
var r = new result();
console.log(myCallTest());//9
r.addValue = add.call(sub,4,2); //6,将add方法应用到sub上,即sub的指针指向add方法
r.subValue = sub.call(add,4,2); //2,用add对象替换sub对象,并调用sub对象的方法asqqqqqqqqqqqq
r.showResult(); //在js中函数也是一个Function对象,函数名即是对象引用

继承特性

function add(a,b){
  return a+b;
}
function sub(c,d){
  return c-d;
}
function result(){
  this.addValue = null;
  this.subValue = null;
  this.showResult=function(){
    alert(this.addValue);
    alert(this.subValue);
  }
}
var r = new result();
r.addValue = add.call(r,4,2);   //6,r继承add函数的所有特性
r.subValue = sub.call(r,4,2);   //2,r集成sub函数的所有特性
r.showResult();

apply() 方法

apply() 方法的作用

call() 方法与 apply() 方法的区别

call 方法是将参数使用逗号分隔
apply 方法是将参数写在数组里面

bind() 方法

bind() 方法的作用
var obj = {}
function fn(){
  console.log('是否调用',this)
}
var fnObj = fn.bind(obj)  //`不会执行
fnObj()  

call() 和 bind() 方法的区别

相同点:都是用来改变 this 的指向

不同点:call() 方法更改 this 的指向后,会再执行函数,bind() 方法更改 this 后,不会执行函数,会返回一个绑定新this的函数。

实际应用

利用 call() 方法来进行数据类型的判断

console.log(Object.prototype.toString.call("123"))            //  [Object String]
console.log(Object.prototype.toString.call(123))              //  [object Number]
console.log(Object.prototype.toString.call(true))           //  [object Boolean]
console.log(Object.prototype.toString.call(undefined))       //  [object Undefined]
console.log(Object.prototype.toString.call(null))            //  [object Null]
console.log(Object.prototype.toString.call(function(){}))    //  [object Function]
console.log(Object.prototype.toString.call([]))              //  object Array]
console.log(Object.prototype.toString.call({}))              //  [object Object]

利用 call() 方法翻转字符串

//思路:  借用数组中的reverse,将字符串翻转过来
 var str = "abc"
var arr = Array.prototype.reverse.call(str.split("")).join("");
console.log(arr)          //  cba
console.log(typeof arr)      //  string
//  当然也可以使用 Array.from 来将 字符串转化为数组
//  var arr =  Array.from(str)

利用 apply() 方法求最大值

var arr = [1,2,4,22,77,75,9]
var num  = Math.max.apply(arr,arr)
console.log(num)    //  77

参考

CSDN - js中的call()和apply()方法

上一篇下一篇

猜你喜欢

热点阅读