JS數(shù)組初學(xué)者簡解(作者拔發(fā)而作)

首先我們得知道數(shù)組是什么?(是什么呢?_?)

  • 數(shù)組是一種數(shù)據(jù)類型
  • 數(shù)組可以儲存不同數(shù)據(jù)類型的數(shù)據(jù)(啥都可以存哦!(●'?'●))

創(chuàng)建數(shù)組

怎么創(chuàng)建數(shù)組呢?有兩個方法直接量法構(gòu)造函數(shù)法

直接量法

const arr = ['zhangsan','lisi']

構(gòu)造函數(shù)法

定義:構(gòu)造函數(shù)就是構(gòu)造對象的一種模具(函數(shù))
構(gòu)造函數(shù)的語法:任何一個構(gòu)造函數(shù)在構(gòu)造對象的時候必須遵循固定語法(這里必須記住哦,是固定的用法!(╯▔皿▔)╯):

new Array()
new String()
new Boolean()
new Number()

//new : 新的(new一個對象,new一個新數(shù)組)

Array()(沒看錯,就是這樣用(●ˇ?ˇ●),平常我們都是用直接法做的(づ ̄3 ̄)づ╭?~)

var arr = new Array('hehe',1314,true)

數(shù)組的特點(diǎn)

1. 數(shù)組是有索引的

  • 數(shù)組的第一個值的索引是0
  • 第二個是1
  • ......
  • 最后一個的是數(shù)組的長度length-1

2. 數(shù)組的比較

  • 簡單數(shù)組類型比較值(內(nèi)存中的值)
  • 復(fù)雜數(shù)據(jù)類型比較址(內(nèi)存中的地址)
  • 簡單數(shù)據(jù)類型復(fù)制是復(fù)制值
  • 復(fù)雜數(shù)據(jù)類型復(fù)制是復(fù)制址

如何訪問數(shù)組

使用方括號加下標(biāo)訪問數(shù)組元素(別用錯了,是下標(biāo),別第一個就用1,第一個得用0!╰(‵□′)╯)

const arr = [1,2,3]
arr[0] //1
arr[1] //2
arr[2] //3
arr[3] //undefined

遍歷數(shù)組的方法

  1. for 循環(huán)
var arr = ['hello',200,true,[1,2,3],null]
        for(let i = 0 ; i < arr.length ; i++){
            console.log(Array.isArray(arr[i]))
        }
  //先返回3次false 再返回1次true 最后返回一次false
  1. forEach
var arr = ['hello',200,true,[1,2,3],null]
        arr.forEach(x=>{
            console.log(Array.isArray(x))
        })
    //先返回3次false 再返回1次true 最后返回一次false

array.length

定義:返回?cái)?shù)組的長度
語法:

  1. 主人是數(shù)組
  2. length是屬性,沒有參數(shù)

返回值:數(shù)組的長度

  • 注意: length-1是任何一個數(shù)組最后一個元素
  • []空數(shù)組的length是0

數(shù)組的方法

很多的欸,我肯定不會一下給你全部列出來啊,可以去W3C(https://www.w3school.com.cn/jsref/jsref_obj_array.asp)去看哦(●'?'●)

Array.isArray

定義:Array.isArray()方法用來檢測是否是數(shù)組
語法:

Array.isArray(value)
  • value:是要檢測的值

返回值:

  • true:如果是數(shù)組,返回true
  • false:如果不是數(shù)組,返回false

實(shí)例

var arr = [[1,2],'12']
console.log(Array.isArray(arr[0])) //返回true
console.log(Array.isArray(arr[1])) //返回false

array.push()

定義:array.push()用來在數(shù)組末尾添加元素
語法:

array.push('iteam1','iteam2','iteam3'....,'iteamx')
  • 可以添加多個元素
    返回值:返回新數(shù)組的長度
    實(shí)例
var arr = [1,2]
arr.push(3)
console.log(arr) 

結(jié)果

6

array.pop()

定義:刪除數(shù)組的最后一個元素
語法:

array.pop() //無參數(shù)

返回值:返回刪除元素
實(shí)例

var arr = [1,2,3]
var str = arr.pop()
console.log(str) //返回3

array.unshift()

定義:再數(shù)組前添加元素
語法:

array.unshift('iteam1','iteam2'...,'iteamX') //可添加多個元素

返回值:返回新數(shù)組長度
實(shí)例

var arr = [1,2]
arr.unshift(3)
console.log(arr) // 返回3

array.shift()

定義:刪除數(shù)組的第一個元素
語法:

array.shift() //無參數(shù)
  • 無參數(shù)

返回值:返回刪除元素
實(shí)例

var arr = [1,2,3]
var str = arr.shift()
console.log(str) //返回1

array.join()

定義:將數(shù)組通過連接符連接成一個字符串
語法:

array.join('鏈接符') //這個連接符啥都可以是

返回值:返回一個新的字符串

實(shí)例

var arr = ['apple','banner']
console.log(arr.join('and'))

結(jié)果

'appleandbanner'

array.reverse()

定義:反轉(zhuǎn)數(shù)組中元素的順序
語法:

array.reverse()  //無參數(shù)
  • 無參數(shù)

返回值:反轉(zhuǎn)后的數(shù)組
實(shí)例

var arr = ['hello',200,true,[1,2,3],null]
console.log(arr.reverse()) 

結(jié)果

['null',[1,2,3],true,200,'hello'] //相反

array.sort()

定義:可以對數(shù)組的元素按照字母或者數(shù)字進(jìn)行升序或降序重新排列,默認(rèn)是升序排列
注意:
● sort默認(rèn)是升序
● sort默認(rèn)是按照unicode編碼排序
語法:

array.sort()

參數(shù):
function(a,b){return a - b}
sort()方法比較兩個值時,將值發(fā)送給比較函數(shù),根據(jù)返回的(負(fù)、零、正)值對值進(jìn)行排序。

返回值:新數(shù)組
實(shí)例1

var arr = [2,,'a',5,0,'6',3,'7','t',1,]
console.log(arr.sort(
            arr.sort((a,b)=>{
            return a > b
        } 
        ))//升序排列

array.indexOf()

定義 :在數(shù)組中查詢指定元素。
注意:indexOf()只會返回第一次出現(xiàn)的位置
語法:

array.indexOf('x')

返回值:返回它的位置,未找到返回-1
實(shí)例

var arr = [1,2,3,4]
console.log(arr.indexOf(2))
//返回值為1
console.log(arr.indexOf(9))
//返回值為-1

array.concat()

定義:用于鏈接兩個或者多個數(shù)組
語法:

arr.concat(arr1,arr2,...,arrx)

返回值:返回一個新數(shù)組,不會修改原有數(shù)組
實(shí)例

var arr1= ["S60", "S90"];
var arr2 = ["XC40", "XC60", "XC90"];
var Volvo = arr1.concat(arr2);

array.slice()

定義:截取選取的部分?jǐn)?shù)組形成一個新的數(shù)組
語法:

arr.slice(start,end)

注釋:start為開始會獲取,end為結(jié)束,不會獲取
返回值:返回一個新的數(shù)組,不會改變原有數(shù)組
實(shí)例

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);
//citrus = ['Orange','Lemon']

array.forEach()

  • array:數(shù)組
  • for:為了......
  • Each:每一個

定義:方法按順序?yàn)閿?shù)組中的每個元素調(diào)用一次函數(shù)

語法:

array.forEach(function(currentValue, index, arr), thisValue)
  • function:是一個函數(shù)
    • 當(dāng)執(zhí)行forEach()方法的時候,每個數(shù)組元素都會調(diào)用一次函數(shù)參數(shù)
    • 在調(diào)用函數(shù)的時候,可以傳入以下參數(shù):
      • currentValue:數(shù)組中的每一個元素
      • index:表示數(shù)組的索引
      • arr:表示當(dāng)前數(shù)組
  • thisValue:設(shè)置this指向

返回值:undefined

實(shí)例:

var arr = [1,2,3]

arr.forEach(function(x,index,arr){
            arr[index] = x+3
        })
console.log(arr)//返回[4,5,6]

array.map()

定義:方法按順序?yàn)閿?shù)組中的每個元素調(diào)用一次函數(shù)

語法:

array.map(function(currentValue, index, arr), thisValue)
  • function:是一個函數(shù)
    • 當(dāng)執(zhí)行map()方法的時候,每個數(shù)組元素都會調(diào)用一次函數(shù)參數(shù)
    • 在調(diào)用函數(shù)的時候,可以傳入以下參數(shù):
      • currentValue:數(shù)組中的每一個元素
      • index:表示數(shù)組的索引
      • arr:表示當(dāng)前數(shù)組
  • thisValue:設(shè)置this指向

返回值:數(shù)組

實(shí)例:

var arr = [1,2,3]

console.log(arr.map(function(x,index,arr){
        return   arr[index] = x+3
        }))//返回[4,5,6]

array.filter()

定義:方法創(chuàng)建數(shù)組,且按順序?yàn)閿?shù)組中的每個元素調(diào)用一次函數(shù)

語法:

array.filter(function(currentValue, index, arr), thisValue)
  • function:是一個函數(shù)
    • 當(dāng)執(zhí)行filter()方法的時候,每個數(shù)組元素都會調(diào)用一次函數(shù)參數(shù)
    • 在調(diào)用函數(shù)的時候,可以傳入以下參數(shù):
      • currentValue:數(shù)組中的每一個元素
      • index:表示數(shù)組的索引
      • arr:表示當(dāng)前數(shù)組
  • thisValue:設(shè)置this指向

返回值: 包含所有通過測試的數(shù)組元素的數(shù)組。如果沒有元素通過測試,則返回一個空數(shù)組。

實(shí)例:

var arr = [1,2,3]

console.log(arr.filter(function(x,index,arr){
        return   x > 2
        }))//返回[3]

array.every()

定義:檢測數(shù)組中的所有元素是否通過測試

語法:

array.every(function(currentValue, index, arr), thisValue)
  • function:是一個函數(shù)
    • 當(dāng)執(zhí)行every()方法的時候,每個數(shù)組元素都會調(diào)用一次函數(shù)參數(shù)
    • 在調(diào)用函數(shù)的時候,可以傳入以下參數(shù):
      • currentValue:數(shù)組中的每一個元素
      • index:表示數(shù)組的索引
      • arr:表示當(dāng)前數(shù)組
  • thisValue:設(shè)置this指向

返回值: true 或者 false

實(shí)例:

var arr = [1,2,3]

console.log(arr.every(function(x,index,arr){
        return   x > 2
        }))//返回false

array.find()

定義:為數(shù)組內(nèi)每個元素進(jìn)行一次函數(shù)

語法:

array.find(function(currentValue, index, arr), thisValue)
  • function:是一個函數(shù)
    • 當(dāng)執(zhí)行find()方法的時候,每個數(shù)組元素都會調(diào)用一次函數(shù)參數(shù)
    • 在調(diào)用函數(shù)的時候,可以傳入以下參數(shù):
      • currentValue:數(shù)組中的每一個元素
      • index:表示數(shù)組的索引
      • arr:表示當(dāng)前數(shù)組
  • thisValue:設(shè)置this指向

返回值:返回?cái)?shù)組中通過第一次測試的元素,沒有就返回undefined

實(shí)例:

var arr = [1,2,3]

console.log(arr.find(function(x,index,arr){
        return   x >= 2
        }))//返回[2]

array.findIndex()

定義:按順序?yàn)閿?shù)組中的每個元素調(diào)用一次函數(shù)

語法:

array.findIndex(function(currentValue, index, arr), thisValue)
  • function:是一個函數(shù)
    • 當(dāng)執(zhí)行findIndex()方法的時候,每個數(shù)組元素都會調(diào)用一次函數(shù)參數(shù)
    • 在調(diào)用函數(shù)的時候,可以傳入以下參數(shù):
      • currentValue:數(shù)組中的每一個元素
      • index:表示數(shù)組的索引
      • arr:表示當(dāng)前數(shù)組
  • thisValue:設(shè)置this指向

返回值: 返回?cái)?shù)組中第一次通過測試的元素的索引。沒有返回-1

實(shí)例:

var arr = [1,2,3]

console.log(arr.findIndex(function(x,index,arr){
        return  x > 2
        }))//返回2

array.reduce()

定義:從左到右,將數(shù)組中的值進(jìn)行縮減到一個值

語法:

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
  • 參數(shù)function(total, currentValue, currentIndex, arr) 必須
    • total 必須
    • currenValue 必須

返回值:返回相減之后得到的值

實(shí)例:

var numbers = [175, 50, 25];
console.log(numbers.reduce(function(a,b){
    return a - b
})
            //打印 100

array.some()

定義:檢測數(shù)組中的一些元素是否通過測試

語法:

array.some(function(currentValue, index, arr), thisValue)
  • function:是一個函數(shù)
    • 當(dāng)執(zhí)行some()方法的時候,每個數(shù)組元素都會調(diào)用一次函數(shù)參數(shù)
    • 在調(diào)用函數(shù)的時候,可以傳入以下參數(shù):
      • currentValue:數(shù)組中的每一個元素
      • index:表示數(shù)組的索引
      • arr:表示當(dāng)前數(shù)組
  • thisValue:設(shè)置this指向

返回值: true 或者 false

實(shí)例:

var arr = [1,2,3]

console.log(arr.some(function(x,index,arr){
        return   x > 2
        }))//返回 true
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容