js中的構造函數,原型,原型鏈,繼承

在自身的理解中,這幾個概念是分不開的,不能脫離一種去了解另外一種。在網上看到很多資料,但是每個人對於他們的理解可能有些不同,而且發現對某些概念網上的資料有的並沒有說清楚,所以本人寫了這篇文章,希望能夠對讀者產生一點作用、

1.首先要介紹js中的構造函數

1.我覺得要理解構造函數,首先應該弄清楚什麼是工廠模式,應該在工廠模式的基礎上進行介紹,那樣更加看的更加清晰一些。
首先我們先建立一個基於工廠模式的函數:
		//基於工廠模式創建函數
		//1.原料 2.加工 3.出廠
		function person(name,age){
			//相當於原料
			var obj=new Object();
			//對原料進行加工
			obj.name=name;
			obj.age=age;
			//產品出廠
			return obj;
		}
		//定義變量來使用
		var p1=person("aa",14);
上面的代碼就是一個典型的工廠模式函數,通過1.創建原料 2.對原料進行加工 3.出廠 就可以實現。但是我們使用這種方式的時候會遇到一個很大的問題,就是不斷的new對象。也就是說每調用一次該函數,,就會在內存中開闢一個新的空間,這樣會造成內存很大的浪費。所以我們需要一種更好的方式來創建對象。

2.這時候我們可以使用this關鍵字來實現更好的方式,同樣是上面的代碼,我們進行一下改造:
		//基於工廠模式創建函數
		//1.原料 2.加工 3.出廠
		function person(name,age){
			//相當於原料
			// var obj=new Object();
			this.name=name;
			this.age=age;
			//對原料進行加工
			// obj.name=name;
			// obj.age=age;
			//產品出廠
			// return obj;
		}
		//定義變量來使用
		var p1=new person("aa",14);
		console.log(p1.name);
仔細觀察代碼和上一次代碼的不同:1.函數內部沒有使用new來創建新對象;2.並且函數沒有return返回值;3.在使用的時候使用了new person()來創建新對象。需要注意:在使用this的時候爲什麼可以不用在函數內部創建新對象,爲什麼可以不用返回return

3.其實第二部分的函數就可以叫做構造函數啦,只不過有些規則還沒有符合構造函數的要求。所以作爲構造函數的特點是什麼呢?
         1.函數名首字母要大寫
2.內容使用this關鍵字來操作私有屬性
3.沒有return返回值
4.使用new關鍵字來創建新對象
綜上所述,一個完整的構造函數代碼(在添加原型之前):
		function Person(name,age){
			this.name=name;
			this.age=age;
		}
		//定義變量來使用
		var p1=new Person("aa",14);
		console.log(p1.name);

今天就先寫在這裏吧,時間有點晚了,原型,繼承,原型鏈真要說起來有點多。就在後面再說吧

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章