1. 程式人生 > 其它 >JS基礎:原型和原型鏈

JS基礎:原型和原型鏈

技術標籤:jsjs

原型和原型鏈

class

它是面向物件的語法,可以通過constructor來建立屬性和方法。

	class Student{
   		constructor(name,number){
   			this.name = name
   			this.number = number
   		}
   		sayHi(){
			console.log(
				`姓名 ${this.nsme} ,學號 ${this.number} `
			)
		}
	}
	// 通過new 建立一個例項   (可以new很多個)
	const shili = new Student
(' zhangsan',100) shili.sayHi() // console.log(姓名 zhangsan , 學號 100 )

繼承

它是通過extends來繼承,子類通過super()來使用父類的屬性和方法
extends 繼承
super 執行父類建構函式
擴充套件和重寫

	// 父類
	class People{
		constructor(name){
			this.name=name
		}
		eat(){
			console.log(`${this.name} 吃東西`)
		}
	}

	//子類
	class Student exrends People{
		constructor
(name,number){ super(name) this.number=number } sayHi(){ console.log(`${this.name}的學號是${this.number}`) } } // 例項 const xiaoming=new Student('小明',100) console.log(xiaoming.name) //小明 console.log(xiaoming.number) //100 xiaoming.sayHi() //小明的學號是100 xiaoming.eat() //小明吃東西

型別判斷 instanceof

它可以判斷應用型別

要判斷的型別 instanceof 型別 // true 或 false

原型(關係)

class 實際上是函式,可見是語法糖
每個例項都有___proto___ 隱式原型
每個class都有prototype 顯示原型
例項的__proto__指向對應class的prototype(===)

在這裡插入圖片描述

原型的執行規則

當獲取屬性方法時,
首先在自身屬性和方法中尋找,
如果找不到就會去_proto_中尋找。

原型鏈

在這裡插入圖片描述
class 是ES6語法規範,由ECMA委員會發布
ECMA只規定語法規則,就是我們程式碼的書寫方式,不規定如何實現
以上實現方式都是V8引擎的實現方式,也是現在主流的

手寫簡易jQuery

class jQuery{
	constructor(selector){
		const result = document.querySelectorAll(selector)
		const length = result.length
		for(let i = 0; i < length; i++){
			this.length = length
			this.selector = selector
		}
	}
	get(index){
		return this[index]
	}
	each(fn){
		for(let i = 0; i < this.length; i++){
			const elem = this[i]
			fn(elem)
		}
	}
	on(type,fn){
		return this.each(elem => {
			elem.addEventListener(type,fn,false)
		})
	}
}

// 外掛
jQuery.prototype.dialog = function(info){
	alert(info)
}

class myJQuery wxtends jQuery{
	constructor(selector){
		super(selector)
	}
	// 擴充套件自己的方法
	say(){}
}

const $p = new jQuery('p')
$p.get(1)
$p.each(elem=>{console.log(elem.nodeName)})
$p.on('click',()=>{alert('ckicked')})

流程

流程定義:制定的行程計劃或方案
流程例項:每一次執行方案就是一個例項
流程定義與流程例項是一對多的關係

任務型別

如:使用者任務***、傳送任務、接收任務、手工任務、業務任務、服務任務、指令碼任務、呼叫任務、子流程等。

使用者任務面板:

Assignee:執行人/代理人
Candidate Users:候選人(可以有多人)
Candidate Groups:候選組
Due Date:任務到期時間

查詢歷史記錄

歷史綜合資訊:HistoricTaskInstance
歷史變數:HistoricVariableInstance