1. 程式人生 > >JS丨基礎考察06丨原型鏈類

JS丨基礎考察06丨原型鏈類

01. 原型鏈類 大綱

<script type="text/javascript">
	01. 建立物件有幾種方法: 字面量、顯示建構函式、Object.create
	
	
	02. 原型、建構函式、例項、原型鏈
		01. 建構函式.prototype.constructor === 建構函式
		02. 建構函式.prototype === 例項化物件.__proto__
		
		03. Function.prototype === 建構函式.__proto__ === 例項化對.__proto__.constructor.__proto__
	
	
	03. instanceof 的原理
	console.log(例項化物件 instanceof 建構函式);
	console.log(例項化物件 instanceof Object);
	
	
	04. new 運算子
		var new02 = function(func){
			var obj = Object.create(func.prototype);
			var k = func.call(obj)
			if(typeof k === 'object'){
				return k;
			}else{
				return obj
			}
		}
</script>

 02. 建立物件有幾種方式

<script type="text/javascript">
	// 01. 第一種方式: 字面量
	var obj01 = {
		name: '011'
	};
	var obj02 = new Object({
		name: '012'
	})
	console.log(obj01)
	console.log(obj02)
	// 02. 第二種方式: 顯示建構函式
	var M = function(name){
		this.name = name
	}
	var obj03 = new M('021')
	console.log(obj03)
	// 03. 第三種方式: Object.create
	var p = {
		name: '030'
	}
	var obj04 = Object.create(p)
	console.log(obj04)
</script>

02. 原型、建構函式、例項、原型鏈

<script type="text/javascript">
	// 02. 原型、建構函式、例項、原型鏈
	console.log(M.prototype.constructor)// 指向建構函式
	console.log(M === M.prototype.constructor)
	
	
	console.log(M.prototype)// 指向建構函式的原型物件
	console.log(obj03.__proto__)// 指向建構函式的原型物件
	
	console.log(obj03.__proto__ === M.prototype)
	console.log(obj03.__proto__.constructor === M.prototype.constructor)
	console.log(M.__proto__ === Function.prototype)
	//console.log(Function.prototype === obj03.__proto__.constructor.__proto__)
</script>

03. instanceof 的原理

<script type="text/javascript">
	// 03. instanceof 的原理
	console.log(obj03 instanceof M);
	console.log(obj03 instanceof Object);
	
	console.log(M.prototype.__proto__ === Object.prototype) 
	console.log(obj03.__proto__.constructor === M)
	console.log(obj03.__proto__.constructor === Object) 
</script>

04. new 運算子

<script type="text/javascript">
	// 04. new 運算子
	M.prototype.say = function(){
		console.log('say hi')
	}
	var obj05 = new M('05')
	console.log(obj05)
	
	// 運算子工作原理
	var new02 = function(func){
		var obj = Object.create(func.prototype);
		var k = func.call(obj)
		if(typeof k === 'object'){
			return k;
		}else{
			return obj
		}
	}
	var obj06 = new02(M)
	console.log(obj06)
	console.log(obj06.__proto__.constructor === M)
</script>