<option id="mwy0y"><strong id="mwy0y"></strong></option>
  • <ul id="mwy0y"><sup id="mwy0y"></sup></ul>
  • <ul id="mwy0y"></ul>
  • <del id="mwy0y"><dfn id="mwy0y"></dfn></del><ul id="mwy0y"><sup id="mwy0y"></sup></ul>
  • <abbr id="mwy0y"></abbr>

    千鋒教育-做有情懷、有良心、有品質(zhì)的職業(yè)教育機(jī)構(gòu)

    400-811-9990
    手機(jī)站
    千鋒教育

    千鋒學(xué)習(xí)站 | 隨時(shí)隨地免費(fèi)學(xué)

    千鋒教育

    掃一掃進(jìn)入千鋒手機(jī)站

    領(lǐng)取全套視頻
    千鋒教育

    關(guān)注千鋒學(xué)習(xí)站小程序
    隨時(shí)隨地免費(fèi)學(xué)習(xí)課程

    上海
    • 北京
    • 鄭州
    • 武漢
    • 成都
    • 西安
    • 沈陽(yáng)
    • 廣州
    • 南京
    • 深圳
    • 大連
    • 青島
    • 杭州
    • 重慶
    當(dāng)前位置:長(zhǎng)沙千鋒IT培訓(xùn)  >  技術(shù)要點(diǎn)  >  長(zhǎng)沙Web前端培訓(xùn):Javascript中的內(nèi)置對(duì)象數(shù)組講解

    長(zhǎng)沙Web前端培訓(xùn):Javascript中的內(nèi)置對(duì)象數(shù)組講解

    來源:千鋒教育
    發(fā)布人:千鋒長(zhǎng)沙
    時(shí)間: 2021-11-17 16:04:40

           有關(guān)js中的數(shù)組,很多小伙伴可能都會(huì)有疑問,尤其是面試的過程中有大量有關(guān)于原生數(shù)組的題,以及數(shù)組中的方法,及方法的返回值、是否會(huì)修改原數(shù)組等等。想要徹底解決這些問題,就要系統(tǒng)的解析數(shù)組的方法,那么今天長(zhǎng)沙Web前端培訓(xùn)就來深度解析一下這個(gè)問題哈。

    u=3377524445,2378825670&fm=26&fmt=auto.webp

    什么是數(shù)組?數(shù)組:存儲(chǔ)一組或一系列相關(guān)數(shù)據(jù)的窗口,相當(dāng)于多個(gè)變量的組合。

    當(dāng)有多個(gè)數(shù)據(jù)進(jìn)行存儲(chǔ)和處理時(shí)使用數(shù)組,如果存儲(chǔ)5個(gè)、50個(gè)數(shù)據(jù)呢?

    數(shù)組是在內(nèi)存中連續(xù)開辟的空間,相比變量,對(duì)于存儲(chǔ)或讀取數(shù)據(jù)的性能更高、更快。

    數(shù)組下標(biāo):能夠標(biāo)識(shí)唯一一個(gè)數(shù)組空間的索引號(hào)。(相當(dāng)于房間的門牌號(hào))

    下標(biāo)從0開始,最大下標(biāo):數(shù)組的長(zhǎng)度- 1

    數(shù)組的元素:存儲(chǔ)在數(shù)組中具有唯一索引號(hào)中的數(shù)據(jù),叫元素。

    如何聲明數(shù)組?

    字面量方式:[]

    構(gòu)造函數(shù)方式:new Array()

    var arr = []; //聲明一個(gè)空數(shù)組

    var list = new Array(); //聲明一個(gè)空數(shù)組

    兩種聲明方式的區(qū)別?

    字面量方式,無論存儲(chǔ)什么數(shù)據(jù),都表示數(shù)組元素。

    構(gòu)造函數(shù)中有且僅有一個(gè)正整數(shù)時(shí),表示數(shù)組長(zhǎng)度。

    構(gòu)造函數(shù)中有一個(gè)負(fù)整數(shù)或小數(shù)時(shí),直接報(bào)錯(cuò)

    構(gòu)造函數(shù)中有一個(gè)或多個(gè)其它類型數(shù)據(jù)時(shí),表示數(shù)組元素。

    var arr = [5]; // 表示數(shù)組中有一個(gè)元素是5,長(zhǎng)度是1

    var arr = new Array(5); //表示這個(gè)數(shù)組的長(zhǎng)度為5,可以存放5個(gè)元素。默認(rèn)元素為undefined,undefined,undefined,undefined,undefined

    var arr = new Array(-5); //長(zhǎng)度不能為負(fù)數(shù),程序報(bào)錯(cuò)

    var arr = new Array(5.3); //長(zhǎng)度不能為小數(shù),程序報(bào)錯(cuò)

    var arr = new Array('3'); //表示數(shù)組中有一個(gè)元素是'3',長(zhǎng)度是1

    var arr = new Array(1,2,3,4,5);//表示數(shù)組中有5個(gè)元素,分別是1 2 3 4 5 ,長(zhǎng)度是5

    如何訪問數(shù)組?

    數(shù)組名[下標(biāo)]

    var arr = [1,2,3,4,5]; //聲明一個(gè)數(shù)組,存放了5個(gè)元素

    arr[5] = 6; //為數(shù)組新增了一個(gè)元素6,下標(biāo)為5

    console.log(arr[0]); //訪問數(shù)組中0下標(biāo)對(duì)應(yīng)的元素是1

    數(shù)組的屬性

    length : 表示數(shù)組的長(zhǎng)度(即數(shù)組中有多少個(gè)內(nèi)存空間)

    var arr = [1,2,3,4];

    console.log(arr.length); // 4 表示數(shù)組的長(zhǎng)度

    數(shù)組的方法(增、刪、改、截、拼、復(fù)、排、轉(zhuǎn))

    增:

    unshift(元素,元素,元素,……)

    作用:在數(shù)組的首部添加新元素。

    返回值:新增后數(shù)組的長(zhǎng)度

    是否影響原數(shù)組:是

    var arr = [5,6,7,8,9]; //聲明一個(gè)數(shù)組

    console.log(arr.unshift(true,[1,2,3],false)); //unshift方法的返回值,8 表示新增后這個(gè)數(shù)組的長(zhǎng)度是8

    console.log(arr); // 輸出原數(shù)組 [true,[1,2,3],false,5,6,7,8,9]

    push(元素,元素,元素,……)

    作用:在數(shù)組的尾部添加新元素。

    返回值:新增后數(shù)組的長(zhǎng)度

    是否影響原數(shù)組:是

    var arr = [5,6,7,8,9];

    console.log(arr.push(true,[1,2,3],false)); //push方法的返回值,8 表示新增后這個(gè)數(shù)組的長(zhǎng)度是8

    console.log(arr); // 輸出原數(shù)組 [5, 6, 7, 8, 9, true, [1,2,3], false]

    刪:

    shift()

    作用:刪除數(shù)組首部的一個(gè)元素( 一次只能刪除一個(gè))

    返回值:被刪除的元素

    是否影響原數(shù)組:是

    var arr = [5,6,7,8,9];

    console.log(arr.shift()); //shift方法的返回值,5 表示在數(shù)組中刪除的元素5

    console.log(arr); // 輸出原數(shù)組 [6, 7, 8, 9]

    //刪除全部元素

    var arr = [5,6,0,8,9];

    while(arr.length){

    arr.shift();

    }

    console.log(arr);

    pop()

    作用:刪除數(shù)組尾部的一個(gè)元素( 一次只能刪除一個(gè))

    返回值:被刪除的元素

    是否影響原數(shù)組:是

    var arr = [5,6,7,8,9];

    console.log(arr.pop()); //9 pop方法的返回值,9 表示在數(shù)組中刪除的元素9

    console.log(arr); // 輸出原數(shù)組 [5, 6, 7, 8]

    改:

    splice(start,del_length,元素,元素,……)

    start : 從哪個(gè)下標(biāo)位置開始

    del_length : 刪除幾個(gè)元素

    元素 :新增的元素

    作用:在數(shù)組的任意位置可以增、刪、改的操作。

    返回值:被刪除的元素?cái)?shù)組

    是否影響原數(shù)組:是

    var arr = [5,6,7,8,9];

    //只有一個(gè)參數(shù)時(shí),表示從指定的下標(biāo)開始刪除到數(shù)組末尾

    console.log(arr.splice(1)); // [6, 7, 8, 9] 返回值

    console.log(arr); // [5] 原數(shù)組

    var arr1 = [5,6,7,8,9];

    //兩個(gè)參數(shù)時(shí),表示從指定的下標(biāo)位置開始刪除指定長(zhǎng)度的元素

    console.log(arr1.splice(1,2)); // [6, 7]

    console.log(arr1); // [5, 8, 9]

    var arr2 = [5,6,7,8,9];

    //在刪除的位置新增元素。從下標(biāo)1開始刪除2個(gè)元素,并在下標(biāo)1的位置新增true,false兩個(gè)元素

    console.log(arr2.splice(1,2,true,false)); // [6, 7]

    console.log(arr2); // [5, true, false, 8, 9]

    var arr3 = [5,6,7,8,9];

    //在下標(biāo)1的位置,刪除0個(gè)元素,并在下標(biāo)1的位置新增兩個(gè)元素true,false

    console.log(arr3.splice(1,0,true,false)); // []

    console.log(arr3); // [5, true, false, 6, 7, 8, 9]

    截:

    slice(start,end)

    start : 從哪個(gè)下標(biāo)位置開始

    end : 到哪個(gè)下標(biāo)位置結(jié)束(不包含結(jié)束位置)

    作用:截取數(shù)組中指定范圍的元素

    返回值:被截取到的元素?cái)?shù)組

    是否影響原數(shù)組:否

    var arr = [5,6,7,8,9];

    // 從原數(shù)組中的下標(biāo)1位置開始截取到數(shù)組末尾,并返回截取到的新數(shù)組

    console.log(arr.slice(1)); // [6, 7, 8, 9] 返回值

    console.log(arr); // [5,6,7,8,9] 原數(shù)組

    var arr1 = [5,6,7,8,9];

    //從原數(shù)組中的下標(biāo)1位置開始截取到3下標(biāo)之前(不包含3下標(biāo))

    console.log(arr1.slice(1,3)); // [6, 7] 返回值

    console.log(arr1); // [5,6,7,8,9] 原數(shù)組

    var arr2 = [5,6,7,8,9];

    //從原數(shù)組中的下標(biāo)3位置開始截取到1下標(biāo)之前(因?yàn)橹荒芟蛴医厝。形茨芙厝〉皆兀?/p>

    console.log(arr2.slice(3,1)); // [] 返回值

    console.log(arr2); // [5,6,7,8,9] 原數(shù)組

    var arr3 = [5,6,7,8,9];

    //從原數(shù)組中的下標(biāo)-3(最后一個(gè)元素下標(biāo)為-1,-3下標(biāo)對(duì)應(yīng)的元素為7)位置開始截取到-1下標(biāo)之前(不包含-1下標(biāo))

    console.log(arr3.slice(-3,-1)); // [7, 8] 返回值

    console.log(arr3); // [5,6,7,8,9] 原數(shù)組

    拼:

    concat(元素,元素,……)

    作用:在指定的數(shù)組后面拼接新的元素(如果新元素是數(shù)組,則去掉最外層的[]將里面元素拼接)

    返回值:拼接后的新數(shù)組

    是否影響原數(shù)組:否

    var arr = [5,6,7,8,9];

    //拼接的元素如果是多維數(shù)組,則取最外層數(shù)組中的元素原樣拼接到指定數(shù)組的后面

    console.log(arr.concat(1,[true,[1,2]],3)); // [5, 6, 7, 8, 9, 1, true, [1,2], 3] 返回值

    console.log(arr); // [5,6,7,8,9] 原數(shù)組

    復(fù):

    function copyArray(arr){

    return arr.slice(0);

    }

    function cloneArray(arr){

    return arr.concat();

    }

    排:

    reverse()

    作用:將數(shù)組中的元素逆序存放

    返回值:返回逆序后的數(shù)組

    是否影響原數(shù)組:是

    var arr = [3,2,10,4,5];

    console.log(arr.reverse()); // [5, 4, 10, 2, 3] 返回值

    console.log(arr); // [5, 4, 10, 2, 3] 原數(shù)組

    sort()

    作用:將數(shù)組中的元素按照字符編碼進(jìn)行從小到大排序

    返回值:返回逆序后的數(shù)組

    是否影響原數(shù)組:是

    var arr = [3,2,10,4,5];

    //以字符串的方式比較-排序:10 與 2 比較 1 < 2,所以10 < 2

    console.log(arr.sort()); // [10, 2, 3, 4, 5] 返回值

    console.log(arr); // [10, 2, 3, 4, 5] 原數(shù)組

    sort(function(a,b){return a-b;}) : 將數(shù)組中的元素按照數(shù)字進(jìn)行從小到大排序。sort(function(a,b){return b-a;}) : 將數(shù)組中的元素按照數(shù)字進(jìn)行從大到小排序。

    var arr = [3,2,10,4,5];

    // 按數(shù)字 從小到大

    console.log(arr.sort(function(a,b){return a-b;})); //[2, 3, 4, 5, 10]

    // 按數(shù)字 從大到小

    console.log(arr.sort(function(a,b){return b-a;})); //[10, 5, 4, 3, 2]

    轉(zhuǎn):

    join('連接符')

    作用:將數(shù)組轉(zhuǎn)為以指定連接符連接成的字符串

    返回值:返回轉(zhuǎn)換后的字符串

    是否影響原數(shù)組:否

    var arr = [1,2,3,4];

    // 將數(shù)組轉(zhuǎn)成以空字符串連接成的字符串

    console.log(arr.join('')); //'1234'

    聲明:本站稿件版權(quán)均屬千鋒教育所有,未經(jīng)許可不得擅自轉(zhuǎn)載。

    猜你喜歡LIKE

    最新文章NEW

    相關(guān)推薦HOT

    更多>>

    快速通道 更多>>

    最新開班信息 更多>>

    網(wǎng)友熱搜 更多>>