js數(shù)組方法使用詳解(一)

數(shù)組是什么?

數(shù)組是一種儲存多個值的數(shù)據(jù)類型
數(shù)組是由方括號包裹的多個值。其中每個值稱為數(shù)組元素。
數(shù)組是一種由簡單數(shù)據(jù)類型組成的復雜數(shù)據(jù)類型

創(chuàng)建數(shù)組的方法有:

創(chuàng)建數(shù)組直接量:

const arr = ['ty','liu']

構建函數(shù)法:

var arr = new Array('ewe',164,true)
new Array()
new String()
new Boolean()
new Number()
//new : 新的(new一個對象,new一個新數(shù)組)

數(shù)組的特點:

數(shù)組的第一個元素的索引是0,數(shù)組的第二個元素的索引是1,數(shù)組的最后一個元素的索引是數(shù)組負1,所以數(shù)組是有索引的

如何訪問數(shù)組元素:

使用方括號訪問數(shù)組元素

如何遍歷數(shù)組:

可以用for 循環(huán)來作。
for of循環(huán)
array.forEach()

array.length

定義
array.length用來檢測數(shù)組的長度
語法
主人是數(shù)組
參數(shù):
length是屬性,沒有參數(shù)
返回值
返回新數(shù)組長度

Array.isArray()

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

-Array.isArray(value)

-value:是要檢測的值
返回值
-true : 如果是數(shù)組,返回true
-false : 如果不是數(shù)組,返回false
示例(原則:用最簡單的例子呈現(xiàn)知識點原理)

var str = 'hrllo wolrd'
var arr = [1,2,3]
console.log(Array.isArray(str))
console.log(Array.isArray(arr))

array.push

定義
array.push將新元素添加到數(shù)組的末尾
語法

array.push(item1,item2,...,itemX)

item1:要添加的元素
item2:一次可以添加多個元素,多個元素之間用逗號隔開
返回值
返回新數(shù)組長度

示例

var arr = [1,2,3]
arr.push(4)//4
arr.push(4,5,6)//7

array.unshift()

定義
unshift將新元素添加到數(shù)組的開頭,并返回新的長度。
語法

array.unshift(item1, item2, ..., itemX)

參數(shù):
item1:要添加的元素
item2:一次可以添加多個元素
返回值
表示數(shù)組的新長度。
示例

var fruits = ["Bana", "Orae", "Ale", "Mgo"]
fruits.unshift("Len","Pineae")

array.pop()

定義
array.pop刪除數(shù)組的最后一個元素,并返回該元素
語法

array.pop()

無參數(shù)
返回值
被刪除的數(shù)組項
示例

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

array.shift

定義
刪除數(shù)組的第一個元素,并返回該元素。
語法

array.shift()

參數(shù):
無參數(shù)
返回值
返回被刪除的數(shù)組項目
示例

var arr = [1,2,3,4]
arr.shift()

array.reverse

定義
返回反轉數(shù)組中元素的順序
語法

array.reverse()

參數(shù):
無參數(shù)
返回值
返回反轉后的數(shù)組
示例

var arr =[1,2,3,4]
    arr.reverse()
    console.log(arr)

array.join

定義
將數(shù)組的所有元素連接成一個字符串
語法

array.join(separator)

參數(shù):
要使用的分隔符,
如果省略,元素用逗號分隔
返回值
返回字符串值,數(shù)組值,由指定的分隔符分隔。
示例

var arr = ["dfdsf", "rtdf", "ardssa", "dfgre"];
var we = arr.join();

array.concat

定義
連接兩個或多個數(shù)組,并返回已連接數(shù)組的副本。
語法

array1.concat(array2, array3, ..., arrayX)

參數(shù):
要連接的數(shù)組
返回值
返回已連接的數(shù)組
示例

var arr = ["12", "33"];
var str = ["we", "3yu", "230"];
var ad = arr.concat(str);

array.indexOf

定義
在數(shù)組中搜索元素,從末尾開始,并返回其位置。
語法

array.lastIndexOf(item, start)

參數(shù):
item : 要搜索的項目
start : 負值的給定的位置從末尾計數(shù),然后搜索到開頭
返回值
返回指定項目的位置,否則 -1
示例

var arr = ["dfdsf", "rtdf", "ardssa", "dfgre"];
var a = arr.lastIndexOf("ardssa");

array.splice

定義
從數(shù)組中添加/刪除元素。
語法

array.splice(index, howmany, item1, ....., itemX)

參數(shù):
index : 整數(shù),指定在什么位置添加/刪除項目,使用負值指定從數(shù)組末尾開始的位置。
howmany : 要刪除的項目數(shù)。如果設置為 0,則不會刪除任何項目。
item1, ..., itemX : 要添加到數(shù)組中的新項目。
返回值
新數(shù)組,包含刪除的項目(如果有)。
示例

var arr = ["dfdsf", "rtdf", "ardssa", "dfgre"];
arr.splice(2, 0, "Lemon", "Kiwi");

array.sort

定義
對數(shù)組的元素進行排序。
語法

array.sort(compareFunction)

參數(shù):
compareFunction:定義替代排序順序的函數(shù)。該函數(shù)應返回負值、零值或正值,具體取決于參數(shù),例如:

function(a, b){return a-b}

sort() 方法比較兩個值時,將值發(fā)送給比較函數(shù),根據(jù)返回的(負、零、正)值對值進行排序。
返回值
返回項目排序
示例

 var arr1 =[4,5,6,7,8,9]
 arr1.sort()
 console.log(arr1)

array.forEach()

定義
forEach() 方法按順序為數(shù)組中的每個元素調用一次函數(shù)。
使用指定函數(shù)遍歷數(shù)組
語法

array.forEach(function(currentValue, index, arr), thisValue)

function:第一個參數(shù)是第一個函數(shù)
當執(zhí)行forEach()
返回值
undefined
示例

var  arr  =  [1,2,3]
arr.forEach(function(item, index, arr){
console.log(item, index, arr)
//console.log(1,0,[1,2,3])
//console.log(2,1,[1,2,3])
//console.log(3,2,[1,2,3])
})

array.map()

定義
方法使用為每個數(shù)組元素調用函數(shù)的結果創(chuàng)建新數(shù)組
語法

array.map(function(currentValue, index, arr), thisValue)

參數(shù):
function: 遍歷數(shù)組的函數(shù)。必須。
item: 接收數(shù)組元素的形參,必須。
index: 接收數(shù)組索引的形參,可選。
arr: 接收當前數(shù)組的形參,可選。
this: 修改函數(shù)內的this指向,默認值undefined,可選。
返回值
返回數(shù)組,包含為原始數(shù)組中的每個元素調用提供的函數(shù)的結果。
示例

let fa= []
        //map
        fa=people.map(function(item){
        return item[1] + item[0]
        })
        console.log(fa)

array.filter()

定義
方法創(chuàng)建數(shù)組,其中填充了所有通過測試的數(shù)組元素
語法

array.filter(function(currentValue, index, arr), thisValue)

返回值
返回符合條件的新數(shù)組
示例

ad = people.filter(function(item){
        return item[2] > 30
        })
        console.log(ad)

array.every()

定義
檢查數(shù)組中的所有元素是否都通過了測試(被作為函數(shù)提供)。
語法

array.every(function(currentValue, index, arr), thisValue)

返回值
如果數(shù)組中的所有元素都通過測試,則返回 true,否則返回 false.(布爾值)
參數(shù):
currentValue:當前元素的值。
index:當前元素的數(shù)組索引。
arr:當前元素所屬的數(shù)組對象
示例

var arr1 = [1,2,3]
        var arr2 = arr1.every(function(item,index,arr){
            return item > 1
        })
        console.log(arr2)// item > 0 ervery()返回fasle

array.find()

定義
返回數(shù)組中第一個通過測試的元素的值(作為函數(shù)提供)。
語法

array.find(function(currentValue, index, arr), thisValue)

返回值
數(shù)組中的任何元素通過測試,則返回數(shù)組元素值,否則返回 undefined。
參數(shù):
currentValue:當前元素的值。
index:當前元素的數(shù)組索引。
arr:當前元素所屬的數(shù)組對象
示例

 var arr1 = [1,2,3,2]
        var arr2 = arr1.find(function(item,index,arr){
            return item === 8
        })
        console.log(arr2)

array.findIndex()

定義
返回數(shù)組中通過測試的第一個元素的索引(作為函數(shù)提供)。
語法

array.findIndex(function(currentValue, index, arr), thisValue)

返回值
如果數(shù)組中的任何元素通過測試,則返回數(shù)組元素索引,否則返回 -1。
參數(shù):
currentValue:當前元素的值。
index:當前元素的數(shù)組索引。
arr:當前元素所屬的數(shù)組對象
示例

var ages = [4, 12, 16, 20];
function checkAdult(age) {
  return age >= document.getElementById("ageToCheck").value;
}
function myFunction() {
  document.getElementById("demo").innerHTML = ages.findIndex(checkAdult);
}

array.reduce()

定義
將數(shù)組縮減為單個值。
語法

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

返回值
返回上次調用回調函數(shù)的累積結果。
參數(shù):
total:initialValue,或函數(shù)先前返回的值。
currentValue:當前元素的值。
index:當前元素的數(shù)組索引。
arr:當前元素所屬的數(shù)組對象
示例

var arr2 = arr1.reduce(function(sum,item,index,arr){
            return sum += item
        },0)
        console.log(arr2)

array.some()

定義
檢查數(shù)組中的任何元素是否通過測試(作為函數(shù)提供)。
語法

array.some(function(currentValue, index, arr), thisValue)

返回值
如果數(shù)組中的任何元素通過測試,則返回 true,否則返回 false。
參數(shù):
currentValue:當前元素的值。
index:當前元素的數(shù)組索引。
arr:當前元素所屬的數(shù)組對象
示例

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

相關閱讀更多精彩內容

  • 首先我們得知道數(shù)組是什么?(是什么呢?_?) 數(shù)組是一種數(shù)據(jù)類型 數(shù)組可以儲存不同數(shù)據(jù)類型的數(shù)據(jù)(啥都可以存哦!(...
    勞模閱讀 1,227評論 1 22
  • 本文會先介紹所有數(shù)組方法,再詳細介紹其中的reduce(引申閱讀:redux中的compose函數(shù)),接著介紹in...
    zpkzpk閱讀 504評論 0 1
  • 數(shù)組的排序 sort()方法排序問題。 sort()方法是Array原型鏈上自帶的方法。 默認排序順序是根據(jù)字符串...
    無跡落花閱讀 656評論 1 0
  • 需求: js數(shù)組(Array)方法匯總 索引: 對數(shù)組方法的學習和匯總,分為三大類: 一,改變原數(shù)組的方法(10種...
    shine001閱讀 2,173評論 3 40
  • 數(shù)組方法備忘單: 添加/刪除元素:push(...items) —— 向尾端添加元素,pop() —— 從尾端提取...
    個人觀察日記閱讀 460評論 0 0

友情鏈接更多精彩內容