call的用法及底層實現

阿新 • • 發佈：2019-01-15

最近也是看了很多方面的知識，前端後端都有，有的現在看起來並不是很理解，才發現有些基礎的東西其實是非常重要的，對於我們編寫高質量的程式碼，以及能夠及時找出程式碼中的bug尤為重要，博主也是看到了一個關於call方法的視訊，裡面講解的也是非常不錯，也因此深入瞭解了一下，今天和大家分享一下call方法的實現，也是對自己所學的一次鞏固。

相信大家也是能夠了解call及apply的用法了，這裡就是簡單提及一下，最重要的作用其實就是改變this的指向，兩者之間的區別也就是傳參列表不同，call的引數是單獨的一個一個傳，而apply是傳進去一個數組，但是其實解析的時候，也是會將陣列的元素抽出來一個一個解析，要注意的是，即使apply只有一個引數，也需要加上[]，表示陣列形式的引數。上面的說法可能有些難以理解，至少當初對於博主來說，一直沒有能理解，後來還是看到了一個博文，覺得上面的解釋非常有意思：即我有一個吃的方法，加入某人也想要我的吃的方法，但是他自己沒有，那麼他怎麼辦才能獲得吃的方法呢，很簡答，就是利用call方法。

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<script>
		var person = {
			name: 'qiugu',
			eat: function(){
				console.log('i am eating');
			}
		}

		var personAnother = {
			name: 'gailun',
			drink: function(){
				console.log('i am drinking');
			}
		}

		var result = person.eat.call(personAnother);    //i am eating

	</script>
</body>
</html>

最後輸出的結果就是吃的方法，更通俗的來說，就是有了call方法以後，等於自己擁有了別人的能力，這樣一說是不是更能理解了呢。

當然今天主要是來實現一下call方法的，當然其實apply也是一樣的原理，這裡就是以call方法為例，有興趣的同學可以試試apply的實現，瞭解底層的實現方法，才能更好的去運用起來，下面則是實現的過程

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<script>
		Function.prototype.myCall = function(context){
			context = context || window;   
			context.fn = this;    //context指的就是傳進去的引數，這裡其實就是指的就是呼叫的物件，即another
			var args = [],result;    //this指的是上下文的環境，這裡就是指的eat的方法，即在another物件上建立了eat的方法
			for(let i = 1;i < arguments.length;i++){
				args.push(arguments[i]);
			}
			result = context.fn(...args);
			delete context.fn;
			return result;
		}

		var person = {
			name: 'qiugu',
			eat: function(){
				console.log('eating!');
			}
		}

		var another = {
			name: 'yasuo',
			drink: function(){
				console.log('drinking!');
			}
		}

		person.eat.myCall(another);//eating!
	</script>
</body>
</html>

這個其實就是在Function的原型上面寫了一個方法，實際過程就是在指向的物件上面建立了一個同樣的方法，然後再將這個方法刪掉，之所以有context = context || window這樣的寫法，其實就是一個防止報錯的寫法，如果輸入的context為空的話，就用window這個全域性變數來指代context，當然最後輸出的結果也就是undefined了，不過卻不會報錯，這種寫法也是給了博主這樣的菜鳥一個很大的榜樣，寫程式碼就是要這樣，考慮周全，要想好思路，確定好以後再去寫，任何值如果不注意的話，後續產生bug，找都很難找出來。希望菜鳥程式設計師們後期寫程式碼也是要以此為榜樣，養成一個良好的習慣比什麼都重要。

call的用法及底層實現

call的用法及底層實現

Redis五種資料型別及底層實現

STL中map、set的資料結構及底層實現

迭代器Iterator操作及底層實現

vue三要素及底層實現機制

linux--fork()函式詳解及底層實現機制

深入理解HashMap及底層實現

Java併發核心基礎——執行緒池使用及底層實現機制詳解

inet_pton函式和inet_ntop函式的用法及簡單實現

HashMap和HashSet原理及底層實現

kill及kill -9的用法及如何實現程序的優雅退出

javascript call用法及好處

Spring原始碼分析之IOC的三種常見用法及原始碼實現（二）

STL及一些容器底層實現機制

memcpy，memmove，memset函數福彩3D平臺搭建用法及實現

atoi函式的用法及用C語言實現ato

HashMap原始碼實現原理及底層結構

HashMap的實現原理及底層結構

ArrayList工作原理及底層原始碼實現

redis del與unlink命令用法及實現

call的用法及底層實現

相關推薦