JavaScript的引用數(shù)據(jù)類型你了解多少
更新時間：2022年02月11日 16:00:49 作者：執(zhí)手天涯@
這篇文章主要為大家詳細(xì)介紹了JavaScript的引用數(shù)據(jù)類型，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助
三種傳遞
- 數(shù)據(jù)傳遞：變量傳遞給另外一個變量
- 值傳遞：會把數(shù)據(jù)復(fù)制一份傳遞，（簡單類型
- 引用傳遞：會把數(shù)據(jù)地址復(fù)制一份傳遞，（引用類型）
1、Object
【解釋】： Object 是內(nèi)置的構(gòu)造函數(shù)，用于創(chuàng)建普通對象。
1、創(chuàng)建對象語法
字面量創(chuàng)建對象示例
let obj = {
uname : '阿飛',
age : 22,
sex : '男'
}
構(gòu)造函數(shù)創(chuàng)建
// Object：創(chuàng)建普通對象的構(gòu)造函數(shù)
let obj = new Object( {uname : '阿飛', age : 22, sex : '男'} );
對象所有鍵的獲取
let re = Object.keys(obj)
對象所有值的獲取
let re = Object.values(obj);
2、普通對象在內(nèi)存中的存儲方式
普通對象數(shù)據(jù)保存在堆內(nèi)存之中，棧內(nèi)存中保存了普通對象在堆內(nèi)存的地址。
普能對象在賦值時只是復(fù)制了棧內(nèi)中的地址，而非堆內(nèi)存中的數(shù)據(jù) [普通對象賦值后，無論修改哪個變量另一個對象的數(shù)據(jù)值也會相當(dāng)發(fā)生改變。]
【小結(jié)】：
- 推薦使用字面量方式聲明對象，而不是
Object構(gòu)造函數(shù) Object.assign靜態(tài)方法創(chuàng)建新的對象Object.keys靜態(tài)方法獲取對象中所有屬性Object.values表態(tài)方法獲取對象中所有屬性值
【堆與棧的區(qū)別】：
- 堆和棧是內(nèi)存中的數(shù)據(jù)存儲空間
- 簡單類型的數(shù)據(jù)保存在內(nèi)存的?？臻g中
- 引用類型的數(shù)據(jù)保存在內(nèi)存的堆空間中，棧內(nèi)存中存取的是引用類型的地址（房間號）
2、Array
1、創(chuàng)建數(shù)組語法
字面量
let arr = [1, 2, 3];
構(gòu)造函數(shù)
let ary = new Array(1, 2, 3);
2、數(shù)組的在內(nèi)存中的存儲方式
數(shù)組在內(nèi)存中的存儲方式與普通對象一樣
數(shù)組在賦值時只是復(fù)制了棧內(nèi)中的地址，而非堆內(nèi)存中的數(shù)據(jù)
3、數(shù)組常用方法
1、 concat：用于拼接為新數(shù)組
let arr = [1, 2, 3]; let ary1 = ['a', 'b', 'c', 'd']; let ary2 = [11, 222, 333]; let reArr = arr.concat(ary1, ary2, '張飛', '關(guān)羽', '趙云'); console.log(reArr);
2、 join()：用于連接數(shù)組的每個元素成為字符串
let arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
let str = arr1.join('');
console.log(str);
3、 reverse：翻轉(zhuǎn)數(shù)組順序
let arr3 = [1, 2, 3]; let re = arr.reverse(); console.log(re);
4、 indexOf：查找某個元素在數(shù)組中首次出現(xiàn)的索引位置，找不到就是返回-1
let arr1 = ['a', 'b', 'c', 'd', 'a', 'b', 'f'];
let re1 = arr1.indexOf('a');
console.log(re1);
5、 lastIndexOf：查找某個元素在數(shù)組中尾次出現(xiàn)的索引位置，找不到就返回-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、 判斷一個值是否是數(shù)組
let a = [1, 2, 3]; let re = Array.isArray(a); console.log(re);
9、 把偽數(shù)組轉(zhuǎn)換為真數(shù)組 Array.from(偽數(shù)組)
// 特別注意：要想把偽數(shù)組轉(zhuǎn)換為真數(shù)組必須有l(wèi)ength屬性
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遍歷數(shù)組
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：用于查找首次出現(xiàn)的滿足條件的值，并返回
let re = [2, 6, 4, 7, 9, 3];
let result = re.find(function (item, index, o) {
return item > 5;
})
console.log(result);
12、findIndex：用于查找首次出現(xiàn)的滿足條件的值，并返回期所在索引值 沒有則返回-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：篩選數(shù)組把滿足條件的元素放到新數(shù)組返回
let result4 = re.filter(function (item, index, o) {
return item > 5;
});
console.log(result4);
16、map：遍歷數(shù)組讓每個元素執(zhí)行一邊回調(diào)函數(shù)，把所有結(jié)果放到新數(shù)組返回
let result5 = re.map(function (item, index, o) {
return item * item;
});
console.log(result5);
3、RegExp正則
1、創(chuàng)建語法
字面量
let reg = /abc/;
構(gòu)造函數(shù)
let reg1 = new RegExp(/abc/);
總結(jié)
本篇文章就到這里了，希望能夠給你帶來幫助，也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
javascript 基礎(chǔ)簡介 適合新手學(xué)習(xí)
在網(wǎng)絡(luò)或書籍所說的JavaScript大部分指客戶端JavaScript。2009-09-09
下面小編就為大家?guī)硪黄狫avaScript:Array類型全面解析。小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-05-05
這篇文章主要JavaScript 的變量，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03
這篇文章主要介紹了淺談開發(fā)eslint規(guī)則，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-10-10
Javascript基礎(chǔ)教程之?dāng)?shù)據(jù)類型轉(zhuǎn)換
JavaScript是一種無類型語言，但同時JavaScript提供了一種靈活的自動類型轉(zhuǎn)換的處理方式?；疽?guī)則是，如果某個類型的值用于需要其他類型的值的環(huán)境中，JavaScript就自動將這個值轉(zhuǎn)換成所需要的類型。2015-01-01
這篇文章主要介紹了JavaScript執(zhí)行順序，有需要的朋友可以參考一下2013-12-12
JavaScript For Beginners(轉(zhuǎn)載)
JavaScript For Beginners(轉(zhuǎn)載)...2007-01-01
javascript運(yùn)行機(jī)制之this詳細(xì)介紹
這篇文章主要介紹了javascript運(yùn)行機(jī)制之this,需要的朋友可以參考下2014-02-02
JS backgroundImage控制代碼。2009-05-05
文章對javascript的四種函數(shù)模式進(jìn)行了詳細(xì)的解釋，并附上示例，方便小伙伴們理解并應(yīng)用，希望對大家能有所幫助。2014-11-11