日韩黑丝制服一区视频播放|日韩欧美人妻丝袜视频在线观看|九九影院一级蜜桃|亚洲中文在线导航|青草草视频在线观看|婷婷五月色伊人网站|日本一区二区在线|国产AV一二三四区毛片|正在播放久草视频|亚洲色图精品一区

搜索
分享

探討instanceof實(shí)現(xiàn)原理，并用兩種方法模擬實(shí)現(xiàn) instanceof

 印度阿三17 2019-03-26

在開始之前先了解下js數(shù)據(jù)類型

js基本數(shù)據(jù)類型：

null undefined number boolean?string

js引用數(shù)據(jù)類型：

function object array

一說instanceof ?就想到typeof ，這里也介紹下typeof:

typeof是用來判斷數(shù)據(jù)類型的，就一個(gè)參數(shù) ,使用方式像這樣：?typeof ?num, ?就是判斷num是什么類型

typeof 一般只能返回如下幾個(gè)結(jié)果："number"、"string"、"boolean"、"object"、"function" 和 "undefined"； 除了"object" 其他都好說。

著重看這幾個(gè)：

typeof 不存在的變量 = “undefined”

typeof 對象 = “object”

typeof ?null = "object"?

typeof 數(shù)組 = “object”

typeod 方法的實(shí)例（比如 new Array()） =“object”

對象，數(shù)組 都是引用類型， 使用typeof 結(jié)果是 object類型，但是null 是基本數(shù)據(jù)類型，使用typeof結(jié)果也是 object，

可以這么理解：null 是?不指向任何對象?的?空指針， 因?yàn)樗侵赶驅(qū)ο蟮?，所以typeof 就是 object, 但是它又是空的，所以就屬于基本數(shù)據(jù)類型。

但是要想判斷一個(gè)變量是不是數(shù)組， 或者對象， 這時(shí)候就需要instanceof了（判斷是不是null，直接用 ?變量 === null 就行， null===null 結(jié)果是 true）

現(xiàn)在說instanceof, 要想從根本上了解 instanceof 的奧秘，需要從兩個(gè)方面著手：

1 語言規(guī)范中是如何定義這個(gè)運(yùn)算符的。

2 JavaScript 原型繼承機(jī)制。

一 JavaScript instanceof?語言規(guī)范 (簡化版) 的運(yùn)算代碼如下:

function instance_of(L, R) {//L 表示左表達(dá)式，R 表示右表達(dá)式
 var O = R.prototype;
 L = L.__proto__;
 while (true) { 
   if (L === null) 
     return false; 
   if (O === L)  // 這里重點(diǎn)：當(dāng) O 嚴(yán)格等于 L 時(shí)，返回 true 
     return true; 
   L = L.__proto__; 
 } 
}

規(guī)則簡單來說就是 L的 ?__proto__ ?是不是強(qiáng)等于 R.prototype，不等于再找 ?L.__proto__ .__proto__ ?直到?__proto__ 為 null ?

?

二 ?JavaScript 原型鏈,看下圖：

?對上圖的說明：

　　1.function Foo 就是一個(gè)方法，比如內(nèi)置的 Array ，String ，或者自定義的方法；

　　2.function Object 就是Object

　　3.function Function 就是Function

? ? ? ?4.以上三個(gè)其實(shí)都是function 所以他們的_proto_ 都是Function.prototype

　　5.記住 String, Array, Number, Object, Function這些其實(shí)都是 function

結(jié)合語言規(guī)范跟js的原型鏈，接下來我們看實(shí)際例子

常規(guī)的用法：

function F(){}
var a = new F()
console.log(a instanceof F) // 輸出 true

? function child(){}
? function father(){}
? child.prototype = new father()?
　 var a = new child()
? console.log(a instanceof father) // 輸出true

?更高級點(diǎn)的用法：

console.log(Object instanceof Object);//true
console.log(Function instanceof Function);//true
console.log(Number instanceof Number);//false
console.log(String instanceof String);//false
console.log(Function instanceof Object);//true
console.log(Foo instanceof Function);//true
console.log(Foo instanceof Foo);//false

大家可以在控制臺(tái)輸出，可以直觀的看到每個(gè)步驟的輸出，結(jié)合instanceof 的規(guī)范跟js原型鏈 加深理解。

模擬實(shí)現(xiàn)instanceof

對于用 typeof 就可以判斷出來數(shù)據(jù)類型的這里就不處理，只處理 typeof 結(jié)果為 object ，并且不是 null 的。

方法一： 直接使用instanceof的規(guī)則



<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
<script type="text/javascript">
	function instance_of(L, R) {//L 表示左表達(dá)式，R 表示右表達(dá)式
		 var O = R.prototype;
		 L = L.__proto__;
		 while (true) { 
		   if (L === null) 
		     return false; 
		   if (O === L)  // 這里重點(diǎn)：當(dāng) O 嚴(yán)格等于 L 時(shí)，返回 true 
		     return true; 
		   L = L.__proto__; 
		 } 
	}
	// 開始測試
	var a = []
	var b = {}




 function Foo(){}
	var c = new Foo()
 
  	function child(){}
	function father(){}
  	child.prototype = new father() 
var d = new child()




 console.log(instance_of(a, Array)) // true
	console.log(instance_of(b, Object)) // true
	console.log(instance_of(b, Array))  // false
	console.log(instance_of(a, Object)) // true
	console.log(instance_of(c, Foo))    // true
	console.log(instance_of(d, child))  // true
	console.log(instance_of(d, father)) // true
</script>
</body>
</html>


?



方法二：在方法一的基礎(chǔ)上使用 constructor (此方法無法用于判斷繼承)



<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
<script type="text/javascript">
	function instance_of(L, R) {//L 表示左表達(dá)式，R 表示右表達(dá)式
		 var O = R;
		 L = L.__proto__;
		 while (true) { 
		   if (L === null) 
		     return false; 
		   if (O === L.constructor)  // 這里重點(diǎn)：當(dāng) O 嚴(yán)格等于 L 時(shí)，返回 true 
		     return true; 
		   L = L.__proto__; 
		 } 
	}
	// 開始測試
	var a = []
	var b = {}


	function Foo(){}
	var c = new Foo()
 
  	function child(){}
	function father(){}
  	child.prototype = new father() 
var d = new child()


	console.log(instance_of(a, Array))  // true
	console.log(instance_of(b, Object)) // true
	console.log(instance_of(b, Array))  // false
	console.log(instance_of(a, Object)) // true
	console.log(instance_of(c, Foo))    // true
	console.log(instance_of(d, child))  // false 這里就是無法用于判斷繼承的
	console.log(instance_of(d, father)) // true
</script>
</body>
</html>



??
來源：http://www./content-4-148601.html
                                    		
                                

                            
                        

                    




                

                

                    
                    
                        

                            
                                
    
                                		
                        
    
                        
                
    
                
    
                
                
                
    
                
    


                

                
    本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間，所有內(nèi)容均由用戶發(fā)布，不代表本站觀點(diǎn)。請注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購買等信息，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請點(diǎn)擊一鍵舉報(bào)。
    
                
                

                
    
                    轉(zhuǎn)藏
                    
                    
                    
                    
                    
                    
                        分享
                        
                        
                    
                    獻(xiàn)花（0）
                            
                
    
                
                
                
    
                    
    
                        
                        
                    
    
                
    

            
    

            
    

            
    
                
                
                
    
                
    
                    
    
                        
    0條評論
    
                        
                        
                        
    
                            
                            
    
                                發(fā)表
                            
    
                        
    
                        
                    
    
                    
                    
    請遵守用戶 評論公約
    
                    
                    
      
                    
    
                    
    
                    
    
                    
                
    
               
                
    
                    
    
                        類似文章
                        更多