原生js的call,apply方法

面试的时候被问到这个问题了,答得很模糊,就自己补充了下

二者不同

传参不同,
call(this,参数1,参数2,参数3,…)
apply(this,[参数1,参数2, 参数3,参数4,…])

二者作用

用来改变指针指向(this)

例子

首先定义一个对象字面量:obj ,拥有一个属性name和一个方法getAge
var obj = {
	name: 'xiaoming',
	getAge: function() {
		console.log(this.age)
	}
}

直接调用obj.getAge()   // 输出则是undefined
使用call或者apply
再次定义一个对象字面量: ager
var ager = {
	age: '10',
	height: '170'
}

如果想通过obj 来访问到ager的属性,则可以用call/apply
obj.getAge.call(ager)   [第一个参数就是定义this的指向到哪里,后面的参数则是传的所有实参] // 10
obj.getAge.apply(ager)  // 10
如何传参
改造下obj
var obj = {
	name: 'xiaoming',
	getA: function(age,height) {
		console.log(this.name + '的年龄是 ' + age,  this.name + '的身高是 ' + height);
	}
}

var d = {
	name: 'xioazhang'
}

obj.getA.call(d, '10', '170') // 参数由自己定义

如果是多个参数呢
继续改造obj
var obj = {
	name: 'xiaoming',
	getA: function(...b) {
		console.log(arguments)  // Arguments(2) ["10", "170", callee: (...), Symbol(Symbol.iterator): ƒ]
		// console.log(this.name + '的年龄是 ' + age,  this.name + '的身高是 ' + height);
	}
}

arguments的长度即是传了多少个参数,参数由自己定义是什么类型[string,number,内置对象都可],进而输出自己所想要的值


如果是传的this
var obj = {
    name: 'xiaoming',
    getA: function (...b) {
        console.log(this.name) // xiaoming
        // console.log(this.name + '的年龄是 ' + age,  this.name + '的身高是 ' + height);
    }
}

var d = {
    name: 'xioazhang'
}

obj.getA.call(this, '10', '170') // 参数由自己定义  才能访问到自身的this
obj.getA.apply(this, ['10', '170']) 

注意: 二者仅仅是传参不同,但是在函数中获取参数时,都是一样的。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值