超碰av在线|无码精品一区二区三区在线|伊人色色日韩一级片内射视频群批_欧美丰满少妇人妻HD高清在线_亚洲一区二区中文_亚洲无码动漫专区

數(shù)組常用的方法

2019-10-15    seo達人

數(shù)組常見方法

數(shù)組的方法

一、join() 方法 ----->不會改變原數(shù)組

二、concat() 方法 ----->不會改變原數(shù)組

三、splice(index, num, item) ----->會改變原數(shù)組

  1. splice(index, num) 刪除功能
  2. splice(index, 0, ...item)
  3. splice(index, num, item)
  4. splice(index)

    四、slice() -----> 不會改變原數(shù)組

    五、push() 和 pop() ----->會改變原數(shù)組

    六、shift() 和 unshift() -----> 會改變原數(shù)組

    七、sort() -----> 會改變原數(shù)組

    八、reverse() ----->會改變原數(shù)組

    九、indexOf() 和 lastIndexOf()

    十、includes()

    十一、forEach()

    十二、map() -----> 不會改變原數(shù)組

    十三、filter() -----> 不會改變原數(shù)組

    十四、every()

    十五、some()

    十六、reduce() 和 reduceRight()

    十七、Array.from() 將類數(shù)組轉化為數(shù)組

    十八、Array.of() 方法用于將一組值轉化為數(shù)組

    十九、數(shù)組實例的 find() 和 findIndex()

    二十、扁平化數(shù)組 flat() 方法 -----> 不會改變原數(shù)組

    數(shù)組的方法

    一、join() 方法 ----->不會改變原數(shù)組

    該方法可以將數(shù)組里面的元素,通過指定的分隔符以字符串的形式連接起來

    返回值:返回新的字符串



    // join() 將數(shù)組轉化為字符串

    let arr = [1, 2, 3, 4, 5]

    let str1 = arr.join('|')

    console.log(arr) // [1, 2, 3, 4, 5]

    console.log(str1) // 1|2|3|4|5

    // 當傳空字符串時

    let str2 = arr.join('') // 12345

    // 當不傳時

    let str3 = arr.join() // 1,2,3,4,5

    1

    2

    3

    4

    5

    6

    7

    8

    9

    二、concat() 方法 ----->不會改變原數(shù)組

    該方法可以把兩個數(shù)組里的元素拼接成一個新的數(shù)組

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



    let arr1 = [0, 1, 2]

    let arr2 = [2, 3, 4]

    let arr = arr1.concat(arr2)

    // 傳入二維數(shù)組

    let arrCopy = arr1.concat([12, [17, 26]])

    console.log(arrCopy) // [0, 1, 2, 12, [17, 26]]

    console.log(arr) // [0, 1, 2, 2, 3, 4]

    console.log(arr1) // [0, 1, 2]

    console.log(arr2) // [2, 3, 4]



    // ES6 擴展運算符

    let a = [1, 2]

    let b = [2, 3]

    let ab = [...a, ...b] // [1, 2, 2, 3]

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    三、splice(index, num, item) ----->會改變原數(shù)組

    index 參數(shù):必傳,整數(shù),規(guī)定添加或者刪除的位置,使用負數(shù)時,從數(shù)組尾部規(guī)定位置

    num 參數(shù):必傳,要刪除的數(shù)量,如果為 0,則不刪除項目

    item 參數(shù):可選參數(shù),可以是多個,想數(shù)組添加的新項目

    splice 具有刪除,插入,替換的功能


  5. splice(index, num) 刪除功能

    index 參數(shù):開始位置的索引



    num 參數(shù):要刪除元素的個數(shù)



    返回值:返回的是包含被刪除元素的數(shù)組對象



    // 刪除功能

    let array = [1, 2, 3, 4, 5]

    let newArr = array.splice(2, 2)

    console.log(newArr) // [1, 2, 5]

    console.log(array) // [3, 4]



    1

    2

    3

    4

    5

    6
  6. splice(index, 0, …item)

    index 參數(shù):插入元素的索引值

    0 參數(shù):不刪除

    // 插入功能

    let arr = ['a', 'b', 'c', 'd', 'e']

    let newArr = arr.splice(1, 0, ['插入', 1217])

    console.log(newArr) // []

    console.log(arr) // ['a', ['插入', 1217], 'b', 'c', 'd', 'e']



    1

    2

    3

    4

    5

    6
  7. splice(index, num, item)

    index 參數(shù):開始的索引位置

    num 參數(shù):刪除的項個數(shù)

    item 參數(shù):替換項

    返回值:返回包含被刪除的元素的數(shù)組對象

    let arr = [1, 2, 3, 4, 5]

    let newArr = arr.splice(2, 2, '替換', '1226')

    console.log(newArr) // [3, 4]

    console.log(arr) // [1, 2, '替換', '1226', 5]



    1

    2

    3

    4

    5
  8. splice(index)

    當只傳一個值時,表示從傳入的 index 索引值開始截取到最后

    let arr = [1, 2, 3, 4, 5]

    let newArr = arr.splice(3)

    console.log(newArr) // [4, 5]

    console.log(arr) // [1, 2, 3]

    1

    2

    3

    4

    四、slice() -----> 不會改變原數(shù)組

    返回從原數(shù)組中指定開始下標到結束下標之間的項組成的新數(shù)組

    slice() 方法可以接受一或兩個參數(shù),即要返回項的起始位置和結束位置

    array.slice(2) 若只設置一個參數(shù),起始位置為2(包含下標2)開始到數(shù)組最后

    array.slice(2, 5) 若設置兩個參數(shù),起始下標為2(包含下標2)到結束下標5(不包含下標5)的數(shù)組

    當 slice() 參數(shù)中有負數(shù)時,將負數(shù)加上數(shù)組的長度值來替換該位置的數(shù)

    let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]

    let copyArr1 = arr.slice(2) // [3, 4, 5, 6, 7, 8, 9]

    let copyArr2 = arr.slice(2, 5) // [3, 4, 5] 

    let copyArr3 = arr.slice(-2) // [8, 9]

    let copyArr4 = arr.slice(2, -2) // [3, 4, 5, 6, 7]

    let copyArr5 = arr.slice(-2, -5) // []

    let copyArr6 = arr.slice(-5, -2) // [5, 6, 7]

    console.log(arr) // [1, 2, 3, 4, 5, 6, 7, 8, 9]



    1

    2

    3

    4

    5

    6

    7

    8

    9

    五、push() 和 pop() ----->會改變原數(shù)組

    push() 可以接受任意數(shù)量的參數(shù),將其逐個添加到數(shù)組的末尾,并返回修改后數(shù)組的長度(改變了原數(shù)組)

    pop() 刪掉數(shù)組末尾最后一項,改變了數(shù)組的 length 值,并返回刪除的項

    let arr = [1, 2, 3, 4, 5]

    let count = arr.push(0, 1217)

    console.log(count) // 7

    console.loh(arr) // [1, 2, 3, 4, 5, 0, 1217]



    let item = arr.pop()

    console.log(item) // 1217

    console.log(arr) // [1, 2, 3, 4, 5, 0]

    1

    2

    3

    4

    5

    6

    7

    8

    六、shift() 和 unshift() -----> 會改變原數(shù)組

    shift() 刪除原數(shù)組的第一項,并返回刪除元素的值,如果數(shù)組為空折返回 undefined

    unshift() 將參數(shù)添加到原數(shù)組的開頭,并返回數(shù)組的長度

    let arr = [1, 2, 3, 4, 5]

    let item = arr.shift()

    console.log(item) // 1

    console.log(arr) // [2, 3, 4, 5]



    let count = arr.unshift(0, 'Jack')

    console.log(count) // 6

    console.log(arr) // [0, 'Jack', 2, 3, 4, 5]

    1

    2

    3

    4

    5

    6

    7

    8

    七、sort() -----> 會改變原數(shù)組

    在排序時,sort() 方法會調用每個數(shù)組項的 toString() 轉型方法,然后比較得到的字符串,已確定如何排序,其本質是比較字符串的 ASCII 編碼

    即使數(shù)組中的每一項都是數(shù)值,sort() 方法比較的也是字符串,因此會出現(xiàn)以下情況:

    let arr1 = ['a', 'd', 'e', 'b', 'c']

    console.log(arr1.sort()) // ['a', 'b', 'c', 'd', 'e']



    let arr2 = [12, 26, 3, 99, 52]

    console.log(arr2.sort()) // [12, 26, 3, 52, 99]



    1

    2

    3

    4

    5

    6

    解決辦法



    let arr3 = [12, 26, 3, 99, 52]

    arr3.sort((a, b) => {

    return a -b

    })

    console.log(arr3) // [3, 12, 26, 52, 99]

    1

    2

    3

    4

    5

    冒泡排序(優(yōu)化版)



    function mySort (arr) {

    let count = 0 // 記錄循環(huán)次數(shù)

    // 外層循環(huán)  控制循環(huán)的次數(shù),每次找到最大值

    for (let i = 0; i < arr.length - 1; i++) {

    count++

    // 判斷是否排序好了

    let isSort = true // 初始值默認已經(jīng)排序好了

    for (let j = 0; j < arr.length - 1 - i; j++) {

    count++

    if (arr[j] > arr[j + 1]) {

    isSort = false

    // 交換位置

    let tmp = arr[j]

    arr[j] = arr[j + 1]

    arr[j + 1] = tmp

    }

    }

    // 某一趟結束,判斷一下是否結束

    // 如何判斷是否排序好,根據(jù)是否發(fā)生了位置交換,如果發(fā)生了位置交換就說明沒有排序好

    if (isSort) {

    break

    }

    }

    console.log(count)

    return arr

    }

    mySort([12, 26, 17, 520, 99])



    // 打印結果:count 9

    // arr [12, 17, 26, 99, 520]



    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    17

    18

    19

    20

    21

    22

    23

    24

    25

    26

    27

    28

    29

    30

    31

    八、reverse() ----->會改變原數(shù)組

    反轉數(shù)組項的順序

    let arr = [1, 2, 3, 4, 5]

    arr.reverse()

    console.log(arr) // [5, 4, 3, 2, 1]



    1

    2

    3

    4

    九、indexOf() 和 lastIndexOf()

    indexOf() 接受兩個參數(shù):要查找的項和查找起點位置的索引(可選項),其中從數(shù)組的開頭開始向后查找

    lastIndexOf() 接受兩個參數(shù):要查找的項和查找起點位置的索引(可選項),其中是從數(shù)組的末尾開始向前查找

    返回值:當存在時,返回要查找的項在數(shù)組中首次出現(xiàn)的索引值;當不存在時,返回 -1

    可以用來判斷一個值是否存在數(shù)組中



    let arr = [1, 2, 3, 5, 7, 7, 8, 5, 12, 17]

    console.log(arr.indexOf(5)) // 3

    console.log(arr.lastIndexOf(5)) // 7



    console.log(arr.indexOf(5, 2)) // 3

    console.log(arr.lastIndexOf(5, 4)) // 3



    console.log(arr.indexOf('5')) // -1

    1

    2

    3

    4

    5

    6

    7

    8

    十、includes()

    Array.prototype.includes() 數(shù)組實例的方法

    返回一個布爾值,表示某個數(shù)組是否包含給定的值

    推薦使用:可以用來判斷一個值是否存在數(shù)組中



    let arr = [1, 2, 3, 4, 5]

    console.log(arr.includes(3)) // true

    console.log(arr.includes(0)) // false

    1

    2

    3

    十一、forEach()

    對數(shù)組進行遍歷,對數(shù)組中的每一項運行給定函數(shù),沒有返回值



    forEarch(function (item, index, array) {})



    參數(shù) item:表示數(shù)組中的每一項

    參數(shù) index:表示數(shù)組中每一項對應的索引值

    參數(shù) array:表示數(shù)組本身

    let arr = [1, 2, 3, 4, 5]

    arr.forEach((item, index, array) => {

    console.log(item + '---' + index + '---' + (arr === array))

    })

    1

    2

    3

    4

    十二、map() -----> 不會改變原數(shù)組

    map() 方法是將數(shù)組中的每一項調用提供的函數(shù),結果返回一個新數(shù)組,并沒有改變原來的數(shù)組

    映射



    let arr = [1, 2, 3, 4, 5]

    let newArr = arr.map(item => item * item)



    console.log(newArr) // [1, 4, 9, 16, 25]

    console.log(arr) // [1, 2, 3, 4, 5]

    1

    2

    3

    4

    5

    十三、filter() -----> 不會改變原數(shù)組

    filter() 方法是將數(shù)組中所有的元素進行判斷,將滿足條件的元素作為一個新數(shù)組返回

    過濾



    let arr = [12, 17, 26, 520, 1314]

    let newArr = arr.filter((item, index) => {

    return item > 20

    })

    console.log(newArr) // [26, 520, 1314]

    1

    2

    3

    4

    5

    十四、every()

    every() 判斷數(shù)組中每一項都是否滿足條件,只有所有項都滿足條件才返回 true,否則返回 false

    let arr = [1, 2, 3, 4, 5]

    let boolean1 = arr.every(item => item > 0)

    let boolean2 = arr.every(item => item > 3)



    console.log(boolean1) // true

    console.log(boolean2) // false

    1

    2

    3

    4

    5

    6

    十五、some()

    some() 判斷數(shù)組中是否存在滿足條件的項,只要有一項滿足條件,就會返回 true,否則返回 false

    let arr = [1, 2, 3, 4, 5]

    let boolean3 = arr.some(item => item > 3)

    let boolean4 = arr.some(item => item < 0)



    console.log(boolean3) // true

    console.log(boolean4) // false

    1

    2

    3

    4

    5

    6

    十六、reduce() 和 reduceRight()

    reduce() 方法是所有元素調用返回函數(shù),返回值為最后結果,傳入的值必須是函數(shù)類型

    接受兩個參數(shù):每一項調用的函數(shù)和作為歸并基礎的初始值(可選項)

    這個函數(shù)返回的任何值都會作為第一個參數(shù)自動傳給下一項。第一次迭代發(fā)生在數(shù)組的第二項上,因此第一個參數(shù)是數(shù)組的第一項,第二個參數(shù)就是數(shù)組的第二項。



    // 利用 reduce() 方法實現(xiàn)數(shù)組求和,給數(shù)組一開始家里一個初始值 3

    let arr = [1, 2, 3, 4, 5]

    let sum = arr.reduce((prev, cur, index, array) => {

    // 函數(shù)接受 4 個參數(shù):

    // 前一個值、當前值、項的索引值、原數(shù)組對象

    console.log(prev, '---', cur, '---', index, '---', array)

    return prev + cur

    }, 3)

    console.log(sum) // 18 = 15 + 3

    1

    2

    3

    4

    5

    6

    7

    8

    9

    與之相對應的還有一個 Array.reduceRight() 方法,區(qū)別是這個是從右向左操作的



    十七、Array.from() 將類數(shù)組轉化為數(shù)組

    let arrayLike = {

    '0': 'a',

    '1': 'b',

    '2': 'c',

    '3': 'd',

    length: 4

    }

    // ES5 寫法

    let arr1 = [].slice.call(arrayLike) // ['a', 'b', 'c', 'd']



    // ES6

    let arr2 = Array.from(arrayLike) // ['a', 'b', 'c', 'd']

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    十八、Array.of() 方法用于將一組值轉化為數(shù)組

    Array.of總是返回參數(shù)值組成的數(shù)組。如果沒有參數(shù),就返回一個空數(shù)組。



    Array.of(1, 2, 3, 4, 5) // [1, 2, 3, 4, 5]

    Array.of('abcd') // ['abcd']

    Array.of('abcd').length // 1

    Array.of() // []



    // Array.of 方法的實現(xiàn)

    function ArrayOf () {

    return [].slice.call(arguments)

    }

    1

    2

    3

    4

    5

    6

    7

    8

    9

    十九、數(shù)組實例的 find() 和 findIndex()

    數(shù)組實例的 find() 方法,用于找出第一個符合條件的數(shù)組成員

    它的參數(shù)是一個回調函數(shù),所有數(shù)組成員依次執(zhí)行該回調函數(shù),直到找出第一個返回值為 true 的成員,然后就返回該成員,如果沒有符合條件的成員,則返回 undefined

    let arr = [1, 2, 3, 4, 5]

    let value= arr.find((item, index, array) => {

    // item 表示循環(huán)遍歷數(shù)組的每一項

    // index 每一項對應的索引值

    // array 原數(shù)組對象

    return item > 3

    })

    console.log(value) // 4

    console.log(arr) // [1, 2, 3, 4, 5]



    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    數(shù)組實例的 findIndex方法的用法與find方法非常類似,返回第一個符合條件的數(shù)組成員的位置,如果所有成員都不符合條件,則返回 -1

    let arr = [1, 2, 3, 4, 5]

    let index = arr.findIndex((item, index, array) => {

    return item > 3

    })



    console.log(index) // 3



    [NaN].indexOf(NaN) // -1

    [NaN].findIndex(value => Object.is(NaN, value)) // 0

    [NaN].includes(NaN) // true

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    由此可見:一般用來判斷數(shù)組中是否存在某個值,推薦使用 includes



    二十、扁平化數(shù)組 flat() 方法 -----> 不會改變原數(shù)組

    let arr = [1, [2, 3, [4, 5, [6]]]]

    let arrFlat = arr.flat(Infinity)

    console.log(arrFlat) // [1, 2, 3, 4, 5, 6]

    console.log(arr) // [1, [2, 3, [4, 5, [6]]]]

    1

    2

    3

    4

    利用遞歸實現(xiàn)數(shù)組扁平化



    let arrayFlat = []

    let myFlat = (arr) => {

    for (let i = 0; i < arr.length; i++) {

    let item= arr[i]

    // 判斷 arr[i] 是否是數(shù)組

    if (Array.isArray(item)) {

    // 如果是數(shù)組,繼續(xù)調用函數(shù) myFlat

    myFlat(item)

    } else {

    arrayFlat.push(item)

    }

    }

    return arrayFlat

    }



    藍藍設計www.miumiuwan.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計  ipad界面設計 、 包裝設計 、 圖標定制  用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務

分享本文至:

日歷

鏈接

個人資料

藍藍設計的小編 http://www.miumiuwan.com

存檔