首頁 > 軟體

JavaScript的參照資料型別你瞭解多少

2022-02-11 19:14:58

三種傳遞

  • 資料傳遞:變數傳遞給另外一個變數
  • 值傳遞:會把資料複製一份傳遞,(簡單型別
  • 參照傳遞:會把資料地址複製一份傳遞,(參照型別)

1、Object

【解釋】: Object 是內建的建構函式,用於建立普通物件。

1、建立物件語法

字面量建立物件範例

let obj = {
			uname : '阿飛',
			age : 22,
			sex : '男'
		}

建構函式建立

// Object:建立普通物件的建構函式
let obj = new Object( {uname : '阿飛', age : 22, sex : '男'} );

物件所有鍵的獲取

let re = Object.keys(obj)

物件所有值的獲取

let re = Object.values(obj);

2、普通物件在記憶體中的儲存方式

普通物件資料儲存在堆記憶體之中,棧記憶體中儲存了普通物件在堆記憶體的地址。

普能物件在賦值時只是複製了棧內中的地址,而非堆記憶體中的資料 [普通物件賦值後,無論修改哪個變數另一個物件的資料值也會相當發生改變。]

【小結】:

  1. 推薦使用字面量方式宣告物件,而不是 Object 建構函式
  2. Object.assign 靜態方法建立新的物件
  3. Object.keys 靜態方法獲取物件中所有屬性
  4. Object.values 表態方法獲取物件中所有屬性值

【堆與棧的區別】:

  • 堆和棧是記憶體中的資料儲存空間
  • 簡單型別的資料儲存在記憶體的棧空間中
  • 參照型別的資料儲存在記憶體的堆空間中,棧記憶體中存取的是參照型別的地址(房間號)

2、Array

1、建立陣列語法

字面量

let arr = [1, 2, 3];

建構函式

let ary = new Array(1, 2, 3);

2、陣列的在記憶體中的儲存方式

陣列在記憶體中的儲存方式與普通物件一樣

陣列在賦值時只是複製了棧內中的地址,而非堆記憶體中的資料

3、陣列常用方法

1、 concat:用於拼接為新陣列

		let arr = [1, 2, 3];
		let ary1 = ['a', 'b', 'c', 'd'];
		let ary2 = [11, 222, 333];
		let reArr = arr.concat(ary1, ary2, '張飛', '關羽', '趙雲');
		console.log(reArr);

2、 join():用於連線陣列的每個元素成為字串

		let arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
		let str = arr1.join('');
		console.log(str);

3、 reverse:翻轉陣列順序

		let arr3 = [1, 2, 3];
		let re = arr.reverse();
		console.log(re);

4、 indexOf:查詢某個元素在陣列中首次出現的索引位置,找不到就是返回-1

        let arr1 = ['a', 'b', 'c', 'd', 'a', 'b', 'f'];
		let re1 = arr1.indexOf('a');
		console.log(re1);

5、 lastIndexOf:查詢某個元素在陣列中尾次出現的索引位置,找不到就返回-1

		let re2 = arr1.lastIndexOf('b');
		console.log(re2);

6、 sort正序排列

		let arr2 = [3, 16, 22, 66, 123, 99];

		// sort正序排列:
		let re3 = arr2.sort(function (a, b) {
			return a - b;
		});

7、 sort倒序排列

		// sort倒序排列
		let arr2 = [3, 16, 22, 66, 123, 99];
		let re4 = arr2.sort(function (a, b) {
			return b - a;
		});

8、 判斷一個值是否是陣列

		let a = [1, 2, 3];
		let re = Array.isArray(a);
		console.log(re);

9、 把偽陣列轉換為真陣列 Array.from(偽陣列)

// 特別注意:要想把偽陣列轉換為真陣列必須有length屬性
		let o = {
			0 : 'a',
			1 : 'b',
			2 : 'c',
			3 : 'd',
			4 : 'e',
			5 : 'f',
			6 : 'h',
			length : 4,
		}

		let ary = Array.from(o);

		console.log( ary );

10、forEach遍歷陣列

		let arr = [
					{uname :'阿飛', age : 22, sex : '男'},
					{uname :'張三丰', age : 23, sex : '男'},
					{uname :'李尋歡', age : 21, sex : '男'},
					{uname :'張三丰1', age : 23, sex : '男'},
					{uname :'李尋歡1', age : 21, sex : '男'},
					{uname :'張三丰2', age : 23, sex : '男'},
					{uname :'李尋歡2', age : 21, sex : '男'},
					{uname :'張三丰2', age : 23, sex : '男'},
					{uname :'李尋歡2', age : 21, sex : '男'},
				];
		arr.forEach( item => {
			console.log(`姓名:${item.uname},年齡${item.age},性別${item.sex}`);
		} );

11、find:用於查詢首次出現的滿足條件的值,並返回

		let re = [2, 6, 4, 7, 9, 3];
		let result = re.find(function (item, index, o) {
			return item > 5;
		})
		console.log(result);

12、findIndex:用於查詢首次出現的滿足條件的值,並返回期所在索引值 沒有則返回-1

		let result1 = re.findIndex(function (item, index, o) {
			return item > 40;
		});
		console.log(result1);

13、some:用於查詢如果有一個滿足條件返回true

		let result2 = re.some(function (item, index, o) {
			return item > 5;
		})
		console.log(result2);

14、every:用於查詢滿足條件的元素,如果都滿足返回true,否則就是false

		let result3 = re.every(function (item, index, o) {
			return item > 5;
		});
		console.log(result3);

15、filter:篩選陣列把滿足條件的元素放到新陣列返回

		let result4 = re.filter(function (item, index, o) {
			return item > 5;
		});
		console.log(result4);

16、map:遍歷陣列讓每個元素執行一邊回撥函數,把所有結果放到新陣列返回

		let result5 = re.map(function (item, index, o) {

			return item * item;

		});
		console.log(result5);

3、RegExp正則

1、建立語法

字面量

let reg = /abc/;

建構函式

let reg1 = new RegExp(/abc/);

總結

本篇文章就到這裡了,希望能夠給你帶來幫助,也希望您能夠多多關注it145.com的更多內容!  


IT145.com E-mail:sddin#qq.com