手写实现call(), apply()

最新推荐文章于 2024-03-31 15:50:35 发布

原创最新推荐文章于 2024-03-31 15:50:35 发布 · 182 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #面试

Javascript 同时被 2 个专栏收录

47 篇文章

订阅专栏

手写

8 篇文章

订阅专栏

本文详细介绍了如何在JavaScript中手动实现call()和apply()方法，分别从ES6之前和之后的角度进行了讲解，并提醒在ES6之前需要注意避免在对象中存在与方法名冲突的键名，以防数据丢失。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、call()

ES6之前

Function.prototype.myCall = function (_context){
	// _context空检测
	_context = _context? _context: window;
	// 获取函数参数
	let args = [];
	for(let i=1, len=arguments.length; i<len; i++){
		// 避开在eval时组装参数中字符串的麻烦
		args.push('arguments[' + i + ']');
	}
	// 将函数挂到_context上
	_context.__fn = this;
	// 执行函数
	let result = eval('_context.__fn(' + args + ')');
	// 删除_context内的新函数
	delete _context.__fn;
	return result;
}

ES6之后

Function.prototype.myCall = function (_context){
	// _context空检测
	_context = _context? _context: window;
	// 获取函数参数
	let args = [...arguments].slice(1);
	// 将函数挂到_context上
	let fnKey = Symbol();		// Symbol是唯一的
	_context[fnKey] = this;
	// 执行函数
	let result = _context[fnKey](...args);
	// 删除_context内的新函数
	delete _context[fnKey];
	return result;
}

二、apply()

ES6之前

Function.prototype.myApply = function(_context, _arr){
	// _context检测
	_context = _context? _context: window;
	// _arr检测
	let args = [];
	if(!_arr) args = null;
	else if(_arr instanceof Array === false) throw new Error('params must be array');
	else{
		for(let i=0, len=_arr.length; i<len; i++){
			// 避开在eval时组装参数中字符串的麻烦
			args.push('_arr[' + i + ']');
		}
	}
	// 函数挂到_context上
	_context.__fn = this;
	// 函数调用
	let result = eval('_context.__fn(' + (args? args: '') + ')');
	// 删除_context内的新函数
	delete _context.__fn;
	return result;
}

ES6之后

Function.prototype.myApply = function(_context, _arr){
	// _context检测
	_context = _context? _context: window;
	// 函数挂到_context上
	let fnKey = Symbol();	// Symbol是唯一的
	_context[fnKey] = this;
	// 函数调用
	let result;
	if(!_arr) result = _context[fnKey]();
	else if(_arr instanceof Array === false) throw new Error('params must be array');
	else result = _context[fnKey](..._arr);
	// 删除_context内的新函数
	delete _context[fnKey];
	return result;
}